Supporting the First-time UX in Mobile Apps
The old axiom “You only get one chance to make a first impression” is as relevant to mobile software development as it is to a job interview or meeting the parents of your significant other. The app revolution has changed a lot about how we think about software design. One aspect – the first-time user experience – is still undergoing a lot of discussion. A recent article by Max Rudberg sparked follow-ups from Jeremy Olson and Sarah Perez. There were numerous comments on those blogs and on Hacker News.
The basic premise of these articles is that the use of walkthroughs indicates a less than optimal effort in designing the app. There may be some anecdotal evidence for that position. However, it is very difficult to make valid pronouncements on good vs. bad when you try to apply them to thousands of apps and millions of users. The individual nature of apps and their associated audience personas and use cases are likely going to vary quite a bit. It is easy to talk about designing for “mainstream” users, but I’m not sure anyone knows really know what that means in a general sense. We can certainly decide what mainstream means with respect to our own user base and define and test our designs against that definition.
Only after you have analyzed personas, use cases, feature priorities, and first-time scenarios, can you make a reasoned decision on whether or not you need to consider some form of introductory user assistance (UA). Assuming the answer is to do so, you now need to consider all the many UA design choices that may or may not be appropriate to meet your objectives. Finally, your careful implementation of the UA solution is what ultimately determines whether you have helped your users be successful in working with your app. User assistance in mobile apps is common and the designs are as different as the apps themselves. Apple has very well-crafted PDF manuals for the iPhone and iPad available for download. Not because a large percentage of people use them (or even know about them), but in recognition of the importance of a comprehensive support strategy.
Here are my “Fours C’s” for effective mobile user assistance:
- Contextual. The information should be presented in the UI at the point where it is needed. Users aren’t going to spend time clicking around to find an answer, especially with mobile.
- Conforms. It should conform to the look and feel of the overall application. Helpful information should flow in an app just like any other element. It shouldn’t be an afterthought or piece of baggage.
- Conditional. A first-time UA element should not appear after the first time unless the user requests it. This requires a discussion about when they should be triggered and not. You may want to have conditional items to deal with advanced features and upgrades.
- Concise. Not dumbed down. The perfect word, phrase, or image to fit the situation and the available screen real estate. This is not trivial. And it is testable. Word choices should be included in your usability studies.
The articles referenced earlier all seem to imply that the best apps are those that limit themselves to one or two basic features. To assume that apps need to be simple is just simplistic. While many successful apps use that approach, there are equally successful apps that are more robust. With faster processors, more memory, larger screen real estate, and higher resolutions, apps have a foundation that is fully capable of handling more complex activities.
For example, popular apps like Snapseed and Pro Camera provide iPhone users with a strong set of tools with which to manipulate images. Assuming their customers are interested in those tools, you now need to make a more nuanced decision about the value of adding some form of user assistance. Snapseed uses a walkthrough that is opt-in and available throughout the app. Pro Camera embeds Help text with the various advanced settings.
The Google Earth app for iOS and Android provides an optional interactive tour when you first launch the app. A message box appears asking if you want to take a short tour. Electing to take it displays an overlay with five sequential tips on how to use your fingers to manipulate the app. An instructional scenario like this provides the user with a quick, but helpful introduction to the product. It is possible the UI could have been made more intuitive. However, the approach that was used satisfies the first-time UX issues with a development structure that is relatively low-tech.
We, as designers, also have to realize our personal experiences are mostly from within a tech-savvy bubble. A large percentage of smartphone users have likely skipped working with laptops/desktops completely. The whole idea of interacting with data may be new to them. For example, take an older user who has a new phone but has never used a computer before. In this case, an iPad app like the Chicago Tribune has to not only explain the controls of the app but also introduce the customer to the concept of online versus print consumption of news. An overlay points out the key elements of the digital page.
The simplicity of an overlay makes it attractive as a user assistance solution. An overlay is literally a single layer of text and images that is fairly easy to create and code. The most popular format right now is to use a scribble-style of text and arrows against a semi-transparent background layer. This helps to clearly delineate between the instructions and the actual app. The downside of this approach is that the overlay needs to be enabled and disabled, taking you away from live control of the app. In any case, there is no need for the instructions on any overlay to be small. The point is to make the key elements very visible and easy to consume. Whenever you are talking about presenting instructional information, it always helps to delivered it in discrete pieces. Brief is better.
In Mark Rudberg’s article, he suggests the use of interactive hints as the user works with the app. This is definitely a great way to provide user assistance and should be given a lot of consideration. The solution he describes with Filibaba Meals is an elegant solution. Likewise for the accordion page effect in Languages described by Olson in his post. However, those approaches are much more resource-intensive than an overlay, which may be a consideration for many. It is also important to note that the effects used in Filibaba and Languages would be more difficult to implement and less palatable to users if there were multiple features/controls to support.
Most of the discussion surrounding first-time UX ignores the growing number of enterprise-specific apps. You can find apps for most of the Fortune 100 in the iTunes store through Search. Most of these apps are for employees only and it isn’t too much to ask them to learn how to use the apps effectively. Run ADP is an Android/iPhone app that gives payroll administrators many of the same capabilities that they have with the desktop application. The app provides introductory videos, a demo mode, and traditional Help. With million-dollar payrolls at stake, it makes sense to provide layers of user support.
Another issue is how literal the walkthrough images need to be. We are probably still at a point in time when people may need to see graphical representations of some gestures. This will change over time. In the late 1980s when the GUI and mouse first became popular, users had questions about how to use the new interaction type. By the early 90s, those questions more or less disappeared. In the near term, showing fingertips is probably as good as, or better, than showing an entire hand. In another year or two that probably won’t be necessary at all. Don’t forget, we now have not only touch interactions, but hand gestures, voice commands, and NFC. Do you have a strategy for introducing users to those?
The bottom line should be a mobile user experience that meets the needs of a variety of user types and use case scenarios. Thoughtful, appropriate, and well-designed user assistance is one of the elements we should use in achieving that goal.