Close

So, how can we help you?

Tell us a little about you and your project and we will get back to you quickly.

Send
Are UI walkthroughs evil?

December 27th, 2012 Jeremy Jeremy

Screen Shot 2012-12-27 at 1.44.14 PM

Max Rudberg on gesture-based apps like Clear, Rise, and Solar:

“These apps have chosen to reduce details to achieve a minimal UI, but in the process the UI has also become harder to use. Unfortunately a UI walkthrough is quite an inelegant way to explain the core functionality of an app. It can be a frustrating obstacle before you can dive into an app, and you have to remember all of those new ways of using it once you get in.”

First off, I think Clear’s UI is awesome once you get used to it. Though it frustrates some people, I think the UI is fairly intuitive and I use it all the time. I think I’ve gotten used to Rise, though I admit that trying to use the app for the first time was a little rough.

But Max’s main argument is that apps should not rely on UI Walkthroughs to teach users about how their mystery meat app works. Instead, the app itself should provide the visual affordances needed to understand how it functions.

I tend to agree. UI Walkthroughs have several problems:

  • No context. The user barely knows what the app does and yet they are bombarded with instructions to swipe hither and thither to do this and that. Because there is no context, the gestures themselves seem much more complicated than they actually are and folks are easily overwhelmed.
  • Memory management. While users may, by some miracle, remember all the gestures you described in the walkthrough, think about users who come back to your app after a month of non-usage. Unless your gestures are extremely intuitive, mapping to real world metaphors (like iBooks page swiping), your app may be a complete mystery to them. That’s not good.
  • Impatience. Impulse downloaders want to cut to the chase. They want to evaluate your app in a few seconds to see if it is worth their while. We learned from Steve Krug that users don’t analyze websites, they muddle through. The same applies to apps. Many users will skip the tutorial because they don’t want to learn about the app, they just want to try it.
  • Confusion. If not done properly, users will often mistake the walkthrough screenshots as the actual app and will try to tap them, getting frustrated when nothing responds. I learned this the hard way by doing usability testing on an app I worked on. Almost every user tried to interact with the walkthrough screenshots (and I thought I had already taken adequate precautions against that).

The bottom line? We can’t rely on walkthroughs to teach mainstream users our minimal UI’s.

Alternatives

31103053647454120_hJQkfoix_b
Another popular approach is to fill the screen with coach marks the first time users come to a screen. Not a fan. You might say that this provides more context but I think it’s overwhelming and only provides superficial context.

I think the best context to teach the user a gesture is when they actually want to take the action or right after they have performed the action by a different means. I also think that in most cases important actions should always have some level of affordance.

Search-Fold
We played with gestures a lot when developing Languages. Going for that minimal, gesture-based approach definitely helped us get rid of unnecessary UI baggage but at the end of the day we decided that functions like search were so important that we needed a button (in this case a search field) to make the function obvious. We then used a folding animation and other cues to let the user know they can also conveniently swipe the entire screen to switch between searching and browsing.

Exceptions

31103053648367256_syDd8d0c_c
Finally, though walkthroughs have their disadvantages, they aren’t evil. In fact, they make a lot of sense in some cases. For example, This walkthrough in Evernote helps users understand Evernote’s basic value proposition — how it can be used day to day. If done well, this can be very useful and powerful because a lot of folks download apps on impulse, with little idea about what the app actually does. A fun walkthrough can remedy that.

UPDATE: I think we need to be fair to apps like Clear and Rise that use a walkthrough to help teach users gestures. There are definitely drawbacks to walkthroughs but these apps have a certain minimalist style that makes in-context hints and “progressive disclosure” very difficult. It’s hard to have these cues without changing the nature of the app. I’m not saying it’s impossible and I think it is very much worth exploring but these apps have made the conscious decision of sacrificing a little discoverability in return for minimalism and a sense of exploration. The designers of these apps are super smart and forward thinking so I would love to hear their own thoughts on the subject.

I don’t think it’s a good idea to say a particular UI practice is evil altogether. Each app has different goals and different users and, speaking of context, we should always be open to trying different things depending on the app. I think we all have a lot to discover in this area of “teaching UI” so keep your options open, experiment, do usability testing, and tell us what you learn! I’m all ears.

clicking on ".more" toggles class "visible" on "#popover" clicking on ".page" removes class "visible" on "#popover"