UX

User onboarding essentials

4 min read
Jane Portman
  •  Dec 19, 2017
Link copied to clipboard

The real goals of user onboarding.

User onboarding has grown into a separate UX discipline. Its goal is to facilitate the transition of first-time visitors into loyal, thriving customers.

Business founders usually invest plenty of resources into acquiring new customers. They develop and optimize a fancy sales page, run expensive ad campaigns, and do painstaking content marketing to drive new trials.

But once the user logs into the app, they’re often left alone. They start drowning instead of swimming towards their goal.

On average, nearly half of the users never log into the app again. Their first-run experience isn’t successful, memorable, or pleasant enough—and they churn without even becoming customers.

“On average, nearly half of the users never log into the app again.”

Twitter Logo

These sad metrics can easily be improved with certain UX efforts. And you’re the one who can make it happen.

What does the user care about?

You’d think the user cares about your pretty app, or about the tasks they’re performing in your app.

But that’s not true. What a user really buys with any solution is a real-life situation where they feel good.Twitter Logo
Any user wants to feel successful, stress-free, and socially comfortable. Your app just facilitates the process—they’re buying into being successful as a result.

Related: 5 key lessons for successful user onboarding

Any user onboarding is all about psychology: the early feeling of success and accomplishment will make the user come back.Twitter Logo This feeling is a strong psychological bond that works much better than any email reminder.

Cultivate the first small win

Your goal is to evoke that positive feeling of accomplishment as early as possible. It’s got to happen during the first visit.

Answer a simple question: what does your app ultimately do? Does it send emails, run surveys, help write novels?

Then take this key function, and scale it down it to the smallest possible outcome that’s considered a success. Make the user do something, and then show them the tangible output.Twitter Logo So they say, “Aha! Got it!”

Sometimes the first goal is too far away due to the nature of the app. Don’t worry—you can simulate the successful outcome with a test experience that imitates a real output. It’s going to be a miniature, artificial success. But the psychological anchor will be just as good.

For an email marketing app, the smallest win would be creating a list, getting the first subscriber, and publishing the first email campaign. But the odds are slim that it’ll happen immediately by itself.

So encourage the user to add a first test subscriber to the list, and fire the first test campaign. This will result in a very tangible email that immediately lands in their inbox.

MailChimp uses an encouraging voice in their copy, especially when the user achieves a goal. Here’s a sample screen they show when a campaign is scheduled for sending.

Make everything self-evident

People are naturally bad about remembering things. Teaching them today doesn’t mean they’ll remember how to use your app tomorrow.

Your core usability goal: make everything so obvious it doesn’t require any tricks to remember.Twitter Logo

Ideally, you should ditch your FAQ pages once and for all. Instead, sprinkle useful bits of microcopy exactly where it’s needed. Vent doubts and reduce frustration with clear labels, obvious icons, and simple workflow.

“Ditch your FAQ pages once and for all.”

Twitter Logo

Be empathetic and keep listening

No matter what, remain human and remember that the learning curve can be steep for anyone.

Use friendly language that resonates with your audience. Imagine them while you’re designing an app. Imagine that user opening up your app for the first time.

To do that, you’ll need to gather as much information about the user as you can. Do customer development and user research. Talk to the prospects and get feedback from existing clients.

The revelations can be eye-opening. You’d never expect a minor UX flaw to become a huge problem unless you talk to actual users. You also want to know what keeps them up at night. Your app should make their lives easier.

The variety of onboarding techniques

Last year I set out to read a great book by my friend Samuel Hulick. He’s a celebrity UX consultant laser-focused on the topic of user onboarding. I’d done some onboarding before, but I never considered myself a true expert. So I was looking forward to Samuel’s super list of wizards and tours.

Related: How to approach user onboarding—a conversation with Samuel Hulick

To my surprise, I didn’t find any. No wizards, no slideshows, no UI tours.

“These little devils have regrettably become deeply associated with user onboarding, to the point where many companies have come to believe that this UI technique is onboarding. This is flat-out incorrect. It is also, ironically, a strong indicator that the onboarding experience was tacked on as an afterthought.”
–Samuel Hulick, The Elements of User Onboarding

Ditch the fancy slideshows

Here’s what you shouldn’t do for user onboarding:

  • Introductory slideshows
  • Wizards
  • Coach marks
  • UI tours

As users, we can’t wait to get our hands on the actual product. We can’t wait to see the UI and start playing with it. While these nicely designed bits of information just annoy us and prevent from getting there.

