User experience: Life Scene Shopping Guide design

Source: Internet
Author: User
Keywords Goods fragmentation time fragmentation mobile terminals

Life has a lot of fragmentation time, and in these scenarios and time, the most company is the mobile phone or tablet computer, and how to use the characteristics of the fragmentation of time into the design, thus providing a user experience.

Unlike traditional shopping and PC Web shopping scenarios, the biggest feature of the wireless side is the use of life work in the fragmentation of time to complete the shopping behavior.

In recent years, the most mentioned in the wireless internet is fragmentation, and in the market, there are countless products for the fragmentation of time characteristics emerged. So, exactly what is the time of fragmentation? What are the characteristics of the fragmentation time? How to combine the characteristics of the fragmented access situation to better operate shopping platform and shop? These problems, perhaps many are inspired by the tide of wireless businesses are already in the face or thinking. In the next installment, we will interpret "stroll" from the perspective of context.

Characteristics of

Fragmentation time

With the popularity of "Angry Birds", "Plants vs Zombies" and "I am Mt", the concept of fragmentation time in mobile environments is divided. The so-called fragmentation of time, from a few minutes to a few 10 minutes, usually in the waiting situation (such as: Bus, queue), the situation (such as: work, class, toilet), after meals (such as: Lunch Break, dinner), before bedtime, frequent visits but stay time is usually not long.

In the survey of Taobao users using mobile terminals, about 63% of users use their mobile phones to surf the internet, read or play almost every day. For these users who use their mobile phones to surf the internet, read or play games every day, we subdivide the access frequency, the access situation, and the content of the visit, as shown in Figure 1. Among them, more than 15 times a day to visit the mobile phone is the mainstream crowd, accounting for about 54.6%, thus the shadow of fragmentation. At home, bedtime is the most mentioned interview scenario, which accounts for about 82.3% of the total, and in addition, leisure time, waiting time and the reference rate of work space are over 60%. Use the fragmentation time to read news, use instant chat tools to communicate with others, online shopping is the most common Taobao users do on the phone three things, mention rate of more than 60%.

Figure 1: Fragmentation time characteristics

Fragmented Access Rhythms

"XXX (here hidden) app Product information update is very slow, every time to see a few minutes. Look at the morning, noon look at night to sleep to see things or similar. ”

Fragmented time distributions cause fragmentation of access rhythms. It is noteworthy that the mention rate of online shopping using fragmentation time is as high as 63%. It is like such a day to use their leisure time, high-frequency and intermittent access to network shopping related sites or apps, which for mobile terminals on the shopping cart-like commodity shopping platform, in addition to the opportunity to have what?

In the research, heard many users complained to us of their commonly used mobile phone shopping guide app on a variety of merchandise information update frequency is not enough to force. Miss Li is engaged in supermarket cashier work, on weekdays, as long as the supermarket no guests will take out their mobile phones, browse the store on their own collection of new, cost-effective, beautiful said and some group buying app. There are a few people who believe that Web sites or apps like Miss Li's fragmented pace of access to online shopping. Since those mobile phone users active online more than 15 times a day to open the mobile phone, then your shop or shopping platform can give her every time to open the surprise? If not, she can only drain and reach other related apps and stores. To get a deeper understanding of the importance of updating the frequency of purchasing information, let's look at a 24-hour user access comparison for a group of products (see Figure 2).

Figure 2: Comparison of 24-hour user access for two types of shopping guide platforms

The left and right two maps are shopping guide products A and shopping guide product B on the mobile terminal 24-hour user activity trajectory. A is a real-time shopping guide information update app application, daily 8 o'clock began to have a large number of users to log in through the mobile terminal, a day of four peak visits--working hours, lunch time, dinner time, bedtime, before bedtime 22 o'clock active users reached a peak. Shopping Platform B only updated a batch of merchandise information daily 10:00, so visit the peak period of 10:00 in the morning. After a gradual decline, until after dinner modest has rebounded, before bedtime to reach a second peak. But the shopping platform B obviously did not use the above data mentioned rate of the highest prime time "at home before Bedtime", also did not use a good majority of users more than 15 times a day visit.

Design Tip 1: Because the mobile end of the user access behavior is fragmented, so the updated frequency of shopping guide information is particularly important. Mobile end users have so many opportunities to visit the mobile phone network every day, shopping platform or shop whether to seize the user in the daily peak time node, whether in the user before bedtime peak to the user to bring a little surprise, perhaps this should be a shopping guide platform or shop in the design should be considered.

How to grasp the time before bedtime

"I was reading before bedtime, like a little easier, a lot of pictures on a page, too dense to see is very tired." ”

"XXX (here hidden) app is full screen of the big Picture Show, to keep moving fingers, feel more trouble paging, turn a few pages sleepy, will not continue." ”

Bedtime is the peak time for a user to visit a mobile network, and this particular period is accompanied by fatigue, dim lighting, limited operation due to the body lying around, and so on. A lot of users specifically mention the use of mobile phone shopping before bedtime fatigue, fatigue, on the one hand from the burden of information processing, on the other hand is the burden of operation. For these problems, it involves many aspects, such as information quantity, content quality, presentation form and so on. Refinement into research purposes, in the user survey, the main answer to the following questions: Shopping guide Platform what is the core content? How to choose a different product rendering view for your shopping platform? What kind of merchandise picture users prefer? What are the core contents of shopping malls?

Figure 3: The particularity of bedtime Time for shopping Guide information presented by the test


