With apologies to Isaac Newton, let's call this The First Law of Gesture: for every swipe and tap, there is an equal and opposite reaction. Gestures should be greeted by immediate feedback that not only confirms your input but also sustains the illusion that you're manipulating honest-to-god objects suspended below the iPhone's glass face. The best iPhone apps, including the overall iPhone OS, recreate an environment of real-world physics, complete with momentum, elasticity, friction, and follow through. Things bounce and stretch and spin and squish in response to your touch. The more realistic the response, the more complete the sensation of controlling a tangible interface.
Happily, iPhone developers rarely have to fret over the complex details of Apple's phone physics; the operating system gives it to you for free with the code that manages list scrolling, animations, and the screen's rubber-band elasticity. The same goes for toolbar buttons, which highlight in response to your touch, and other standard controls, which slide and spin without any special coding effort. When you create your own custom controls and gestures, however, you need to bring the same attention to detail to those new creations. A visual response should accompany every touch, reassuring people that their gesture had the intended effect.
Savvy, restrained use of animations is especially useful for linking touch to changes in the app. In the Things to-do list app, for example, tapping the toolbar's star icon switches from checklist mode to a view that lets you mark items you want to tackle today. To underscore the change, the arrow-shaped disclosure buttons on the right side slide offscreen, and the checkboxes dissolve into star-shaped controls. The app could have just made those visual changes instantly with no animation, but the fluid motion draws attention to the change and gives the impression of a kind of mechanical shift that lends extra weight to the tap.
Figure 8-13. In Things, tapping the toolbar's star icon triggers a subtle animation. The disclosure arrows (left) slide off the screen, and the checkboxes dissolve into stars (right) to transform the function of the screen.
The Twitter app adds similar grace-note animations throughout. When you swipe left to right across a tweet, for example, you hurl the message offscreen, and the icon buttons that appear underneath bulge briefly, as if affected by the motion like leaves behind a passing car. Again, this animation lends a mechanical effect to the gesture and adds a sense of visual solidity to the interface and your interaction with it.
Twitter further underscores the animation's mechanical illusion with a heavy tock sound. Sound is a powerful form of gestural feedback, too, another reassuring confirmation that the app has registered a touch or completed an action. Many find that the click-click-click of the iPhone's keyboard affords a reassuring sense of solidity for its virtual keys, offering the no-look confidence of a button being pushed in the real world. With sound, as with most aspects of interface design, a light touch goes a long way. You're not building a pinball machine; no need to make it bleep and click at every touch. Choose your sound effects carefully and apply them judiciously to your app's most significant gestures and events. As you choose the events for sound, your effects should have a symmetry: if you add a sound effect to open an onscreen panel, for example, be sure you add a corresponding sound to close it. Just remember that a sound effect shouldn't be the only feedback to a gesture or action; anticipate moments when the sound might be off or when the app is used by the hearing disabled. Consider offering options in your app's settings to disable sound effects, too. Some people (and cultures) prefer to be more discreet in public settings—or simply don't share the same taste for audio clatter.
Every touch should have visual feedback, too. But what if you can't see the thing you're touching? When fat fingers obscure the tap target, consider outsized feedback that ripples into the screen around the touch. The standard keyboard is a classic example, popping up a magnified version of the pressed key with every tap. Providing tap feedback near or around the target area is a useful technique in other contexts, too. Brushes, a painting app, lets you switch colors by tapping another color on your screen; to help you see what color you're touching, the app draws a circle in that color around your finger. The Saturday Night Fever Dance game similarly rings your finger in a circle to help you trace lines accurately while you do the hustle. Reliable onscreen feedback gives users confidence—just as surely as a crisp white leisure suit on the dance floor.
Figure 8-14. From left to right, the keyboard, Brushes, and Saturday Night Fever Dance apps all provide outsized visual feedback to help track your finger location. The keyboard springs up the letter you press, while Brushes and Saturday Night Fever Dance ring your fingertip to help you pinpoint its location.