Blog

Designing Interactions for Tablet Apps

June 20th, 2011

Mobile, UX Design

What’s the Context?

Tablets aren’t huge smartphones (and they aren’t quite “flat PCs”, no matter what Steve Ballmer says). One of the biggest set of differences between designing for tablets and designing for phones is the context: the how, when and why. Unlike the tablet, the phone is much more likely to be used on the go. Sure, you keep your phone by your bed, check Facebook or your email, maybe hit a website or two before you hit the sack, but users are much more likely to use their tablets for longer periods of time. This prolonged interaction on tablets is more involved, with users sitting down and focusing on what they are doing. A tablet is actually more like a portable gaming device than a mobile phone.

When thinking about the context, try to answer the following questions:

• How will the user interact with your app? Seated on their lap, held with both hands, or in a cradle or tablet stand?
• How long will the average interaction be? Seconds, minutes… hours?
• Is the ideal way of interacting with the app horizontal or vertical? Sometimes a specific orientation will be ideal for the user.  How will you coax the user into using it the way you want them to without restricting the orientation and limiting the user experience?
• When will the user be interacting with your app? In the morning as they drink their coffee? At night, lying in bed? How will the time of day or environment they are using the tablet in affect their interaction?
• Why will people want your app? Will the app deliver content optimized for the tablet? Will the content be something they want to interact with on their tablet?

Determining the context of a tablet app is where you start asking the difficult questions about the actual need for the app. Even apps need a content strategy and you will need to make sure that what the client wants will also be something that the user wants.

Simple & Focused

Creating an app that can be used anywhere, for anything, and by anyone is not easy. Thanks to phone apps and portable game players, users expect focused task-oriented apps that don’t waste their time. After opening the application, users jump right into the action and they want that app to specialize in that one general action. This focused and simple interaction isn’t just expected: Apple’s iOS Human Interaction Guide specifically states that interactions be focused to simple or single behaviors. Most of us with some experience in publishing apps know Apple isn’t militant with its guidelines and will approve apps that don’t strictly follow their interaction guide, but their guide has excellent recommendations for user-friendly interactions to follow for both iPads, Android and other tablets and mobile devices.

While it’s tempting to use up all the given space, try to resist filling the screen with “cool” interactions. I recommend including only screen elements that have an immediate tie to the action or set of activities the user is trying to perform. I think the most simple apps are the best. Check out iA Writer, a typewriting app for the iPad. When you are working, everything but the line you are typing and the 5 or so previous lines are displayed. They also add a few buttons to the keyboard and a simple typing sound. That’s it. Streamlined, focused and easy to use. It’s a wonderful app with a simplicity that can be modeled in many others.

(Obscene) Gestures

Go ahead – it’s okay – use your middle finger. Use both of them – um, on your tablet, please – along with all other available digits. Gestures are a major distinguishing feature between phones and tablets. Alright, yes, smartphones have the pinch-in/-out zoom feature as well as a few other multi-touch interactions, but apps like Tumult and Uzu let you use up to all of the iPad’s 11 (yes, Nigel, it goes to 11) touchpoints. Tumult even has a shake feature, utilizing the gyroscopics in the iPad. I’m not sure why the iPad goes to 11, as that’s one more touch than you have fingers (ahem – behave yourselves, boys and girls), but it can handle it. And, as of Android 2.3 (aka Gingerbread), Android tablets can theoretically handle any number of touchpoints with a feature called JazzHands, depending on the hardware. Currently, Asus Eee Pad Transformer, the Acer Iconia Tab and the Motorola Xoom allow for 10 touchpoints. (HUGE thanks to Suzanne and the folks at Android Patterns for the Android tablet touchpoint information. Check out their excellent Android Pattern library.)

The key is knowing when to use multi-touch (and lesser-known) interactions. They’re still new enough that users don’t yet intuitively use them, beyond the pinch, touch and swipe gestures. Apple has a relative standard of when and how to use them in their iOS Human Interface Guide, and Luke Wroblewski’s blog has a great touch gesture reference guide that Luke put together with Craig Villamor and Dan Willis.

I recommend sticking to the basics with the gestures unless you have a good reason to create your own; customized gestures will require custom coding and will have all the added production hassles that entails. Give the user a hint if the interaction isn’t intuitive, or give them another way to interact with the app and have them discover the less-intuitive gesture interaction. Part of the fun of some tablet apps is in discovering those gesture interactions.

Fat Fingers

As frequent users of tablets know, small buttons are frustrating. You constantly tap the screen, turn your finger to find the active area, and if it’s close to other buttons, you could hit another button altogether.  Small buttons that have a narrow area of activation are just frustrating.  It’s a widely accepted fact that larger buttons, regardless of the device or interface, are easier to find and interact with.

Make the buttons look like buttons, put them in places that they can reach with thumbs while being held (remember the context), and make them large enough for thumb-sized selection. Keep those buttons in the same place whenever possible, too, despite the orientation.  If the use turns from landscape to portrait view and the buttons are centered on the left side, keep them there.

Helping Hands

I was watching a friend use a drawing app on the iPad the other day (perhaps struggling to use a drawing app is a better way to put it). The tools and color palettes were perfectly placed for a right-handed person like myself, yet all the tools were easily accessed to the left of where I was drawing. My southpaw friend, however, had to lift his hand up from the drawing surface, locate the appropriate tool or color, select the tool or color, find where he was drawing, then go back to what he was doing. Not very convenient.

Even if your app doesn’t have a writing or drawing interaction, it’s important to keep the user’s handedness in mind. Most users are right-handed, but providing the option to change the controls to accommodate left-handed people might be worth the time, especially if the app requires the user to access controls while directly interacting with the screen.

Supporting Your App

And finally, don’t forget about supporting your app. Yes, app support is usually the domain of the developers. However, there are things that user experience and interaction designers need to track. It is our job to keep an eye on comments and reviews for the app, conduct user surveys, and do further usability testing, if necessary. And because most apps come out of the gate discussing the user experience, it’s also our job to remind product owners about the importance of app support (both technical and UX) from the beginning of the project to the very end.