Analysis Report of Meituan Takeaway Products: Product Design

& gt click to view the original picture.

The above picture completely shows the mind map of the US group's take-out utilization. App？ According to the main menu, the function menu can be divided into four categories.

Home page: display merchants in various forms such as classification and discount, and users can search and choose.

Flash Purchase: Showing fresh supermarket products separately, which is different from the catering on the front page, and mainly promotes the flash purchase business based on the surrounding life circle.

Orders: View all created orders, and users can evaluate, sell and re-order.

Mine: Centralized management of user information and assets, including addresses, collections, wallets, coupons, etc. , and customer service centers and other entrances.

& gt click here to view the original picture.

The above picture shows the business process of Meituan's take-away products from the perspectives of consumers, merchants and riders in the form of swimming lane map.

It can be seen that the process relationship among consumers, merchants and riders is inseparable. Consumers are the leaders who trigger the whole process, and merchants and riders play the role of service consumers, forming a complete closed-loop business process.

As can be seen from the flow chart, the login and registration methods of the US group takeaway are basically based on the mobile phone number. Even if you use a third-party social account to log in, you must first bind your mobile phone.

The main reason is that the users of Meituan take-out are based on mobile phone numbers, and one number corresponds to one user, which can not only ensure the authenticity of users, but also reduce the phenomenon of brushing and commenting. Moreover, the same account is allowed to log in at multiple terminals at the same time, and the user information and shopping cart support real-time synchronization.

Because mobile phone number is a necessary condition for ordering food, it is a very reasonable and natural choice to use mobile phone number from the perspective of users and products.

Meituan takeaway? App？ The main color of the interface is orange, which runs through the whole product design. In addition to the background color, icons and characters, the whole set of colors has been deeply rooted in people's hearts, which can be said to be a very successful VI? Design case.

As a take-away product, the design core revolves around how to better display the merchants and guide users to order. The middle position of the page is used to display merchants and meals, with functions such as search, setting and message center at the top and a fixed menu navigation bar at the bottom. The operation mode is mainly up and down strokes, single point selection, and occasionally sliding left and right as an auxiliary display.

& gt click here to view the original picture.

Use the above picture? Axure？ Software, in a backward way, attracted the US group to take out food? The fidelity prototype of the application shows the design details of the product interface.

The prototype is mainly gray, the flow relationship between different pages is represented by colored lines, and the main points of interactive design are explained by blue comments.

As mentioned above, the login and registration method of the US group takeaway is mainly the mobile phone number, which can also be clearly seen from the interface design.

The account exit method is placed in the "My-My Account" at the secondary entrance, which is rarely used because the average user does not need to switch accounts frequently.

Meituan takeaway? App？ In, new users can still use most operations, such as browsing businesses and clicking on goods. When they are not logged in as tourists. By default, this address uses the neighbor address that the system matches. The interface will not remind the user to log in or register until it exceeds the limited range and triggers the function that must be logged in to use.

The above picture shows the operations that will trigger the login reminder in the take-out of Meituan, such as message center, shopping cart, personal information, address management, order settlement and other functions. This design is more friendly to new users, easy to find out when using it for the first time, and then guide the registration and login until the demand for placing orders arises.

As an online takeaway product, the core of its function is naturally ordering food, so it is very important for merchants to show and guide the ordering process.

As can be seen from the above picture, Meituan Takeaway has done a lot of homework on how to guide users, and almost all the operations have become the entrance of the merchant page.

There are many inducements in the content, which are used to enhance users' desire to place orders. At the same time, it also provides many tools for users to search and filter, which improves the efficiency of ordering.

Users can select, place orders, pay and other operations after entering the merchant page. The schematic diagram fully shows the whole process from entering the merchant to completing the payment. It can be found that the design logic of the external interface of Meituan is very clear and intuitive, and even the learning cost of new users is relatively low.

