UI designers have the coolest jobs right now, and it's all because of touchscreens. At least that's what Josh Clark said during his SXSW talk, "Teaching Touch: Tapworthy Touchscreen Design." Josh
consults and writes about touchscreen design (and blogs, of course), so he's given the subject a lot of thought and approaches it like the teacher you always wished you had. At the 30,000-foot level his premise is simple: The rules of interface design are undergoing the most fundamental change they've seen in 30 years. Since the Mac popularized the GUI in 1984, users have come to depend on icons and pointers. At ground level, the challenge designers face is simplifying the way people get to information, so that it's more natural, more intuitive, and more in-line with how they actually think and act. So, when you're creating a design you have to consider the way people learn, as well as how they interact with recognized objects. An often-used example is a calendar. The natural way for someone to page forward is to swipe from right to left. They barely need a cue. A less intuitive way would be to place an arrow on the bottom of the screen. That doesn't fit in with their context of a printed calendar. Think that's the kind of mistake you'll never make? You're better than Apple's design team then. In an early version of its iOS calendar, you had to use--wait for it--an arrow to move forward. Now, you swipe. Josh's presentation (which played to a crowd of several hundred) boiled down to these core lessons:
- Gestures are the keyboard equivalent of shortcuts. Allow people to learn their way around in basic, even clunky ways. After their tenth session, interrupt them with a brief (and easily dismissed) cue that leads them right to their destination.
- In mobile UIs, clarity trumps density. Think about an app designed to take dictation. Should the initial screen present the image of a microphone, an audio levels display, maybe a mixer? Or, how about nothing but a button that says "Record?"
- Don't force people to go through some kind of tutorial, even a simple graphical reference, up front. If you do, you'll end up with something like this.
- Metaphors work when they match the user's experience in the real world. That's why pinching works for shrinking an image, and why that metaphor breaks if you require two taps instead.
- Play video games. In good ones, you'll do a lot of learning along the way, with information presented in the moment.
This is all just scratching the surface. If you want to learn more, check out
#sxtapworthy on Twitter, Josh's website at
www.globalmoxie.com, or his twitter feed
@globalmoxie. Photo:
Senseg
