A store information visualization method based on mobile AR

Abstract

A shop information visualization method based on mobile AR belongs to the field of information visualization, comprising: according to user demand and APP function design principle, dividing homepage recommendation, collection, personal information, scroll function, real-time recommendation, map, comment label, characteristic label, help and label setting; mapping label design and visual channel, converting different information of the shop into different visual channels, and then dividing the information into different levels according to user demand; calculating the font size suitable for different devices; establishing a geographic fence, calculating the distance between the user device and the shop, judging whether the shop is located within the preset radius, and presenting the label according to the distance between the shop and the user device. The present application effectively maps the user demand and the label visualization in mobile augmented reality, enhances the readability and intuitiveness of the information, reduces the occlusion and redundancy of the information, improves the efficiency and convenience of information acquisition, and makes the data display more intuitive and easy to understand.

Description

Technical Field

[0001] The present invention belongs to the technical field of information visualization, and in particular relates to a store information visualization method based on mobile AR. Background Art

[0002] Mobile augmented reality (MAR) is an interactive experience that combines mobile technology with augmented reality (AR). Using devices like smartphones and tablets equipped with AR technology, it allows users to enter a virtual world anywhere, anytime, for an immersive visual and auditory experience. Using AR to combine geographic context with AR information can help users reduce cognitive load and improve information acquisition efficiency (Zhu Ying. Research on Text Style Readability of Optical Head-Mounted Display Based on Augmented Reality [D]. Zhejiang Sci-Tech University, 2023). Therefore, it can be used in traditional commercial street scenes to help users obtain environmental information.

[0003] Grasset et al. proposed an image-driven view management method (Rokhsaritalemi S, Ko BS, Sadeghi-Niaraki A, et al. Geospatial Augmented Reality Tourist System[C] / / 2023 IEEE Conference on Virtual Reality and 3D User Interfaces Abstractsand Workshops(VRW). IEEE, 2023: 611-612.). This method combines visual saliency algorithms with edge analysis to identify potentially important image regions and geometric constraints for label placement, thereby improving the visual quality of annotated AR environments. Leykin et al. used pattern recognition methods to automatically divide background images into readable and unreadable areas, selecting the readable areas as the background for text annotations, thereby improving the readability of the text content (Leykin A, Tuceryan M. Automatic determination of text readability over textured backgrounds for augmented reality systems[C] / / Third IEEE and ACM International Symposium on Mixed and Augmented Reality. IEEE, 2004: 224-230.). Zhang Bo et al. proposed an annotation system to enhance tourist videos by adding videos to 3D models, showing how to adjust the visibility of annotations in videos without too many cluttered images while maximizing the number of annotations (Zhang B, Li Q, Chao H, et al. Annotating and navigating tourist videos [C] / / Proceedings of the 18th SIGSPATIAL International Conference on Advances in Geographic Information Systems. 2010: 260-269.).Grasset et al. proposed a framework that combines visual saliency with edge analysis to identify potentially important image regions and geometric constraints for placing labels to improve the display of various annotations with historical or landmark information in urban environments (Grasset R, Langlotz T, Kalkofen D, et al. Image-driven view management for augmented reality browsers[C] / / 2012 IEEE International Symposium on Mixed and Augmented Reality(ISMAR).IEEE,2012:177-186.). Orlosky et al. conducted user experiments and let users overlay text onto videos in real time. The experiment found that walls, roads, leaves, shadows, gray variations, vertical direction and uniformity were the most targeted scene features for overlay (Orlosky J, Kiyokawa K, Takemura H. Towards intelligent view management: A study of manual text placement tendencies in mobile environments using video see-through displays[C] / / 2013 IEEE International Symposium on Mixed and Augmented Reality(ISMAR). IEEE, 2013: 281-282.).

[0004] The above method conducts technical research on label placement, aiming to enhance the readability of label content and minimize its obstruction of the real background. However, current research on label visualization design is insufficient. In traditional commercial street scenarios, users need to access a rich and diverse range of information, and simply improving label readability cannot meet user needs. Furthermore, mobile devices have small display screens and cannot display much information. Therefore, it is necessary to design the visualization of the label itself and determine the mapping relationship between data and visualization to improve user information acquisition efficiency and help users obtain information conveniently. Summary of the Invention

