Gaming
Entertainment
Music
Sports
Business
Technology
News
Design
Fitness
Science
Histoy
Travel
Animals
DIY
Fun
Style
Photography
Lifestyle
Food
2018-01-18T07:53:01.489Z
0
{"feed":"First-Time-User-Experiences","feedTitle":"First Time User Experiences","feedLink":"/feed/First-Time-User-Experiences","catTitle":"Design","catLink":"/cat/design"}


















Procreate new version onboarding for existing iPad app users

Procreate recently introduced a major update for their iPad app. The onboarding experience for this update involved a lengthy slideshow, with each panel comprised of text overlaying rich videos.

The good bits:

  • The videos are high quality and do a fairly decent job of illustrating the major changes Procreate talks about.

To be improved:

  • This introductory slideshow, which begins with a generic “Welcome to Procreate” message, may be frustrating to existing users. After all, they have already been using the product, so this makes it sound like they’re about to be treated like a new user. As a result, they may exit out before proceeding.
  • The “Close” action (an “X” in a small circle) is hard to see, since it is semi-transparent and overlaying moving video.
  • The videos autoplays, so it can be hard to read the text on each slideshow screen and then catch the video before it’s already played partway through.
  • The text is thin and overlaying moving video, making it very difficult to read. It’s also quite verbose, making it difficult to parse.
  • There’s no sense of progress. The slideshow is not paginated, and it’s not clear how long each video clip is. 
  • If an existing user skips this tutorial, there is no follow-up guidance in the product itself to reinforce major changes, and no discoverable way to replay this tutorial later. The tutorial has 9 slides loaded with...


















Lumosity.com onboarding experience from pre-subscription to post-subscription education

The good bits:

  • Lumosity has planned on continuously onboarding users who may be in different situations, instead of focusing just on the first run experience. A new user who doesn’t choose to subscribe after their first session is still engaged in daily training, with education about the subscription service sprinkled throughout their free experience. Meanwhile, users who subscribe are also educated and engaged through onboarding techniques that introduce them to new training modes and the insights they can unlock with continued training.
  • Although the user can learn about Lumosity’s product from the home page, Lumosity.com spends most of its time familiarizing new users through direct interaction with games. After a user signs up, they are immediately guided into their first training session, comprised of 3 handpicked games. Although Lumosity will sprinkle some information about its subscription service throughout this initial session, it waits to provide a large call to action until the user has completed this first section.
  • Lumosity.com leverages gradual enhancement, expanding upon actions and the information it provides after certain milestones. For example, the first training session is tightly focused on completing 3 games, and its recap shows the potential growth areas the user can focus on. The second free session expands to show 5 games, 2 of which are locked until the user subscribes, and the recap focuses on providing information about the subscription...




















Etsy Pattern - New feature onboarding

This is an example of using onboarding techniques to introduce existing users to a new feature. Here, Etsy sellers have the option of using a new feature called Pattern, allowing them to create a custom website and URL for their shop.

The good bits

  • The existing user is made aware of Etsy Pattern via a dismissable banner that appears on their seller dashboard, a form of an inline cue. This banner area has always been used for Etsy-to-seller communication so it is a natural progression. When the user taps on “Try it for free,” they see an indicator that their Pattern site is being set up. Instead of explaining what Pattern is, Etsy demonstrates its value by immediately importing the seller’s existing listings to create an interactive demo.
  • During initial import, Etsy uses a custom loading screen to build excitement and set expectations. If the user exits Pattern before publishing, but then returns to it later, they are not forced to see the loading screen again.
  • After importing listings into Pattern, the site brings the user to a dashboard with a default theme. It uses images from the user’s listings to illustrate how their shop would look with that theme and invites the user to change the theme and its styles. The user is never faced with a completely empty state where they have to start...














Mona Shopping Assistant iOS app onboarding experience

The good bits

  • The app starts with a friendly introduction and an immediate personal focus by asking the new user for their name.
  • Mona embraces the concept of the free sample, not forcing a new user to sign up. The new user can begin creating “Missions” (saved searches that allow the assistant to find related items), create a size profile, and start giving the assistant feedback, all without being forced to create an account first.
  • The new user can permit Mona to learn about them implicitly by linking Mona to their email account and parsing receipts from their email.
  • After the new user completes the introductory wizard, they are greeted on a home screen that is already populated with sample mission content and a clear next step to “add your size for improved fits.”
  • The app uses a user-guided tutorial, showing one-time hints to the new user as they navigate through mission cards and products. These tips guide the new user to particularly interesting products or features. The hints are spaced out enough to avoid being annoying, but frequent enough to establish a reliable cadence and set expectations that this is the primary way Mona will communicate key finds to the user.
  • The app continues maintaining a personal focus, learning more and more about the new user by eliciting feedback as they favorite or dislike items. If a user dislikes an...





















