Earlier today I decided I could be managing my time better and therefore needed a new to-do list app (I go through this phase about once every six months). Within ten minutes I had downloaded eight different apps, briefly reviewed each one before deleting all but two of them for further investigation. There is absolutely no way that I could have made a thorough and informed decision about a piece of software in that space of time. But I wasn’t really aiming to make a thorough and informed decision: I was aiming to quickly get a feel for each app and see if they provided the functionality I desired.

It’s not just me that does this either, 77% of users will discontinue using apps within three days after downloading. These retention rates were first brought to light by Andrew Chen who highlighted that the primary reason for this dramatic curve is poor onboarding.

Retention curve for android apps

Onboarding is the process of brining users into an app; quickly highlighting the key features of the app, and educating them on how to use them. Apps have a very specific window of time to take advantage of onboarding; too long and users will exit and delete the app; too short and they won’t know how to use the app, get frustrated and probably delete the app.

App onboarding is most often achieved via the following methods:

  • Demonstration of value proposition
  • Tutorials
  • Progressive in-app indicators
  • Empty states
  • Investment

Whichever method, or combination thereof, you choose to adopt, it should be dictated by your users and their needs. Adorable illustrations are delightful but if nobody can figure out how to add content, your users won’t stick around for long.

Value proposition

You only have a few seconds to get your users excited for your app, so use them wisely. Communicating your value proposition can be a great tool for keeping users engaged long enough to being creating content. Highlight what your users can achieve and benefit from, rather than reiterate functionality. Just remember to keep it short and direct. Every screen that separates your user from your app’s actual functionality is a threat to your retention rates.

Here are a few tips on how to maximise the impact of your value proposition in your onboarding flow:

  • 3 screens maximum. I don’t care how excited you are about your app’s features. Your users will never use them if they never reach them.
  • 1 Headline + 2 lines of description is plenty.
  • Eyes are attracted to movement so include animations if possible. Bonus points if the animation can communicate how to interact with your app.
  • Don’t just let your users know your apps features. Let them know what they can do with the features and how they will benefit.
  • Always include a skip button. The impatient among us will be grateful.

Slack onboarding screens

Slack has a total of 3 screens in their onboarding process, and a login screen to immediately give users access to functionality.

Dropbox utilises simple hand drawn animations showing how users can benefit from the app. Telling me that I can “back up your photos from the bus” not only tells me I can back up my photos, but I can do it anywhere and at anytime. They also include a call to action on every screen ensuring that users can jump straight in, and don’t have to sit through the entire animation if they aren’t so inclined.

Dropbox onboarding screens

Dropbox combines their value proposition animations with their sign up screen.

Tutorials

Tutorials or walkthroughs can be incredibly valuable for communicating how to use your app, but they have a time and a place. Try and recall the last time you read through an entire tutorial or manual. How many times did you pause the video, or scroll back a few paragraphs to refresh your memory on how to do something that was literally explained to you two minutes ago? A tutorial asks users to take in a lot of new information very quickly and then hope that they remember it all, so remember that any tutorial that lasts longer than 20 seconds is going to require a refresher.

Gmail onboarding screens

Gmail includes tutorial style onboarding screens to explain to users how to perform basic actions in the app.

“Web users are notorious for not reading, and mobile users tend to be even worse due to limited time and fragmented attention. “

If possible, distill your tutorial into the three primary functions required by your app into a quick (and ideally animated) guide. If your tutorial is getting too lengthy you might want to consider a hybrid of tutorials and in-app reactive tips. Every screen a user has to swipe past that is potentially another barrier to your retention rates.

Progressive in-app indicators

Also known as the Let Your Users Tell You When They Need Help method. Progressive in-app indicators are also known as reactive and proactive guides. They are similar to tutorials in that they educate users on how to complete functions but they do not follow the standard step-by-step format. In-app indicators provide contextual information on how to complete functions based on a users current position in the app.