[0005] Existing methods fail to consider the visual effects of labels themselves, merely addressing the occlusion between label placement and the real-world background. This invention provides a method for visualizing store information based on mobile AR. By studying the visualization of labels in augmented reality, this invention proposes a method for mapping user demand data to functional settings and label visualization in mobile AR. Specifically, it relates to a method for visualizing store information using mobile AR in traditional commercial street scenarios.

[0006] The technical solutions adopted by the present invention to solve the technical problems are as follows:

[0007] The present invention provides a store information visualization method based on mobile AR, which mainly includes the following steps:

[0008] Step S1: Functional division;

[0009] The system is divided into two parts: home page and AR interface. According to user needs and the functional design principles of APP, it is divided into home page recommendation x1, collection x2, personal information x3, barrage function x4, real-time recommendation x5, map x6, negative review label x7, featured label x8, help x9 and label setting x 10 ;

[0010] Step S2: information hierarchical division;

[0011] Map label design to visual channels, divide information into different levels according to user needs, and then convert different store information into different visual channels;

[0012] Step S3: Calculate font sizes suitable for different devices;

[0013] The formula for calculating the minimum font size that adapts to different device screen sizes is as follows:

[0014] p=0.0365×(D 1.43 / S 0.083 )

[0015] Where D represents the device screen usage distance in centimeters; S represents the device screen size in inches;

[0016] Step S4: Establish a geo-fence, calculate the distance between the user device and the store, determine whether the store is within a preset radius around the user device, and present a certain number of tags based on the distance between the store and the user device.

[0017] Furthermore, in step S1, the user needs include preference recommendation y1, strategy planning y2, companionship needs y3, suggestion provision y4, location distance y5, lightning avoidance guide y6 and characteristic cultural needs y7.

[0018] Furthermore, in step S1 , the functional design principles of the APP include user cognition 1 , user information 2 , user support 3 , user usage 4 and user interaction 5 .

[0019] Furthermore, in step S2, the information level is divided into a first-level label, a second-level label and a third-level interface; the first-level label presents the store name z1, store popularity z2, store rating z3, store type z4, and evaluation label z5; the second-level label presents the store name z1, store rating z3, number of reviews z6, average price z7, and detailed rating z8; the third-level interface includes the store name z1, store rating z3, number of reviews z6, average price z7, detailed rating z8, detailed evaluation label z9, and detailed evaluation z1. 10 、Store discounts 11 、Recommended dishes 12 .

[0020] Furthermore, the store popularity z2: uses a color coding method: 1 is red, 2 is yellow, and 3 is blue. The color coding method includes setting the popularity order represented by the color code, and setting the popular, unpopular, and ordinary stores to red 1, yellow 2, and blue 3 respectively; the store rating z3: uses numbers to represent the store rating, which blocks less background. Small labels with the same background color as the store name z1 represent selected good reviews, and gray labels represent selected bad reviews; the store type z4: is represented by dark patterns, and five store types are divided according to the survey results: gift shops, clothing stores, beverage stores, food stores, and beauty stores; the evaluation label z5: presents a certain number of small labels of good and bad reviews. The color of the good review label follows the color of the store popularity, and the color of the bad review label uses gray.

[0021] Furthermore, the three-level interface is not added to the real environment in the form of labels, but is directly displayed on the mobile phone screen.

[0022] Furthermore, in step S3, for all devices, the font size of the basic content is at least 40% larger than the recommended minimum font size, and the font size of the enhanced content is at least 80% larger than the recommended minimum font size.

[0023] Furthermore, in step S4, three fixed radii r1, r2, and r3 are set, corresponding to the three distances of near, medium, and far, respectively, and the location of the user device is used as the center of the circle to form a geo-fence with radii r1, r2, and r3.