Imagine yourself going to a new gym. You’re standing there awkwardly in your street clothes, and a polite sales rep is showing you around. Are you listening to her carefully, or would you rather change into your brand-new fitness attire and try out that shiny elliptical?

As designers, sometimes we forget what it’s like to use an app for the first time. We love adding fancy slideshows. Most clients love them, too, and that’s understandable. Who doesn’t like a pretty showcase of their own product?

“The first-run experience isn’t the appropriate place for any design showcase.”

Twitter Logo

There was a point in my personal experience when this was taken to an extreme: our agency built software for government officials, and the mere illustration of usability was more important than the usability itself.

We used such decorative onboarding to show that we cared about the user. While the deadlines were so tight that we couldn’t do what was really needed: rebuild the UI itself.

Don’t allow that to happen with your product. The first-run experience isn’t the appropriate place for any design showcase.

Instead, we should focus on making the UI itself as self-evident as possibleTwitter Logo, and subtly guide the user into learning it on their own.

Decompose your intro tour

Analyze any classic introductory tour, and you’ll find that the messages there fall into 2 categories:

  • Messages that illustrate truly complex situations
  • Messages that are slapped on just to say something or add visual interest

Ideally, you want to get rid of both. Notes like “input your email address here” pointing towards an email form are totally unnecessary and should be stripped off without regret.

Are the remaining few messages illustrating something really complex in your UI? Well, it shouldn’t be there in the first place. Go back to the UI building stage and spend a few more hours clarifying things.

Plenty of confusing situations can be improved by some extra thought:

  • Polish the microcopy (button labels, action names)
  • Add labels to confusing icons, or replace icons with text labels entirely
  • Ensure that the workflow is linear and transparent. Break up complex scenarios into more obvious actions.

Optimize the setup flow

Even if you dispose of the coaching messages in the first visit, there’s still a bunch of steps leading to the first small win.

They all seem inevitable at a glance. However, take some time to review these steps. Most likely, some of them can be omitted or postponed, like giving a name to the project or a client, verifying an email address, etc.

Design the blank slates carefully

Blank slate is how your UI looks when there’s no content yet. You want to design placeholders to fill in blank content areas. They should be visually attractive and contain hints or ideas for the user.

Call-to-action buttons in blank slates can be rather deceptive. Of course, they encourage the user to commit that first action, like adding their first client or creating their first project.

However, it’s not what you really want to do. You want to teach the user how to perform the same action using normal UI controls. Next time, they’ll have to do it by themselves since the blank slate won’t be available anymore.

Related: Are these friction points lurking in your app?

Don’t forget about dashboards, graphs, and charts—they’re also empty during the first visit. It’s tempting to fill them in with sample content, but that’s a shady path. Your sample content can be confusing to the user. Your best choice is friendly, educational, bite-sized advice.

Use content as a tutorial

Content as a tutorial serves the same goals: it fills in the blank space and educates the user. But in this case we’re not deceiving anyone. The user gets to play with a sample project that’s stuffed with rich content, educational notes, and hints.

In Airstory, the user gets 2 sample projects to play with. Each includes friendly advice, which is structured like a regular user project.

Gamify

You can gamify the experience using the natural human desire to accomplish things and compete with others. Here’s what you can do here:

  • Show leaderboards, scores, and badges
  • Use wizards that promote a sequence of in-app goals
  • Unlock some pleasant perks as users achieve these goals

Automatically give your users significant progress credit upfront. People are much more likely to complete something that’s already done by 60%.Twitter Logo This initial 60% can consist of something as simple as “Log in, register, and input your name.”

Plan for lifecycle emails

Email reminders are a strong tool that make the user remember and come back to the app. Even though email sequences aren’t precisely a subject of UI design, you should keep this scenario in mind while developing your onboarding strategy.

Your goal is to include as many wins as possible into the first visit in order to boast about these achievements in the upcoming email reminders.

Be polite and friendly

It’s so easy to frustrate someone with a careless phrase. Imagine hearing something like “You don’t have any friends.” Don’t say that.

“Don’t forget to praise the user’s accomplishments.”

Twitter Logo

Instead, tell the user how great it’ll be here later with friends in place, and provide a hint about how to get them.

Always use friendly, encouraging messaging. And don’t forget to praise the user’s accomplishments.

Collaborate in real time on a digital whiteboard