In a previous post, we looked at multiple opportunities over time for user onboarding techniques to be useful in our products. If we design for those opportunities ad hoc, we risk unscalable designs and frustrating users with fragmented education. Instead, let’s see how to tackle onboarding design so that it fits into a long-term approach to guidance.
Start at the end to map key actions
To avoid an onboarding experience that forces all users to follow the same path in the narrow window of the first run experience, we want to focus on finding the key actions that signpost various paths to success. It’s tempting to identify key actions by starting at the beginning of the user’s journey and plotting a path forward. But I prefer the perspective of designer Jonathan Korman who, in a recent thread about first-time use, said:
11— Jonathan Korman (@miniver) December 8, 2016
If you know the intermediate-use destination, you can strip stuff away to figure out what essentials to reveal for first-time use
By “intermediate,” Jonathan means to focus on core users instead of idealized expert users (since, as Alan Cooper says in his book “About Face,” most users are “perpetual intermediates“). These are the customers that sustain your product with good retention, engagement, or other contributions. These core users are the destination to which onboarding experiences should lead.
We also should look at unsuccessful users—those that churn or otherwise don’t contribute to our bottom line. Because that’s where we don’t want onboarding to lead new folks. Once we’ve defined these destinations, then we can reveal key actions by working back through the paths groups of these users took to get there.
It’s a bit like drawing the solution to a maze. Sometimes it’s easiest to see the solution by starting at the end and working out to the beginning. Similarly, if we start with the current state of core and unsuccessful users, we can work backwards to understand what established their current routines. What actions did core users share? What actions did core users take that unsuccessful users did not, and what actions did unsuccessful users take that core users did not? Many research methods can be useful here, including but not limited to cohort analysis and diary studies. If you have a brand new product, then work backwards from hypothesized core user destinations to map out assumed key actions.
Just be mindful that designing onboarding by starting at the end, after you’ve defined core use, isn’t the same as designing it late. The process of designing onboarding can uncover issues with the core product that you need time to address.
Break down key actionsOnce key actions are identified, we can set about guiding users through them. We can break each action down into 3 parts to clarify how guidance should flow through an action. Those parts are the trigger(s), the activity, and the follow-up, like we’re building a feedback loop. The following list covers what guidance may be necessary within each component. Trigger(s)
- Use history (such as entry point) and surrounding context to make the trigger compelling
- Explain the benefits of acting on the trigger
- Set expectations about what will happen next
- Assist with the skills or knowledge needed to complete the activity (this is where UI guidance can come in)
- Restate the benefits of this task
- Guide the user through any subtasks or obstacles
- Give feedback about what happened, whether successful or unsuccessful
- Lead to next available actions
Here’s how we might break down the key action of signing up for a New York Times subscription.
By breaking key actions into modules, we see how the follow-up of one action can link up to triggers in others. Onboarding becomes more about binding together interchangeable links in a chain, and less about creating a single string of actions everyone has to follow in the same order.
For a deeper dive into the concept of feedback loops, check out Microinteractions by Dan Saffer.
Long term guidance also gives onboarding the chance to reinforce the concepts it introduces. One reason we get stuck in a one-time-use mindset is by thinking that people only need to be exposed to something once to retain it. We touched on the concept of spaced repetition in a previous post. It’s the idea that people retain information and form habits effectively by repeatedly engaging in practice over time. Learning something only once is subject to a steep forgetting curve.
In addition to ensuring that onboarding techniques guide through interaction (which makes them inherently practicable), techniques should also have some means of reinforcement.
Reinforcement can be achieved through product-driven repetition or user-driven repetition. Product-driven repetition means that your site, app, or service decides when and how guidance should be repeated. User-driven repetition is when the user initiates repetition.
To ensure you are reinforcing concepts instead of mindlessly repeating them, vary how you present each iteration, the location of each iteration, and/or the frequency of repetition. For guidance presented proactively (like tooltips in an app or voice tips on a home speaker device) define an end condition: stop repeating them after n times; stop after the user demonstrates repeatable engagement with an action; include a dismiss function; and/or stop showing repetitions after n times with no user engagement.
User-driven repetition allows the user to control when guidance is next presented. This sense of control naturally combats mindless repetition.
Building for reinforcement is a great way to break teams out of a one-time-use mindset. When creating an educational moment, ask, “How can I reinforce this concept a second, third, even fourth time? Can the user revisit this?” When faced with making assistance useful multiple times, it helps steer us away from ad-hoc solutions like first run slideshows.
Choose appropriate methods
With a sense of where to apply and reinforce guidance, we can gather the best methods to our onboarding toolkits. The methods we build need to be appropriate for the user’s situation and the product’s (or new feature’s) situation.
Consider whether the user is in an exploratory situation when they arrive at the action requiring guidance, or on a mission. For example, a new user who leisurely browses to your website’s home page, or downloads your app from a promoted apps list, may be exploring and browsing. Meanwhile, someone accessing a shared document from a colleague is likely on a mission, and wants only guidance relative to that task.
Consider the product or feature’s situation, too. Users may expect prominent assistance for a new product type, like a VR headset or a bitcoin trading service. On the other hand, people probably prefer a lighter touch for established products like email. Typically, the more novel the value proposition or interaction space, the more prominent guidance may need to be.
When in doubt, stick to lightweight guidance.
Be appropriate for your product
In addition to being appropriate for the situations of your users and your general product type, all methods in your onboarding toolkit should act like they’re playing for the same team. Anything not matching up to your product’s identity will be disruptive or, worse, ignored.
Relying on third party onboarding or user education plugins can lead to inappropriate guidance. There are a growing number of onboarding tools out there, some specializing in walkthroughs, others offering tooltips and overlays. They might be OK for prototyping some ideas for triggers and placement. But these tools often don’t provide solutions that feel like a natural extension of your design language.
Often, educational content gets left out of design system and pattern library work. Perhaps that’s because it’s highly stateful. As product designers, we should develop an onboarding philosophy as part of our design systems and include user education and onboarding elements (tooltips, default states, inline guidance, on-demand help, reactive messaging, user feedback mechanisms, etc.) in our libraries and audits.
You can also catalog elements in a spreadsheet. Below is a quick example, using Brad Frost’s Atomic Design methodology, of how you might incorporate the stateful behaviors of onboarding and user education alongside the rest of your product’s patterns. Spreadsheets are particularly helpful if you are working on some non-visual or hard-to-screenshot surfaces, like VR or voice interaction.
Set up learning checkpoints
The previous activities help us structure guidance for our users. But we should also give them the opportunity to guide where we take our onboarding experiences. We can, and should, use a variety of research techniques like diary studies and cohort analyses to evaluate our progress, and I covered how to evaluate onboarding in another post. But we can also learn directly from users by making feedback checkpoints a part of their onboarding experience.
Making learning part of our onboarding process ensures that we stay apprised of new situations, and feeds into our discovery of key actions on the path to success.
To recap, we can add a few activities to our design process to help onboarding fit into a long-term approach for guidance. At the very least, they help us move away from a mindset that onboarding is a one-use experience. These activities include:
- Mapping out key actions by working backwards from the current behaviors of core users
- Breaking down key actions into triggers, activities, and follow-ups so that they can link to other actions
- Adding reinforcement to break out of a one-use mindset
- Assembling methods that are appropriate for our users and part of our design language
- Establishing learning checkpoints into our onboarding experience
By thinking about onboarding as part of a larger system of guidance, we create techniques that can be reused across the customer journey.