[0024] Furthermore, in step S4, the location of each store is determined by latitude and longitude (lat i ,lon i ), where i represents the index of the store, lat i Indicates the current latitude of store i, loni Denote the current longitude of store i; the distance between the user device and the store is: R represents the radius of the earth (about 6,371 km), Δlat = lat i -lat represents the latitude difference between the store and the location of the user device, Δlon = lon i -lon represents the longitude difference between the store and the location of the user device, lat represents the current latitude of the user device, and lon represents the current longitude of the user device.

[0025] Furthermore, in step S4, when the store is within the range of d ≤ r1, r1 < d ≤ r2, r2 < d ≤ r3, one layer of labels is displayed and at most two labels are displayed.

[0026] The beneficial effects of the present invention are:

[0027] The present invention effectively maps user requirements to the visualization of labels in mobile augmented reality, and at the same time sets the information that different levels of labels should present according to the user's cognitive process of stores, greatly improving the efficiency and experience of users in obtaining store information in traditional commercial streets. Compared with the prior art, the present invention has the following advantages:

[0028] 1. The present invention optimizes information display using visual elements such as color coding and digital scoring, enhancing the readability and intuitiveness of information.

[0029] 2. The present invention ensures the readability of information on various devices through a design that adapts to the screen sizes and usage distances of different devices.

[0030] 3. The geofencing technology adopted in the present invention intelligently displays information according to the relative positions of the user and the store, reducing information occlusion and redundancy.

[0031] 4. The present invention improves the efficiency and convenience of information acquisition. The visualization effect of the labels conforms to the user's cognition, and through technological innovation, the user interaction experience is enhanced, making the display of data more intuitive and easy to understand. Description of the Drawings

[0032] Figure 1 It is the corresponding relationship between requirements, functions, and usability principles of the mobile augmented reality system.

[0033] Figure 2 It is that each store type in the present invention has a corresponding identification design.

[0034] Figure 3 It is the visual effect of the overall label and the specific content presented.

[0035] Figure 4This is a demonstration of the actual interface effect. In the figure, (a) AR homepage; (b) tag interaction; (c) store details. DETAILED DESCRIPTION

[0036] The present invention is further described in detail below with reference to the accompanying drawings.

[0037] The present invention provides a store information visualization method based on mobile AR, and its specific implementation process is as follows:

[0038] Step S1: Functional division;

[0039] First, a user needs survey is needed, which includes literature research based on consumer shopping behavior, in-depth interviews and field surveys, as well as crawling review data from Dianping.com. Through these methods, we can understand the behavioral patterns and information needs of users in the commercial street, thereby providing a basis for subsequent label design; label design is carried out in combination with the survey results, which involves the design of visual styles such as color, shape, size, etc., to ensure that the visual effect of the label is effectively mapped to the relevant content. At the same time, attention should be paid to the user's cognitive habits to ensure that the data display is intuitive and easy to understand.

[0040] like Figure 1 As shown, the system is divided into two parts: the home page and the AR interface. According to user needs, including favorite recommendation y1, strategy planning y2, companionship needs y3, suggestion provision y4, location distance y5, minefield guide y6, and characteristic cultural needs y7, and the functional design principles of APP, including user cognition 1, user information 2, user support 3, user use 4, and user interaction 5, the home page recommendation x1, collection x2, personal information x3, barrage function x4, real-time recommendation x5, map x6, bad review label x7, characteristic label x8, help x9, label setting x1 are divided. 10 and other functions.

[0041] Step S2: information hierarchical division;

[0042] Map label design to visual channels, divide information into different levels according to user needs, and then convert different store information into different visual channels. The specific information level division is as follows:

[0043] (a) Primary label

[0044] The first-level label is a conceptual level that provides the most basic and critical information. The first-level label includes the store name z1, store popularity z2, store rating z3, store type z4, and evaluation label z5.

[0045] ① Store popularity z2: Use color coding method: 1 is red, 2 is yellow, and 3 is blue. This color coding method includes setting the popularity order represented by the color code, and setting the popular, unpopular, and ordinary stores to red 1, yellow 2, and blue 3 respectively.

[0046] ② Store Rating z3: Use numbers to represent store ratings, replacing the star symbols in traditional review software, and less obstructing the background. Small labels with the same background color as the store name z1 represent selected positive reviews, while gray labels represent selected negative reviews.