Users can add or subtract the quantity at will when selecting goods on the merchant page, and see the calculated actual total amount in real time. Moreover, it will intimately remind users whether they meet the full discount of the current merchants, and also provide a "full reduction artifact" to help users place orders quickly. After selecting the goods, you can make a second confirmation through the shopping cart below, intuitively display the selected goods and the total price, and then settle the account after confirmation. After submitting the order, the price formula of the goods will be displayed in detail again, including the addition and subtraction details of packaging fee, distribution fee, discount red envelope, etc., which is detailed and not repetitive. On the order page, users can select red envelopes, fill in comments, select tableware, issue invoices and other operations. Finally, complete the payment and jump to the order details page.

The convenience function mentioned in this section is the highlight in the design of Meituan takeaway products. It not only fits the core functions of the product, but also improves the order placing efficiency and satisfaction of users and promotes consumption.

In the lower left corner of the merchant page, there is a function of "full reduction artifact" for users to quickly choose meals that meet the requirements of full reduction, which complements the "order collection reminder" and is more direct and effective.

The full reduction artifact will automatically list the best meal combinations that meet the full reduction discount in the current merchants. The realization logic is also very simple, mainly through the historical orders of merchants, arranging the combinations with more purchases.

Because full reduction has become a regular activity of the take-away platform, almost all merchants have different discounts, which tests the mathematical ability of users when ordering food. Meituan take-out launched this function, which is exactly what users think, saving the time for users to collect orders and greatly improving the efficiency of ordering.

At the top of the order page, the merchants that users have consumed are arranged from high to low, forming a list of recently purchased merchants. Convenient for users to find quickly and reduce search time.

From the user's point of view, businesses with high consumption times are usually businesses that they like and often pay attention to.

In the order list, completed historical orders can be viewed by "similar merchants" to see other merchants similar to this merchant, mainly through comprehensive screening of location, category, price and other factors.

Usually, users like the taste of this merchant's food, but for some reason, if they want to change to another merchant, they need to use this function, especially for heavy users.

In the order list and order details, there is a "Place another order" button, which is similar to re-purchase.

After clicking, the user will jump to the merchant page and automatically put the same meal in the historical order into the shopping cart. If there is a missed meal, there will be a hint. When users want to repeat the previous meal, or just make minor adjustments, they can quickly complete the order through simple operations.

In addition to being suitable for users to order food repeatedly again, there is no time to choose meals. At the same time, when users click on the wrong order and cancel it, they can also use "Place another order" to add it again, and then make adjustments and modifications in the shopping cart.

The merchant display of Meituan takeaway is based on the user's current address and must be displayed within the delivery range. At the same time, the user address is also the key information for the rider to deliver food. Therefore, how to guide users to fill in address information and ensure the correct address is one of the more important core functions.

As shown in the above figure, Meituan Takeaway mainly provides three entrances for users to select and edit addresses, which are distributed on three pages: home page, order submission and my address, corresponding to the three processes before, during and after placing an order.

As an online takeaway product close to people's livelihood, users' evaluation of services such as merchants and riders is obviously very important data. The above picture shows multiple evaluation entrances in the US group's take-out. As can be seen from the schematic diagram, after the current order is completed, there will be three entrances to remind users to evaluate. If the user fails to evaluate the order in time when it is completed, and then returns to the order page, he will still see the evaluation button, and there is also a separate category of "to be evaluated".

Scoring mechanism can promote merchants and riders to improve service quality. Merchants will generally improve their meals according to the evaluation content, while riders will take the initiative to serve in order to get praise. At the same time, the platform can also use user evaluation as data support for product optimization, so that * * * can work together to improve the quality and experience of the whole product.

While actively guiding user evaluation, we should also ensure the authenticity and effectiveness of user evaluation. In addition to the above, the authenticity of users can be enhanced by registering the mobile phone number, and the evaluation can only be carried out within 7 days after the order is completed, and the evaluation cannot be followed up after 7 days. Because after a period of time, users may deviate from the taste and service experience of foreign sales, or be disturbed by other factors, the most direct evaluation should be within one week. And these evaluation contents will be unified into "My Evaluation", which is convenient for users to check the management again.

As shown in the figure, users can find the entrance to the message center in the upper right corner of most pages. Contains all the notification and communication contents, including merchant coupons, system notifications, customer service messages, friend messages and so on.

According to the actual scene, users often need to go back for other operations during communication, and the multi-entry design of the "message center" is convenient for users to switch back and forth.

