The website uses a Facebook Pixel cookie to personalise content and ads as well as to analyse our traffic.
First impressions matter. Therefore, you need to show the user the value of your application by helping them to reach that ‘aha’ moment during their ‘first-time user experience.’ If not, there is little chance of them returning regardless of how fantastic your product is.
There is no ‘best’ UI pattern to use for onboarding. However, there are the best use cases for popular flows. The right UI pattern, when used correctly, can transform a hand fisted product tour into one that helps users see the product's value by creating a connection between them and your product.
In this article, I will outline some popular methods for onboarding and explain how they have been used to drive engagement and increase retention rates which can result in brand loyalty.
Welcome pages serve two purposes:
It sets the tone whilst establishing the groundwork for a long term relationship. Furthermore, it provides designers with an opportunity to encourage users to complete the product tour with an eye-catching, compelling ‘call to action’ function.
If during the sign-up process you have taken the users name, utilise that information by providing them with a personalised message. This has proven to effectively hold interest because it builds familiarity, makes them feel appreciated and suggests they can personalise your product to their specific requirements.
Sometimes there can be a drastic jump in experience when users transition from onboarding to interacting with your application. Therefore, it is imperative to ensure the language and aesthetics of the onboarding process are a good representation of the product - keep the value proposition consistent.
Progression bars are a very common UI element that have been designed to encourage users to complete a task. A good way to enhance this UI pattern is to start with it partially filled. It makes the user feel as though they are well on the way to completing the task, instead of starting from scratch which can be a deterrent if there are lots of steps.
Some users may already know what they want from your product. However, this is not true in all cases. Therefore, persona-based onboarding is a great tool to use when you are trying to communicate to a vast audience with different abilities and needs.
This type of onboarding can happen one of two ways; either in the background without the knowledge of the user or through a choose-your-own path option. Either way, this should improve the user's experience by making it more relevant to their specific wants and needs.
Product tours can be a really powerful tool as part of the onboarding process. They draw attention to particular features helping users learn, understand and become familiar with your interface. Essentially, it nudges users towards that ‘aha’ moment that ultimately increases product adoption, activation and retention rates.
Checklists are a valuable UI element when onboarding a user to a complicated application. It allows the user time to explore and retain information in their own time which prevents the user from feeling overwhelmed. Additionally, the checklist motivates the user to complete the process by using a number of powerful psychological principles (cognitive closure, principle of least effort, etc.)
Often designers choose to have the welcome/onboarding screens appear as a modal with a transparent overlay. This user interface pattern is popular because it allows users to see the application. It shows the user where they will end up and therefore, should keep them focused on the task in hand.
Hotspots are a relatively new UI pattern but they are being used more and more frequently because the unique pulsating animation (if done correctly) catches the user's eye in a subtle and unobtrusive way. Hotspots are essentially a cross between a tooltip and a notification badge, and are a good alternative if you want to provide your users with contextual information without disrupting their workflow - activate certain elements and features.
Action-driven tooltips are used to guide users through a more technical workflow. They isolate elements like buttons or form fields. Once this action has been completed, it guides them onto the next one. When used in the correct context it can be frictionless. However, use this approach sparingly as it can quickly become overbearing.
Gradual engagement is the process of moving users through an application slowly, helping them to experience the value firsthand before creating an account. By lowering the barrier of entry and the amount of personal information you require of users it can increase conversion rates. There are two approaches either delay account creation until after the landing page or entirely until after a user has reached their ‘aha’ moment.
Onboarding isn't just about welcoming users to your application, it is about helping them to experience the value of your product first hand and securing good retention rates.
Download this free resource to get expert tips and advice on how you can sell more products. Learn about social strategies, PPC ads, SEO and lots more ways to get ecommerce customers.