Guide

Guide Operations and Minimize User Input

The guide prompt is used to develop users' operation habits or guide users to use the function correctly. A clear guide enables users to follow it to complete the correct operation without interrupting.

Tab guide

This method is used to strengthen the prompt information to users of an element in the page

image.png

Swipe up guide

This method is used in the authorization scenario.

image.png

Embedded guide

This method is used to guide users in less important scenarios, and no impact exists even users do not notice.

image.png

Minimize User Input

Although the screen of mobile devices has become larger and the screen accuracy is improving, the accuracy of input is not high. Since the mobile keyboard area is congested packed with keys, data input can be difficult and errors are easily made. Therefore, when designing Mini Program's pages, you must make full use of mobile phone features, use existing APIs or other easy-to-use controls to minimize user input and improve the input experience.

image.png

Use a tag selector rather than manual input.

image.png

A few options generated from users' search history are provided to help users perform a quick search.

截屏2020-06-22下午4.47.34.png

This Mini Program Design Guideline framework

This Mini Program Design Guideline is for reference only. We built this based on JV’s design guideline, aim for helping the design team.

📎Mini Program Design Guidelines.png

image.png