[0047] ③ Store Type z4: Use dark patterns to represent store types. According to the survey results, five store types are divided, namely gift shops, clothing stores, beverage stores, food stores, and beauty stores. Each store type has a corresponding logo, such as Figure 2 shown.

[0048] ④ Evaluation label z5: presents a certain number of positive and negative review labels. The color of the positive review label follows the store popularity color, and the color of the negative review label is gray.

[0049] (b) Secondary label

[0050] The secondary label is the detail level. When the user is interested in a store in the primary label, the secondary label provides more detailed information, but still needs to be kept concise to avoid information overload. The secondary label presents the store name z1, store rating z3, number of reviews z6, average price per person z7, ​​and detailed rating z8.

[0051] like Figure 3 As shown, the secondary label displays more detailed store information, including the number of reviews (z6) (popularity), which corresponds to the color of the primary label. It also displays the average price (z7) and detailed rating (z8), providing even more detailed store information. The system's theme color is used to identify the overall rating, creating a unified theme color.

[0052] (c) Level 3 interface

[0053] The third level interface is the detailed information level, which is displayed when the user chooses to drill down. The third level interface includes store name z1, store rating z3, number of reviews z6, average price z7, detailed rating z8, detailed review label z9, detailed review z10, and detailed review z11. 10 、Store discounts 11 、Recommended dishes 12 .

[0054] The final three-level interface is not added to the real environment in the form of labels, but is directly displayed on the mobile phone screen. Figure 3 As shown, the last three-level interface summarizes the above information in text, and also displays the store's detailed evaluation tags z9, detailed evaluation z10 、 Store discounts z 11 、 Recommended dishes z 12 Other store information that the platform can provide and other online functions that the store can offer, which reflect the overall basic information of the store and also feature a unified theme color.

[0055] Step S3: Calculate the font size suitable for different devices;

[0056] To adapt to different devices and screen sizes, according to ergonomics, combining the screen size, viewing distance, and angular resolution of different devices, calculate the minimum font size suitable for different device screen sizes: p = 0.0365×(D 1.43 / S 0.083 ), where D represents the viewing distance of the device screen in centimeters, S represents the screen size of the device in inches, to ensure good readability on different devices. For any device, the font size of the basic content needs to be at least 40% larger than the recommended minimum font size, and the font size of the enhanced content is 80% larger than the recommended minimum font size.

[0057] Step S4: Establish a geofence, calculate the distance between the user's device and the store, determine whether the store is within a preset radius around the user's device, and present a certain number of tags based on the distance between the store and the user's device.

[0058] To solve the problem of label occlusion, set three fixed radii r1, r2, r3, corresponding to three distances: near, medium, and far. Using the position of the user's device as the center, form a geofence with r1, r2, r3 as the radii. The position of each store is represented by its latitude and longitude (lat i , lon i ), where i represents the index of the store, lat i represents the current latitude of store i, and lon i represents the current longitude of store i; the distance between the user's device and the store is: where R represents the radius of the Earth (about 6371 km), Δlat = lat i -lat represents the latitude difference between the store and the user's device position, Δlon = lon i -lon represents the longitude difference between the store and the user's device position, lat represents the current latitude of the user's device, and lon represents the current longitude of the user's device. Present a certain number of tags within the limited screen space to avoid information redundancy: when the store is within the range of d ≤ r1, display one layer of tags and at most only two; when the store is within the range of r1 < d ≤ r2 and when the store is within the range of r2 < d ≤ r3, also display one layer of tags and at most only two.

[0059] After the label design is completed, the feasibility of these label designs in actual use is verified, and user feedback is collected to understand whether the designed labels are intuitive and easy to understand and whether they meet the user's information needs. Figure 4 As shown in the figure, (a) AR homepage; (b) tag interaction; (c) store details. Based on this, an interface was designed and volunteers were invited to test it in real life. User behavior was observed and interviewed after the experiment. Interview questions were set to focus on interface aesthetics, ease of interaction, information readability, comparison with competing products, and willingness to use.