Users encounter problems in the process of using products, and the first choice is naturally online customer service. The picture above is a US group takeaway? App？ There are several customer service portals and interface designs, and the main portal is located on the "Orders" and "My" pages.

Because the abnormal problems of take-away products are mostly related to orders, the page entry of "order details" is more common. In this regard, according to the different orders or status, the content of the page where users enter online customer service is different. Take the schematic diagram as an example. The contents of the same order are different in the two states of "Being Delivered" and "Completed".

The purpose of this processing is to simplify the user's operation and use big data to predict the current demand; The second is to guide users to the correct solution channels, such as directly contacting merchants or riders, thus reducing the cost pressure of manual customer service.

Meituan takeaway? App？ As long as the user has logged in, the checked goods will remain in the shopping cart and can be easily retrieved at any time. I call it the shopping cart retention principle.

The products selected by users must consider various factors. Even if you don't place an order immediately, it is very important to get it back at any time, giving users a sense of peace of mind of "waiting in the shopping cart forever". For an online takeaway product, this is a crucial point in the user experience.

The products selected by users in any business will be displayed in the shopping cart, and the price, delivery fee and discount will be clearly stated. If there are abnormal situations such as business interruption and commodity shortage, a reminder will be given (as shown in the figure). Users can make a second selection and comparison in the shopping cart at any time, and then place an order for settlement. After the settlement, the goods will naturally be cleared, but the purchased goods can still be seen in the historical order.

At the same time, it is found that the goods in the shopping cart will not be lost even in extreme cases such as disconnection, flashback and power failure. However, if it is a tourist, the shopping cart will not be kept permanently, because the user data is stored online with the account, which supports real-time synchronization of multiple terminals.

As shown in the figure, if the user currently has an order in progress, a floating window at the top will appear in the lower right corner of the page, showing the real-time status of the order.

The floating window can be seen in three home pages: home page, order page and my page. After clicking, the user will go directly to the details page of the order, so as to know the current trend in time, such as where the rider has sent it.

Combined with the chart, we can see that the prompt of the floating window will change according to the different order status. A floating window will appear after the user submits the order, but it will disappear once the order is completed (delivery is completed).

In the interactive action shown in the above figure, when the user selects "to be evaluated (or refunded)", the page will expand in full screen, and the top menu will be set while switching. This is an interactive design that is more in line with the user's intuition, and the actual operation makes people feel at one go.

In this state, the user's "click" behavior represents the intention of "switching viewing content", so full-screen expansion is more conducive to the user's browsing and avoids other irrelevant content from disturbing the vision. The same interaction design also appears in the filtering function of the home page and the classification menu of the active page.

Meituan takeaway? App？ The most common floating controls in are the shopping cart (or flash purchase) on the home page and the red envelope on the order details page.

Although these two floating controls are similar in essence, they are slightly different in operation. Combined with the schematic diagram shown in the above figure, the two are briefly analyzed.

Shopping cart: When you open the home page (or flash purchase), fully display the initial state of the "Shopping cart" control to highlight its functional position. When the user taps on the page, the page becomes transparent and enters the sidebar to avoid blocking the content. If you stop paddling, you will return to the initial state of full display.

Red envelope: the initial state is also fully displayed, and it is also transparent when it is drawn, and it is included in the sidebar. Unlike shopping carts, controls are hidden when they stop paddling and can be dragged freely.

The "red envelope" control can be dragged freely, and will not be fully displayed after it stops sliding. This design can be understood as assuming that the user does not intend to share the red envelope at first after the order is completed, and the possibility of sharing it later is extremely low, then the control only needs to keep the state of "staying in the corner and looking for it when necessary". Control allows free dragging, which avoids the situation that floating controls are easy to block the key information of the page, such as when the order details page needs screen capture (sharing, complaint).

Giving appropriate reminders at the right time and informing users of key and necessary information can avoid the influence of information asymmetry on user experience. Moreover, the timing and way of reminding are also very important. Once it is too abrupt or frequent, reminders will become harassment.

The following schematic diagram tells the story of the US group's takeaway? App？ Several typical examples.

When the user uses the "one more order" function, but some goods in the merchant are missing and cannot be added to the shopping cart, the page will obviously prompt "? XX goods have been sold out, please choose again. 」。

