Today at Mobile UX Camp Seattle, Joe Welinske gave an illuminating presentation about first time UX Walkthroughs. Great ideas are worth sharing.
There is a debate about interaction design. Some say, if you need help, you already blew it. Good user experience is so well-done that it’s seamless. Apps should be limited in features anyways. If you can’t figure it out, it’s the UX designer’s fault.
Either your app is enterprise specific and it doesn’t need to act like mainstream consumer apps or it’s for the public and it uses common conventions, right? We looked at in-app tutorials, overlays vs. interactive, animation vs. live app interactions, and games vs digital journalism. The decisions made about walkthroughs depend on the 4 C’s: contextual, conforms, conditional and concise. The information should be information at the time you need it, optional, easy to click out of, efficient and consistent (looks and feels like the branding of the app).
Approach 1: This app works like all apps of its genre. It uses standard visual cues like typrographical hierarchy, colored links and partial reveal. If your users are new to computers/touchscreen gestures/apps whatever, make sure there’s a help button to enlighten them about the conventions that they are might not be aware of.
What can go wrong: It’s not obvious how to activate the help screen. When it happens, it happens when you just get the app. When the overlay takes over the screen, it’s in your face, a lot of information all at once. It’s overwhelming. Once is not enough. Retention of the information is minimal. You haven’t explored the app yet, you’re not sure you even need help navigating the app. (More on this: Jared Spool, reknown User Interface Engineer http://vimeo.com/41509755)
Approach 2: New features that you must train the user to use. Firstly, any time you’re doing upgrades, you’re screwing your existing user base. The best thing you can do is to be the least annoying as possible. Or make sure that your feature is so useful that it outweighs the annoyance of a pop-up. In the future, we’ll have apps that will be smart enough to detect when the user isn’t getting the little tricks and gestures that you’ve designed into it and it will prod the user in a helpful way to interact with the app in the way it was designed.
When to use certain app walkthrough types, it’s about the context.. Example 1, if you have a public restroom app, it’s a matter of urgency. At that point, the user is not receptive to walkthrough screens.Example 2, Google Earth has an optional walkthrough where the finger placement is indicated and you’re in the experience when you’re working with the tutorial. It’s not just an animated video. Example 3, Cut the Rope game. Each level teaches new interactions. The introductory level is simple and helps the user practice, giving a sense of achievement at the end. Good reinforcement. Example 4, Apple. Apple has traditional pdf manuals for all of their devices. It’s a cost vs benefit situation. If a certain amount of people want a pdf and it’s not too difficult, give it to them. Don’t underestimate the simplicity of a pdf. You can email it to people and it doesn’t need any navigation.
Sometimes walkthroughs will be very literal. We’ll show the hands, the gestures, directions. Things like tap and hold and multifinger interaction is still new and strange and there aren’t any conventions for that.The future: As technology becomes more ubiquitous, the walkthrough experience will be tweaked with the changing times.