BB-8 app-enabled droid - first time user experience

For a video of the full setup experience, view https://youtu.be/jRg15FMiglc 

The good bits:

  • The quick start guide is clearly illustrated.
  • The BB-8 droid is responsive throughout the setup process. Before pairing to the app, it moves around as if it’s seeking something. When it connects to the app and begins downloading the firmware update, it pulses yellow. When the firmware update is complete, it moves upright to attention and glows steady blue. Even on a screenless device, this kind of feedback reassures the user that stuff is happening.
  • Although the firmware update can be lengthy, the app cycles through fun animations of BB-8’s mechanical composition, and, as it nears completion, prints “Enjoy your new BB-8” on the screen.
  • The app limits the setup experience to a few simple steps, getting users to a state where they can begin using their toy as soon as possible (aside from a few notes mentioned in the improvement section below).
  • The app uses a mix of playthrough tutorials (tutorials that simulate everyday use, but in a protected space) and user-guided tutorials (gradually revealing next step hints as the user traverses the everyday UI) in the first run of each section. The “Drive” section, for example, starts with a playthrough tutorial. It first teaches the user to aim BB-8; when this is complete, it teaches them to steer it with a...
















Pokemon Go (iOS) first time user experience

The good bits:

  • Although the game forces sign up, it gives new players the option to sign up with Google. This expedites the process since the new player doesn’t have to create a brand new account (although they still need to trust that the game will use their 3rd party account information responsibly).
  • Instead of frontloading all new user setup steps, the game spaces out its introduction, avatar selection, character naming, and instruction. A new player starts by getting an introduction from the “Professor” (their guide in the Pokemon Go universe), and customizing their avatar, which is a fun and easy experience. Then they are taught to catch their first Pokemon, followed by naming their character. The game even delays when a new player can start training their Pokemon until they’ve reached level 5, which gives them greater odds of success when they put their Pokemon up against other players in the gym.
  • The wizard for customizing the user’s avatar adds personal focus to the experience. 
  • The game has a great playthrough tutorial for teaching people how to catch their first Pokémon. The playthrough starts immediately after a new player saves an avatar. Typically, in order to find and catch Pokémon, people have to walk around in the real world until one appears. Depending on the player’s location, this could happen quickly or take a long time. Having to wait...
















Pinterest mobile app first time user experience

The good bits

  • The app’s signup flow, albeit forced, is fairly easy. It’s 5 steps and comprised of progress indicators, simple questions, and helpful error validation. Users need to validate their email address eventually, but are not required to validate it in order to complete setup.
  • The app’s new user experience is tightly focused on getting the new user to follow collections. After creating an account, they are asked to pick their interests and then follow 3 or more boards based on those interests. This ensures the new user gets a customized feed of content (aka personal focus) and doesn’t overload them with other, “nice-to-have” steps.
  • A user guided tutorial presents hints to the user based on their actions. Once a user has scrolled through their feed, tap hints appear on top of pins to suggest the user see more details. Once a user has tapped on a hint, another touch hint appears on the “Pin it” button. And after that, the last hint appears on top of the “View more” button to encourage users to visit each pins related web URL. However, there are some issues with the responsiveness of the user-guided tutorial, which is covered in the “to be improved” section.
  • One of the nicer onboarding moments occurs when the new user taps the “Pin it” hint for the first time. Doing this displays an overlay that...
Evaluating onboarding experiences :

Redesigning your product’s #firsttimeux? Check out some ideas for evaluating onboarding experiences













MODE snap-and-swap watch bands - quick look at unboxing

While simpler than the typical app, site, or IoT product #firsttimeux flows I tend to catalog, I occasionally like to share unboxing images from analog products. These watch bands use a mix of packaging instructions and website videos to guide new band owners.











Reddit mobile app first time user experience

The good bits:

  • Reddit employs a free sample approach to onboarding. Sometimes, getting users immediately to content is all that’s needed. On app launch, users are shown a single value proposition screen which allows them to sign up or begin exploring via “Skip for now.”  The subsequent experience drives interest in deeper engagement by exposing popular posts (and their hilarious comments) in a breadth of categories. Reddit knows that its fresh content is what drives users, and that its website already provides that content account-free. Its mobile app doesn’t make the mistake of forcing all new users to have accounts or to have them watch an intro slideshow.
  • New users are able to fully explore all the subreddits Reddit offers in the second, “Categories” tab of the app.
  • The signup flow is simple, and it includes the ability to unmask their password as they type, and to continue using the app without being forced to exit for email verification.
  • Once an account is created, the new user receives a welcome message in the “Messages” tab to introduce them to the basics of contributing to Reddit. There is also a subreddit for community support at r/redditmobile.

