Most of the time, everyone thinks that the novice guide is unnecessary. For most products, users turn it off without even looking at it. But for some more complicated products, is the novice guide much better than reading long-winded manuals?
Imagine that we have read the instructions from beginning to end for the medicines we take after being sick. I believe that we usually follow the doctor's advice or consult later. Machine, in addition to watching the video operation, you may also read the manual. Although the viewing rate is low, it is undeniable that it may play a key role in unexpected problems. The novice guide in UI design mainly helps users understand the product and clarify the entry of important functions, so as to help them get started quickly and reduce the cognitive cost in the subsequent use process. It is also an important step for the product to attract new users. is very important and cannot be ignored. So what problems should be paid attention to when designing the novice guide, and how to maximize the role of the guide, let's learn together with everyone.
When we enter a new company, there is usually someone who will take us to meet everyone on the team, or introduce ourselves at the meeting. We know that even if we don't do this, it only takes a certain amount of time /Passive communication is gradually familiar, but the company's arrangement will undoubtedly speed up our integration into the new environment and enter the best working state faster. This is the display version of the "novice guide". "Growth Hacking" once said: Desire-Friction = Conversion. In order to increase conversion, it can not only increase the user's desire, but also reduce the friction between the product and the user. As the starting point of the user journey, "new user experience" must have many frictions point, the novice guide exists to eliminate these friction points. The novice guide in the product can help users quickly understand product features and usage methods in a short period of time, and easily experience multiple functions. From a product perspective, novice guidance plays a vital role in improving conversion after allowing users to master the core functions of the product and improving retention rates.
First of all, show product features, let users understand the advantages and highlights of this product compared with similar products, leave a good impression on users, or have the desire to use it; second, update and iterate the product, whether it is a new function The launch or the change of the position of the original function entrance should remind the user in time, so as to prevent the user from spending more time and cost because they cannot quickly scan the entrance they need in the inherent thinking of the previous version; third, the operation guide, This is not required for all products. Under normal circumstances, the product should be able to get started quickly without making users think, but for more complex products, it is necessary to help users quickly master its operation methods and skills through novice guidance. Reduce the cost of self-learning, such as some B-ends and tool applications.
Most of the novice guides appear when the app is downloaded or opened for the first time after a version update, which helps users have a basic understanding of the new functions/operations of the product. The novice guide does not seek to be big and comprehensive. After introducing the core functions and features, the guide that has appeared can be hidden, so that users can manually call out for help when needed. In addition, the product needs to maintain the user's curiosity to explore the product on their own. For those non-essential but necessary novice guidance, the behavior can be predicted according to the user's operation without interfering with the user, and prompts can be given at the right time. Ensure that the hidden needs of users can be clearly and promptly resolved.
The page mask guide is equivalent to upgrading the style of the bubble guide. The difference is that a black translucent mask is added to the top of the page for masking. The guided lower content is hollowed out, and interactive gestures and text information are provided on the mask. or illustrations, etc., users need to manually click the "Next/Skip/Close" button to operate other content. The biggest advantage of this kind of novice guidance is that it can focus the vision on the currently guided function description, ensuring that users will not be disturbed by other information. Basically, it appears when the app is downloaded or updated for the first time, and one or more (sequential guidance) can be displayed, and the effectiveness of information transmission is very high. It should be noted that the content introduction must maintain intimacy with the guided location, and the close button is obvious and easy to operate. When there are multiple guides, it is necessary to provide the "Next" and "Skip" buttons at the same time. There are many old users who download for the second time or for the purpose of updating the version and do not need the novice guide at all. , for old users, this is not help, but interference.
Dialog box is a kind of strong guidance. It usually appears when a certain function that the user is about to use is restricted or when the user actively seeks help during use. It is of practical help to the user. The appearance of the dialog box will still interrupt the user's operation, especially the timing of the pop-up that is automatically triggered must be appropriate. If the pop-up is not timely or interferes with the user in advance, it will have a negative impact. Dialog guidance will be automatically triggered by the system or actively triggered by the user at an appropriate time.
For example, when a user needs to use a certain function, the system will automatically pop up that the user needs to upgrade to a new version or complete a task to experience it, and provide a shortcut channel to facilitate the user to reach the goal directly. In addition, paid videos of video apps can be experienced for free for 5 minutes. After the time is up, the system will automatically pause the playback and pop up the paid channel to guide users to convert.
This kind of guidance will have an operation entry, using buttons, "question mark" icons or text hyperlinks (instructions/operation guidance/help...) prompts, users can click at any time to call out the guidance instructions. For example, the user actively turns on the notification and location permissions of the device in the app, the text description of the mobile phone number reserved when activating the credit card, or the CVV/CVC graphic guide on the back of the card, etc.
This is a relatively lightweight but highly directional guidance method. Its manifestation is that a bubble container with sharp corners pops up at the desired position and a guiding copy prompt is added. Users can follow the guidance operation or ignore the bubble directly Operate other content without interrupting the user, which is minimally intrusive. The bubble prompt guide can be used in new function launch, core function positioning, hidden menu prompts and other scenarios. It can be used with picture materials and animation effects. Because of its clear directionality, it can appear anywhere on the page and is extremely compatible.
Compared with the dialog box guidance mentioned above, the operation bar is somewhat similar to it. They are all blocking and have no clear directional guidance. The only difference is that although the visual center of gravity of the operation bar is slightly weaker than that of the dialog box, the pop-up The location of is at the bottom of the screen, which is convenient for user operation (close to the finger), especially for one-handed operation, which is easier to reach. In addition, the operation bar has more space resources, and is more suitable for detailed guidance with more content. It can create a strong visual atmosphere through the combination of graphics, text and background, and can also increase the conversion rate by adding prominent CTA buttons.
In addition to the several novice guides mentioned above, there are also guide pages, default pages, preference tags, etc., but those are relatively complex and independent module systems, which cannot be explained clearly in a few words. It is recommended to read other separate Relevant information.
Emotionalization is a sharp tool of design, it will give life to emotionless Internet products, eliminate the cold interaction of the human-machine interface, and help users establish a friendly relationship with the product. When designing a novice guide, you may wish to add anthropomorphic images, deeply rooted copywriting, and simulate real-world things/transactions to make a warm product that can shorten the distance with users.
For novice guides for event promotions, users can be informed of what they can get after the operation and what they will lose if they don’t operate before the operation. Some conventional design methods such as profit temptation, interruption warning, and visual atmosphere are used to allow users to have clear usage goals. Facilitate users to make positive decisions. After the operation, highlight the benefits to stimulate users, leave a deep impression on users or make them look forward to the next time.
Following the principle of doing one thing at a time, multiple functions need to be presented in sequence according to different priorities and follow the user's operations. It is also necessary to provide a "skip" entry at each level. The novice guide is provided to help meet user needs, rather than forcing users to use it.
More complex functions can split information and open it according to different time histories according to its importance, so as to prevent users from receiving too much information at one time, reduce the cost of single learning, and improve the efficiency of absorption. For example, for the VIP function, each level may open new services and permissions separately. The system should guide and feedback the new services in a timely manner after each upgrade of the user. It must not be all value-added services when the VIP is opened for the first time. They all tell users that if they don't have the patience to remember, they can't remember. If necessary, unusable functions can be grayed out or operation restrictions can be provided.
Different novice guides can be designed with different visual styles to avoid the same style from causing users to form "inertial thinking" and mistakenly think that they have already seen it, skipping without thinking and making the novice guide a burden.
In the UI interface, as long as the information is not popped up by the user actively seeking help, it will reflexively look for the close button until the content disappears. Although many novice guides provide a "skip" operation, it is understandable, but do not design it too obvious, the "skip" button that is too eye-catching can easily arouse the user's conditioned reflex, no matter whether it is helpful or not, just click it, This also loses the original intention of the novice guide. Moderately weaken the "skip" operation entry. Even if the user wants to close it, he may be disturbed by interesting and helpful information in the process of searching for the operation, or continue to browse.
In many cases, in order to allow users to complete the novice guide in order, a mask will be added behind the bubble. Whether it is an arrow indicator or a hollowed-out bottom, the color of the mask (pure black opacity) is best to use a light color. While absorbing the content of the novice guide, you can also see the overall structure of the interface. After the novice guide is over, you have a certain impression of the operation path. Too deep a mask is not conducive to the overall learning of the user.
The guide copy must be concise and to the point, and it needs to effectively highlight the key points in an expression that can most attract users' attention and is easy to understand. Avoid long-winded speeches, too much text content, users tend to forget or have memory deviation, and they don't have the patience to read it. If the content cannot be shortened and shortened, you can consider using pictures/illustrations to replace part of the text, which is reflected in a combination of graphics and text. You can also use segmented display to interact with users and learn while using.
When designing onboarding, no matter how exciting the content is, don’t try to overwhelm users with too much information at once. When users use the product for the first time, they only need to provide necessary functions and appropriate help, and the number of multiple guides is usually controlled at 3 to 5. It is also necessary to let users know the current progress in real time, so as to avoid anxiety caused by users being unable to control the amount of content. If it is skipped directly, it will not be able to play the role of a novice guide.
The novice guide is mainly to help users get started quickly. Although the ultimate goal is to improve conversion, don't just put a "de-conversion" shortcut entry in the novice guide. There is no way to close the operation and force the user to enter the conversion process. Except for very few necessary cases, there is a high probability that the process will be terminated by the user directly. If it cannot be closed, uninstall it! No matter how important the content is or how much you want to increase revenue, users should not be forced. We can use design methods to attract users to operate, but we still need to provide a back entry, even if it is not so obvious. Users should have their own choice right.
In the process of using the novice guide to learn, the user itself is boring. Designers can design interesting fonts and illustrations according to the tonality of the product, and can also cooperate with animation design to bring users an interesting experience.
This article introduces the practice of novice guidance in UI design from four aspects: basic understanding, style classification, design skills and common problem handling, although it is only a small part, and not all applications (such as shopping, social, News category) all need novice guidance, but once it is involved, it is particularly important. Whether the design of the novice guide is reasonable and easy to use is directly related to the user experience and product transformation. If your novice guide is just a decoration or even a burden, it is better to remove it. The novice guide design needs to be presented to users at the right time and in the most reasonable way according to the characteristics of the product itself and the business scenario, so as to guide users to quickly familiarize themselves with the product and use it. The author hopes that through the content of this article, junior and middle-level designers can have a systematic understanding of novice guidance. In future design, they can give the most suitable solution in combination with actual application scenarios, provide users with practical help, and enhance the value of the product. .
.svg)
.jpg)