There are many forms of progressive in-app indicators that can be used to your advantage including (but not limited to):

  • Coach marks
  • Contextual tips
  • Empty states
  • Success messages

Coach Marks

Coach marks are usually used when it is known that a user has not accessed a particular screen before. The screen will typically fade to black and a message will pop up informing the user how to complete a certain action. Coach marks can be useful for communicating a single interaction, eg. “swipe to the left to edit” but can fall into the same trap as tutorials if multiple marks are displayed at the same time, bombarding your user with information they will most likely forget as soon as the coach mark fades away.

Contextual Tips

Contextual tips pop up once a user has interacted with a feature or will very shortly. These tips should inform a user of how to complete a certain function or where a certain feature is located. They should appear as obviously separate to the app (speech bubbles or hints are often utilised here) and briefly indicate how to interact with a feature. Tips and hints should be used sparingly and only where the UI cannot speak for itself.

Evernote onboarding screens

Evernote utilises both contextual tips and coach marks to help their users

Empty States

Empty states are the bread and butter of in-app guidance, particularly where the app’s core functionality is based on user content. No user content to display yet? Don’t leave a blank screen or a fierce “No content here” style message. This is essentially a dead-end hallway that your users have spent significant time walking down. Instead prompt the user to create content. Indicate where and how they can do this. Provide some examples of other users’ content. Provide templates for content. Don’t tell your users there is no content (because that should be pretty obvious): tell them how to fill the gap.

AirBnB empty state screens
AirBnB uses their empty state to explain what should be shown and encourages users to start creating content.

Empty states are a great place to get creative and highlight the tone of your app. There are plenty of examples of empty states that manage to inform users of the lack of content while appearing playful and lighthearted.

The example below uses animation to mitigate the negativity of the message while also including a clear call to action to prompt the user for content.

Animations used in empty states

Investment

Creating investment encourages continued engagement: users will continue to use what they have worked for. Features such as avatar creation or profile building in your onboarding process create user engagement helping reinforce the value of your app. Gamification is also another means of creating engagement early on in your onboarding process.

Waze introduces the user as a “baby wazer” from which the user can grow through consistent engagement with the app. This creates investment through achievement and ensures higher retention rates.

Waze onboarding using investment

Onboarding often includes the sign-up process and asks users to provide personal information and begin to create content. While this definitely creates investment, you might lose your users before they even get to the functionality. Make sure you’ve considered the appropriate time for gathering information about your user. If it’s not integral to the functionality that your user add a profile picture during the sign-up process, then let them do that later. Let them take their time with processes that require personality, thought and self-image: your users will appreciate it. Of course, sometimes a lengthy sign up process is required. A medical app for instance, might require a bit more personal information before the user can benefit from the app’s functionality. If this is the case, let the user know what’s going on, how long it will take, and why gathering this information is important. Visual queues such as progression indicators, and short descriptions will make sure your user isn’t left in the dark and will abandon the process before even getting into the guts of the app.

Basically, it all comes down to your first-time users, their needs and their tendencies. Conduct user testing often and early to determine how much hand-holding they require, whether your value proposition is clearly communicated and whether they are likely to stick around.

References

  • Aptimize(2016, February 17).The 4 Best Mobile User Onboarding Flows We’ve Seen So Far. Retrieved from https://apptimize.com

  • Babich, N.(2017, January 14).Best Practices for Onboarding. Retrieved from https://uxplanet.org

  • Chen, A.(n.d.).New data shows losing 80% of mobile users is normal, and why the best apps do better. Retrieved from http://andrewchen.co

  • Dye, J.(2016, March 4).77 percent of users never use an app again 72 hours after installing. Retrieved from https://www.androidauthority.com

  • Harley, A.(2014, February 16).Instructional Overlays and Coach Marks for Mobile Apps. Retrieved from https://www.nngroup.com

  • Marrs, M.(2016, April 27).App Onboarding 101: 7 Tips for Creating Engaged, Informed Users. Retrieved from http://info.localytics.com

Category:

Design

Previous