[0060] The above is only a preferred embodiment of the present invention. It should be pointed out that for ordinary technicians in this technical field, several improvements and modifications can be made without departing from the principles of the present invention. These improvements and modifications should also be regarded as the scope of protection of the present invention.

Claims

1. A store information visualization method based on mobile AR, characterized in that: It includes the following steps: Step S1: Function division; The system is divided into two parts: the home page and the AR interface. According to user needs and the function design principles of the APP, the home page recommendations, favorites, personal information, bullet screen function, real-time recommendations, map, negative review tags, feature tags, help, and tag settings are divided. Step S2: Information hierarchy division; Map the tag design to the visual channels, divide the information into different levels according to user needs, and then convert different information of the store into different visual channels. Step S3: Calculate the font size suitable for different devices; The calculation formula for the minimum font size suitable for different device screen sizes is as follows: p=0.0365×(D 1.43 / S 0.083 ) Where D represents the distance of the device screen used, in centimeters; S represents the size of the device screen, in inches. Step S4: Establish a geofence, calculate the distance between the user's device and the store, determine whether the store is within the preset radius around the user's device, and present a certain number of tags according to the distance between the store and the user's device. Set three fixed radii r1, r2, and r3, corresponding to three distances: near, medium, and far, respectively. Using the position of the user's device as the center, form a geofence with r1, r2, and r3 as the radii. The location of each store is determined by latitude and longitude (lat i ,lon i ), where i represents the index of the store, lat i Indicates the current latitude of store i, lon i represents the current longitude of store i; the distance between the user device and the store is: R is the equatorial radius of the Earth, 6371 kilometers, Δlat = lat i -lat represents the latitude difference between the store and the user's device location, Δlon = lon i -lon represents the longitude difference between the store and the user's device location, lat represents the current latitude of the user's device, and lon represents the current longitude of the user's device; When the store is in the ranges of d ≤ r1, r1 < d ≤ r2, and r2 < d ≤ r3, display one layer of tags and show at most two tags.

2. The method for visualizing store information based on mobile AR according to claim 1, characterized in that: In step S1, the user needs include popularity recommendations,攻略 planning, companionship needs, suggestion provision, location distance, lightning protection guides, and feature culture needs.

3. The method for visualizing store information based on mobile AR according to claim 1, characterized in that: In step S1, the function design principles of the APP include user cognition, user information, user support, user usage, and user interaction.

4. The method for visualizing store information based on mobile AR according to claim 1, characterized in that: In step S2, the information hierarchy is divided into first-level tags, second-level tags, and third-level interfaces; the first-level tags present the store name, store popularity, store rating, store category, and evaluation tags; the second-level tags present the store name, store rating, number of evaluations, per capita price, and detailed rating; the third-level interface includes the store name, store rating, number of evaluations, per capita price, detailed rating, detailed evaluation tags, detailed evaluations, store discounts, and recommended dishes.

5. The method for visualizing store information based on mobile AR according to claim 4, characterized in that: The store popularity: uses a color coding method: 1 is red, 2 is yellow, 3 is blue. This color coding method includes arranging the heat levels represented by the color coding, and setting the popular, unpopular, and ordinary stores as red 1, yellow 2, and blue 3 respectively; the store rating: uses numbers to represent the store rating, with less occlusion of the background. Small tags with the same color as the store name background represent selected positive reviews, and gray tags represent selected negative reviews; the store category: is represented by a dark pattern. According to the research results, five store types are divided: gift shops, clothing stores, beverage stores, food stores, and beauty stores; the evaluation tags: present small positive and negative review tags. The color of the positive review tags follows the store popularity color, and the color of the negative review tags is gray.

6. The method for visualizing store information based on mobile AR according to claim 4, characterized in that: The third-level interface is not added to the real environment in the form of tags, but is directly displayed on the mobile phone screen.

7. The method for visualizing store information based on mobile AR according to claim 1, characterized in that: In step S3, for all devices, the font size of the basic content is at least 40% larger than the recommended minimum font size, and the font size of the enhanced content is 80% larger than the recommended minimum font size.

Images