It is usually said that “First impression is the last impression”
We all know the power of the first contact.Tasting a new meal for the first time, you may get delighted – or hate even hearing its name ever after. The first contact with a teacher may get a student amazed at a subject – or deathly bored. Still, that’s not a lottery, that’s far from luck: in most cases, the first contact leads to success in case you are well-prepared. Today we are going to discuss one of the ways to organize the first impression of your app with users with an onboarding tutorial.
What Is Onboarding?
Basically the term origins from HR sphere: it marks techniques and approaches whose aim is to help newcomers quickly adapt to the new conditions so that they could perform well. The area of user experience design took the idea together with the term. In UX design, onboarding is a set of techniques and interactions aimed at comforting users and give the initial introduction of the product. As the Material Design guide states: “Onboarding is one point in a longer journey that begins in the app store and ends with the user taking the first key retention-correlated action in your app.”
When you work on an app onboarding, your task is setting a clear visual hierarchy on the screen. Keep in mind that users are rarely ready to devote much of their precious time to learning a new product before real interactions start. What’s more, the capacities of working memory are also limited, so it’s vital to prioritize information thoughtfully for this stage of interaction with the product.
The role of onboarding is well-checked in practice. For example, in one of the articles in Adobe Creative Cloud Blog, UX researcher says “When it comes to design, the place that I see primacy and recency, in particular, is in terms of onboarding. When you start to learn about a new product there’s often a tutorial, wizard, instructions or something. It’s wise for designers to consider primacy and recency in this context because you’re going to want to put the most important information first or last if you’re hoping that someone is going to remember them later as they use your product or system.”
What Are the Functions of App Onboarding?
There are three main goals behind app onboarding: it greets, informs and engages a user.
Greeting
Onboarding screens set the first contact between the user and the app. It is a sort of introduction that somehow imitates communication in the non-virtual world with a greeting. It is especially clear if the app uses a mascot or character that is chosen to reflect a flow of direct communication with a user. However, the greeting should be short and concise to avoid distracting users from the essential information.
Information
Another part of the onboarding mission is informing a user about the benefits they get with this product or basic operations they are going to do. User research and clearly defined USP of the product will help the creative team to find the effective solution that will highlight the vital points quickly to the users.
Engagement
One more important aspect of app onboarding is a foundation it lays for the desirability of the product. Well-designed onboarding tutorials engage users to try the beneficial features of the app. It helps a user tolerate the first steps into the unknown. In addition, onboarding screens provide the first introduction into the style and looks of the app. Based on the analysis of the target audience, it may become another hook for user’s interest to see more. One more factor to keep in mind is that most users are visually driven and even aesthetically driven creatures: we tend to get interested with what appeals to our ideas of beauty and harmony or sets particular emotions with its visual performance. So, onboarding screens become a favorable way to activate this approach from the first seconds.
Types of User Onboarding
Three types of onboarding popular for modern applications usually reflect the following:
Top benefits: The most important advantages of the app are shown to users convincing them to try
Personalization: users can customize their experience before they start real interaction(remember choosing the areas of interest before you start pinning in Pinterest?)
Quick start: users get prompts to start interactions easily.
7 Design Tips for App Onboarding
Show onboarding to first-time users only
Onboarding is usually the set of screens shown during the first interaction with the app. It is recommended not to show it to returning users as it will just waste their time.
Don’t use too many screens
Typically, UX designers apply 3-4 screens for onboarding. It’s enough to give a quick insight into the app benefits or functions without making this pre-interaction stage too long. And of course, it is good to boost usability from the first minutes of interaction. What’s important, don’t forget to consider the screens that came before onboarding and the ones that will come after it. This will help to make the flow natural and avoid duplication of data.
Apply catchy illustrations
Visual content is processed much faster than textual by human brains. Onboarding supported with meaningful interface illustrations allows for a quicker explanation of the features and makes the UI lively.
Breathe life into it with animation
Another trick making an app tutorial not only informative but also lovely and engaging is animation. Motion makes interaction more dynamic, delights users, catches attention at once. Interface animation can make the essential details quickly noticeable.
However, motion can increase the time and traffic to get it loaded, so discuss it with developers in the aspect of its technical realization.
As for any guidelines or presentation, in onboarding tutorial, words are power. Yet, there are two simple rules to make them work: tell them short and make them helpful. It’s vital to find the effective way not to waste the precious seconds which user is ready to devote to checking the screens. If possible, involve the copywriter who will help to create the interface copy that makes every single letter count. The outcome has to be an attractive and clear copy which applies the language appealing to the target audience and corresponding to the objectives set for the product.
Based on that, one more aspect to check well is choice of types and fonts, background, and placement of the copy. All those factors influence the readability of the text: if they aren’t done and tested properly, the text performance decreases, even if it’s well-written.
Use progress indicator
From the very start of the interaction, users need to know where they are and how long is the whole process. A screen indicator is an effective way to inform users about the flow which gives more confidence and therefore makes the user experience positive.
Make skipping possible
One more thing to keep in mind is enabling the user to skip the tutorial. Not everyone needs it, even using the product for the first time, so in many cases, it’s reasonable to let them skip the onboarding screens and save their time. The decision upon this function has to be done on the basis of testing and analysis of the target audience.
You never have a second chance to make the first impression. This is the main aim behind any onboarding tutorial – not to miss the chance to impress the user and make a good card of invitation.
So with these onboarding tips make your app’s first-time users as full-time users too.