Mobile phone is a small screen, can only carry a limited amount of information. Too much information beyond the user's cognitive processing load, called information overload; too little information makes it impossible for users to make normal decisions, calling information missing. Neither of the above is advisable. The key to providing appropriate information is to figure out what kind of information is the core information that users need most, in order to use the limited screen space to convey the core information. So, merchandise picture, commodity price, shop, Recommender, product description, commodity title ... What are the essential core messages? To this end, I gathered Taobao internal shopping guide platform business related workers to a brainstorming, divergent 23 card function, such as Table 1.

Also, discuss determining functionality (helping users to determine whether a product likes it) and entertaining (helping users to improve the fun of shopping) as an assessment dimension to filter core functionality. Then 36 women who liked to go shopping through mobile phones were invited to participate in a small functional survey. First, ask this group of users to choose from 23 functional cards for their own to determine whether they like a product the most helpful 6, and then, also from 23 function cards to choose the most for their own to promote the most interesting shopping 6. In this process, users are allowed to add the new feature points they want.


Table 1:23 Function cards
Statistical results show that the product pictures, details, sales, matching programs, comments, preferential information is the female users of the survey that most help themselves to determine "whether the goods like" 6 functions; Similarly, merchandise pictures, collocation scheme, taste talent, discussion and sharing, mutual enthusiasts, Discount information These 6 items are the small features that this group of users think can best improve their shopping interests.


Figure 4: The core functions of shopping platform on mobile terminals

Design Tips 2: Because of the natural disadvantage of small screen, so that mobile terminals on the shopping mall on the platform can carry a limited amount of information. For such a platform, the following are essential core functions-commodity attributes, merchandise pictures, details, sales, preferential information; in social properties, comments, discussions and sharing, tastes, and common enthusiasts; in the correlation attribute, match the scheme.

How to select the Product rendering view mode

"The picture is small, the detail is not clear, always points to see." ”

"Square cut does not highlight the characteristics of the costumes, in accordance with the characteristics of the product itself (the ratio) to effectively cut. ”

"Sometimes the pictures are so wrong that they don't look smooth enough and some of them are easily missed," he said. ”

At present, there are several more common rendering view modes on mobile terminals (see Figure 5): Waterfall flow pattern: belong to the multi-graph mode, there is no standard grid structure usually not limited to the width of the picture, the visual performance of the uneven layout of multiple columns; matrix mode: Belong to the multi-graph mode, there is a canonical grid structure, the picture strictly uniform width and height, The layout is more regular, such as the pattern of multiple graphs: it belongs to the multi-graph pattern, has the canonical grid structure, the picture follows the width or the height proportion, maintains the 1:2 regular change; large graph pattern: belong to Full-screen mode, picture limit is wide.


Figure 5: The more common product rendering view mode on the mobile terminal

According to the number of pictures, the following 6 kinds of current shopping guide type of app commonly used view mode-three-column matrix, three-row waterfall, two-column matrix, two-row waterfall flow, two columns, such as the score, a single big picture. 36 Female users are also asked to evaluate the pros and cons of each view, and 0-10 of each of the pros and cons of the subjective rating.

Results show that users in the selection of their favorite products to render the view and layout, mainly from the following aspects to consider: first, the richness of the presentation of information; second, the image cutting mode and space effective use; third, the lack of information and information overload problem, its four interesting and fresh feeling. Five, picture size contrast and the effective communication of information; its six, the line of sight fluency and the effective communication of information.


Figure 6:6 Product rendering view scoring results

Design Tips 3: For the above image of several views, each has advantages and disadvantages, can not generally say which view is better, but can be based on their own platform positioning and purpose to choose the most suitable. For example, if you think your shopping platform is the most important for "fun and freshness," then the three-column waterfall stream, the two-row waterfall stream, and the like are the preferred rendering views. If your shopping platform is to push some of the new strange electronic equipment, and the details of the picture requirements are not as high as the clothing category requirements, then do not have to choose a larger picture size view.

users favorite Picture types

For the clothing category shopping guide platform, the picture is stimulates the user to purchase the desire the most direct factor. Model, product, detail, these three are the most common types of commodity pictures (see Figure 7), so when users browse the results, which type of picture is more popular? In another user survey on product picture concerns, different types of pictures have been shown to vary depending on the user's decision-making phase. When the user in the understanding of the stage of the product, the priority of the picture type is the model, followed by the product map, and finally the detail map, but when the user in the next decision to buy the stage, more concerned about the details of the map, followed by the product map, again is the model map.

Figure 7: Three types of products in the actual case Figure 8: The sorting of three types of merchandise pictures in different stages

Design Tip 4: The attention of different types of pictures varies depending on the decision stage of the user. For the browsing page (such as search results page, shopping guide page), to first attract users, to help users understand the main purpose of the product, this time with a model diagram of better results. Because the detail map is a very important part of the user's decision-buying phase, placing a detail map on the Product detail page helps to promote transformation.

From the perspective of the situation of "stroll" this matter, mobile terminals on the shopping mall on the platform needs to be combined with the characteristics of fragmentation to see. Fragmented access time brings a lot of test to the shopping products. On the one hand, short time and frequent access features mean that the platform content update rhythm needs to be adjusted accordingly. On the other hand, the small screen of the natural disadvantage of screen space appears to be a little bit of gold, how to reasonably arrange the content of the capacity, layout and type also seems particularly important.

Source: The design will be originally contained in: "Sellers" magazine author |
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.