It is convenient for users to check the shopping cart and buy it again after knowing it in time. Prevent users from placing orders directly without knowing it, resulting in order errors and order disputes.

When the user enters the merchant page, but is not in the delivery time of the merchant at present, the delivery time reminder of "Book Now, * * *: * *" will appear at the top of the page.

Clearly inform the user whether the order is booked now and when the delivery will start. Prevent users from finding that they can't deliver the goods immediately after selection, or even the merchants don't deliver the goods after placing an order directly.

In addition, if it is not in the business hours at present, the page will directly prompt "Our store is closed" and users can't click on any goods.

When the user submits an order, if the system judges that the delivery address is located in bad weather such as rain and snow, the page will give "Bad weather may delay delivery, please wait patiently. Just a reminder.

It is convenient for users to know in advance, and the delivery time of this order may be longer. If you continue to place an order, it means acceptance by default. Thus, to a certain extent, the anxiety of users waiting is reduced, and complaints, reminders and other events are reduced.

When the user takes a screenshot on any page, two convenient options will appear on the right side of the page, namely "Feedback Question" and "Share Page".

Selecting "Feedback Question" will first enter the editing interface with mosaic and marking function, which is convenient for users to remove sensitive information from screenshots first or mark questions that need feedback. Select "Share Page", is it WeChat or QQ? Wait for the social sharing button. In addition, if you take a screenshot on the merchant page, you will also add the "friends spelling" option, and click to enter the WeChat spelling interface.

When the network where the user's mobile phone is located is abnormal, a prompt "The network is not very strong, please try again later" will appear on the page.

As can be seen from the above figure, the prompt under network abnormality is very simple and direct, and the page will be completely blank because the content cannot be loaded, reminding the user to reload (as shown in the left figure). After the network returns to normal, reload the normal page.

If the network is unstable intermittently during use, the content loaded on the current page can still be browsed, but if you continue to click, a prompt will pop up because it cannot be loaded (as shown on the right).

As a response to public opinion, US group takeout often introduces some reward options. At the same time, cooperation with public relations propaganda has a direct impact on the promotion of brand image.

Meituan Takeaway launched the "Castle Peak Plan" in September 20 17, which officially put environmental protection work on the agenda. At the same time, businesses are encouraged to participate with users to reduce the use of disposable tableware.

Users can choose the number of tableware when submitting an order, or they don't need tableware. At the same time, there will be a clear logo on the "Let's help the environment together" page to encourage users to participate, and businesses can light up the environmental protection logo after participating in the activities.

To some extent, this counteracts the negative public opinion about take-away pollution, and also helps to enhance the green image of the US group's take-away.

Meituan Takeaway launched the number protection function in August 20 17 to improve the privacy protection for users.

Users can check "number protection" when submitting an order. After opening, merchants and riders can only see the hidden four-digit mobile phone numbers. When contacting users, you need to transfer money through the third-party number platform, and the order will be invalid after a certain period of time.

The benefits of number protection to users are very obvious. Don't worry that the take-away order will be discarded at will, which will reveal the address and mobile phone, or you can avoid being harassed by the mobile phone number in case of disputes with merchants and riders.

Meituan Takeaway provides number protection service to all users free of charge, which makes users feel more at ease when using products and helps to enhance users' trust in the brand.

20 14' s meituan takeaway? The anonymous evaluation function has been supported since it was launched around 2000, mainly to allow users to provide more realistic ratings and content.

When the user evaluates the completed order, the rider's evaluation will always be anonymous, while the merchant's evaluation can be anonymous or not. More intimately, if the user gives the merchant a bad review of less than two stars, the anonymous evaluation will be automatically checked.

This function is similar to number protection, which mainly protects the privacy of users and improves the authenticity of user evaluation to some extent.

Meituan Takeaway launched the function of blacking out riders in June 2008+2065438. Users can hack riders with poor service experience, and then riders can't receive users' orders.

This can improve the user's experience and avoid repeatedly encountering riders with bad attitudes and unfamiliar roads. At the same time, it can also promote riders to improve service quality, avoid being blacked out by many people and take fewer orders.