To be improved:

  • When signed in, the new user will find their “Categories” tab evolved–in that it’s suddenly sparse. Unlike not-signed-in-users who see all categories exposed by default, account owners need to manually search for and subscribe to specific categories in order to...














Miitomo app first time user experience

The good bits

  • After creating an account, the user is invited to build their Mii (an avatar). For new users not familiar with Nintendo games this is great introduction into the New users can choose to create it with a variety of options: create from a photo, create from scratch, or scan a QR code (for those who were dovetailed into this app from another Nintendo experience). Regardless of what option they choose, users can tweak their Mii’s physical presence using a full range of tools, and, instead of being interrupted with instructions, simply sees the effect of each change via a live preview.
  • The new user can even control their Mii’s voice and personality. This really helps the new user take ownership of their experience with an explicit personal focus.
  • The Mii “talks” to the new user via speech bubbles and invites interaction at intervals to teach them about key app functionality (such as the daily question).
  • The app sets up a clear reward system to increase user engagement during the first few weeks of use. “A special bonus for your first 7 days” is a clear attempt at increasing 7-day retention.
  • While it’s not desirable to have an app with so many loading states, Miitomo at least leverages this waiting state to provide inline education and tips.

To be improved

  • The presence of sporadic tooltips pointing out UI functionality across the app experience indicates...










Tinder app first time user experience

The good bits

  • Although Tinder shows an intro slideshow, noted in “To be improved,” the new user isn’t forced to swipe through it. They can tap the “Log in with Facebook” action to get started.  
  • Given Tinder’s typical use case, it is daunting to link the app with one’s Facebook profile. Tinder attempts to assuage this by offering a reassuring note that says, “We won’t post anything to Facebook.“
  • The account verification step in the signup flow does not require the new user to exit the app. It is done by sending the user a text and the user can catch the verification code in the heads up notification at the top of their mobile screen.
  • Tinder provides a user-guided tutorial to allow new users to start playing, providing education in response to their interactions. The first time a user completes key actions, like swiping left or right on a card, the app will display a message reinforcing the action’s purpose with the option to undo. After those messages are seen 1 time each, the app gracefully reduces its level of reinforcement to simple inline cues. In the case of swiping, it silently adds a “Nope” or “Like” label to cards as they move off screen. The same happens the first time the user taps “X” or “♥” on individual profiles.
  • Inline cues are leveraged for empty states and supplemental education. For example, messaging is...








Venmo mobile app first time user experience

The good bits

  • A new user can view a stream of public transactions before signing up. This is a limited version of a free sample, and makes it clear to the new user the kinds of exchanges Venom supports before they sign up for an account.
  • With the exception of notifications, all asks to share data—like contacts—are prefaced with a clear, simple justification screen.
  • Once a new user signs up, they can either continue exploring a public stream of transactions (which, due to comments left by users, can be very entertaining), or complete a checklist of “getting started” to-dos like adding a bank or a payment card. Both are ways of getting the user engaged with key areas of the product, even if they have no transactions of their own in play.
  • The privacy controls, once discovered, are well explained.

