10 UX design principles for great onboarding

By Elsa Plumley

When was the last time that you downloaded a new app to your phone? How many times have you used that app since you downloaded it?

Data shows that a staggering 77% of users stop using an app just 3 days after downloading it. By 3 months, only 5% of downloaded apps are still being used.

Why does this happen? The most common reasons that consumers report giving up on an app are because it hasn’t met their expectations, it’s confusing to use or it hasn’t demonstrated any value.

Not only has a lot of your business’s time, money, and effort been wasted, but customer loyalty and brand value have also potentially been damaged. So, how do you make sure that your app is one of the 5% and not the abandoned 95%?

It starts with a good idea, and good user experience design to bring that idea to life. Given the short window of user attention available to demonstrate the app’s value, the first-time experience of using the app is a critical part of the UX design and needs proper attention. What will it feel like using the app for the first time? How will we get them comfortable with the key features quickly and easily? How do we show them the benefits the app will bring?

Designing great onboarding

In the context of experience design, onboarding refers to the process of helping users get started with your product, service, or app and to fully embrace its features over the long-term. Here are our 10 principles for designing a great onboarding experience:

Best practice onboarding principles

  1. Remind users why they need your product
  2. Maintain momentum
  3. Do > Show > Tell
  4. Design blank canvases that drive action
  5. Reward progress
  6. Encourage users to set goals
  7. Use the goal gradient effect
  8. Coach to improve performance
  9. Implement a system of progressive learning
  10. Think beyond first time use

1. Remind users why they need your product

Customers who have downloaded your app are not always completely bought-in to your product or service yet. They may have downloaded the app simply to try it out and decide if it’s right for them. So it’s important to remind them of their initial motivation for downloading the app, and as part of their first experience show them the benefits of using your app.

Google Inbox uses 4 short introductory screens - which is a common mechanism for onboarding - to remind customers of the benefits of using their app and to draw attention to the competitive advantages of the product. Lookout, on the other-hand, uses introductory slides to engage users in a fun quiz that describes scenarios and problems the app is designed to solve. It encourages users to take action immediately based on their responses.

2. Maintain momentum

People are impatient, so don’t make your users wait to get started with your app. Long walk-throughs or tutorials at the start kill momentum, make the app appear complicated, and often get skipped. Short, animated introductions or a video that reminds users how the app works will give them the information they need to get started straight away, without making them wait too long.

3. Do > Show > Tell

People learn best in context. Trying out the app and getting guidance during use is more effective than reading instructions out of context. Tell, show, do is an age-old training technique that helps learners quickly get to grips with basic concepts while keeping them engaged. Simply, it involves sharing information with the learner, then giving them a demonstration, then asking them to try it out for themselves. There are two variations on this technique you can take, depending on how linear or variable your user flows are.

Do > Show > Tell works well when there are a variety of actions people can take and the order doesn’t matter. Google Inbox allows users to freely explore the app, then shows tips and coach marks on the screen after users have interacted with a specific part of the app. This allows users to explore areas they are naturally interested in, and helps them understand the actions they’ve just taken and to crystalise learning.

Tell > Show > Do works better if the process you need users to complete is linear or there is a particular order they need to learn in. Typeform uses a brief introductory tour showing key steps in the sequence of building a survey to help users understand the process.

Typeform

Typeform introductory screens

4. Design blank canvases that drive action

Content drives value for most apps. However, for many apps the content is actually generated through usage and interaction, so on first use key screens might feel barren and empty. These blank screens can feel like a dead-end to customers.

Including clear calls-to-action in the first steps will help users to populate these screens with content, meaning this issue can easily be overcome whilst users gain understanding of how to use the app. For example, when they don’t yet have any expenses recorded, the Expenses app presents a call-to-action to encourage users to add a new card and start tracking expenses.

Expenses App

Expenses app call to action

5. Reward progress

Recognising and celebrating small milestones in set-up and first-time use creates a positive feeling about using the app and product, and can help encourage users to come back for more. You can  have fun with this and find creative ways to reward users. The Robinhood stock trading app encourages users to place a first trial trade as part of the set-up then gives them a congratulatory message before inviting them to sign-up. 

Robin Hood

Robinhood congratulatory sign up message

6. Encourage users to set goals

Take advantage of the commitment and consistency principle (Cialdini, 2009): When people make a commitment, particularly a public one, they develop a strong drive to appear consistent to their word and are more likely to follow through on the behaviour.

Getting users to set a goal can increase their motivation to use the app, planting a seed for repeat usage. Duolingo capitalises on this by asking users to set themselves a target of how much time they will spend learning as the first step in their set-up process.

Duolingo onboarding screen
Duolingo onboarding screen
Duolingo goal setting screen
Duolingo goal setting screen

7. Use the goal gradient effect

Research also shows that as people approach their goal, they become more motivated and put more effort towards completing their task. Showing a clear progress indicator, like using ticks for completed learning sessions and to-do lists, helps take advantage of this. Duolingo has a clear progress indicator during the first trial lesson and badges showing progress towards their goal at the end.

Dulingo 3

Duolingo daily goal recognition

8. Coach to improve performance

People learn by making mistakes and being corrected. Giving users feedback on their performance, particularly when they’ve got something wrong, can help improve their performance in the long run. Duolingo gives clear feedback to the user about where they are successful and where they are incorrect, encouraging them to correct mistakes and learn.

Dulingo helpful failure message
Dulingo helpful failure message
Duolingo notation of success
Duolingo notation of success

9. Implement a system of progressive learning

This is a more complex strategy most suitable for products and apps that are of a more technical nature. It involves a system of unobtrusive tutorials and assignments to help the user learn over time. Usician includes tutorial videos, assignments and practice sessions to help users improve their musical performance.

10. Think beyond first time use

Onboarding isn’t just about first-time use. To design great onboarding, you need to think about what happens every next time your users launch the app. Consider how you will progressively get them engaged and excited about using your product or service. When used correctly onboarding can be effective at encouraging app usage over the longer-term. For example, highlighting additional features that they haven’t used yet can be an effective way of deepening engagement and longer-term use. Monzo takes this one step further by presenting a percentage of the features that the user has engaged with so far (so also making use of the goal gradient effect) and gives them tips about additional features people could use to get more out of the app.

Make onboarding part of the design process

One of the more common mistakes design teams make is to leave the design of the onboarding experience until last. It often becomes about designing a tutorial to help first time use, and neglects thinking about how to create immediate value and long-term engagement for the user.

If you think of onboarding beyond first-time use, it’s obvious that it needs to be considered throughout the design process, not just at the end. It requires a different approach to UX design, and a shift from just designing individual screens to thinking about the various states of screens throughout different journeys and flows in the customer lifecycle.

Elsa Plumley

As Experience Design Director, I oversee the quality of the Experience Design work we do for our clients here at Foolproof. My particular area of focus is ensuring the quality of the advice we provide to our clients, right from how best to organise themselves and approach tackling a business challenge, through to how best to solve specific design problems.

View Elsa's profile

What do you think?