To be improved

  • The signup flow heavily pushes the new user to connect their contacts and Facebook information to their Venmo account, which may be premature as the user doesn’t have a sense, yet, of how that information will be used—and may not even have a Facebook account.  Venmo could consider letting a new user add friends manually in the signup flow using individual names or phone numbers, so they could start with a few contacts but not give the app access to all of the ones on their phone.
  • Venmo appears to default all account transactions to public sharing (except...
New article! "Engaging new users: Personal focus":

Check out the last post in a 3-part series about designing good onboarding, and see how we can give our new users a personal focus.













Peach mobile app first time user experience

The good bits:

  • Peach uses a variation of a playthrough tutorial to teach the new user about the key parts of interacting in their space. This tutorial takes place within the full product area, but, by providing explicit guidance, gradually exposes them to the components of the app.  It starts by asking the new user to type “Hello!” and ends by asking them to choose a more complex feature to try.  Only at the end of this playthrough, when the new user has been introduced to the basics, does it prompt them to add friends.
  • One of the most powerful onboarding elements of Peach is the autosuggest box that appears at the top of the keyboard–it doesn’t need the user to type a full magic word to see a suggestion.  It begins showing shortcuts to contextual actions as user types. It’s a form of a user-guided tutorial because it moves at the user’s pace, giving them a sense of self-discovery as they uncover hidden features in the app, without getting in their way. For example: typing “help” will suggest a link to show a cheat sheet of shortcut commands; typing a word that starts with “m” reveals that you can post your motion activity (ie, “4,566 steps today”) for your friends to see.
  • When the text field is empty, the tips box collapses into a small lightbulb icon. When tapped, it...










Instagram iOS app first time user experience

The good bits

  • Each screen in setup is focused on a single task, and there is no introductory tour to distract users from the steps at hand. Screens are consistent whether the user is signing up via email or via Facebook.
  • When asked to create his username, the app provides realtime validation as to whether that name is available.
  • During setup, the new user is encouraged to choose interests and follow the accounts of contacts or suggested people.  This adds a personal focus that can set him up for success.
  • Outside of the setup flow, Instagram relies on well-placed inline cues so that the user can learn by exploring. Empty screens use inline cues to educate the user about what that section is for, and show an action the user can do to populate content.
  • The education on most blank slates makes it clear that sharing media is the app’s key action. All camera permissions are asked at runtime, providing immediate context so that the user understands why he needs to allow access.
  • Other inline cues show up over time, like the hint to use Instagram Direct, or the “Tap video for sound” tip that appears on videos and eventually reduces to a simple “unmute” icon.

To be improved

  • The app forces the new user to sign up before showing any content, despite the fact that it is a content browsing product. The user is asked to add a...








New York Times app for iOS first time user experience

The good bits

  • The New York Times typically requires a subscription.  But on its website and, in this case, its mobile app, new users can read up to 10 articles per month without an account.  This is a great example of a free sample, in which a new user can discover a product’s value proposition for herself through direct interaction, all before being required to register for an account.  
  • The app immediately brings the user to content instead of subjecting her to an introductory tour or other obtrusive education. Instead, education is sprinkled around the app in the form of inline cues, such as hints to swipe horizontally to navigate between sections or articles. 
  • The app also uses inline cues as education on empty states of the app, such as the informative text provided on the empty state of the “Saved for Later” section that tells the new user how to save articles she likes.

To be improved

  • When the new user downloads this app on iOS, it gets added to the iOS Newsstand app. This means there is no NYT icon on the main app screen, which can be disconcerting for a new user who may be looking for it there.  The only way a user can open her new app is to either figure out on her own that it lives in the Newsstand app, or go back to the download screen in the...
Engaging new users: Free samples | Krystal Higgins:

Read my newest post about designing better onboarding with the use of free samples.

















“Bedtime” new feature first time ux for iOS Clock app

It’s interesting to see overt feature onboarding in a core utility app, but that’s exactly what happened in the iOS Clock app on a recent update of the OS. The  new feature is called “Bedtime,” which attempts to automate the process of setting alarms.

The good bits:

  • This feature is introduced proactively within the app, but not in an interruptive nature, such as through a notification or app overlay. Instead, when the user first opens the Clock app after the update, it will default to the new “Bedtime” tab, which has an empty state that encourages the user to set up the feature.
  • Each step in the setup process has a default setting. In my case, the first step defaulted to the first alarm I had in my Clock’s Alarm list. These defaults also carry forth the opinion of this feature, which is that sleep times should be consistent all days of the week. This message was clear with the default setting for the days-of-the-week step, where all days of the week were selected for the alarm.

To be improved:

  • At the end of the day, this tab overlaps a lot with the Alarms tab, so users may be confused in dealing with multiple Alarms controls.
  • The last step of the experience (”Stay consistent. Sleep better.”) is confusing because it frontloads the concept of “sleep history bars” without any context. The next...
















Dropbox Paper for Web, new feature onboarding

The good bits:

  • Instead of an interruptive modal dialog or other prominent treatment, Paper is introduced with a subtle, inline “NEW” cue appended after its Dropbox menu item.  
  • New users are proactively encouraged to start by choosing from 3 templates. The templates implicitly educate about the hero use cases for Paper while giving them concrete examples to build from. Proficient users can choose to skip this step and go to their empty directory list, or start with a blank document.
  • Templates include inline cue text to indicate the content that could be included in each major section of the doc.
  • A non-blocking user-guided tutorial encourages a user to conduct 3 actions, automatically giving feedback and progressing as steps are completed, and without blocking a user’s interaction with other parts of the experience.
  • At the end of the initial first run experience, a hint points out where the user can go to learn more about keyboard shortcuts. This also implicitly points out where access to other types of help content, like the “Paper guide,” lives. This is a good approach of closing out a first run experience with a hook into next learning opportunities.
  • Another way that Paper provides onboarding support is by including a folder of “Example Docs” within every new user’s directory. Unlike the templates provided at first run, these example docs are fully composed (yet...