The most important or frequently used info should float to the top of the screen above the app's primary buttons and controls. This meets our expectations not only of graphic design—headlines at the top—but also the way we hoist and handle just about any physical device. The screen bottom is the most comfortable thumb zone for a handheld gadget, but that's also where the screen is most likely to be obscured by hovering hands. To keep info in clear view, position it above your app's controls. This is a familiar, common-sense layout that applies to most physical devices—iPods, calculators, cell phones, bathroom scales, you name it. Here again, though, it's the opposite of what we'd expect from Web and desktop software where toolbars and menus stake out the top of document windows with primary content below.
Figure 3-18. Tapworthy apps follow an interface convention familiar with all kinds of mechanical devices. Even when they don't directly mimic real-world gadgets, they organize controls at the bottom and content on top. From left, Cleartune, Weightbot, and iPod.
For primary app navigation, Apple helps you do the right thing by cautioning designers to place tab bars and toolbars at screen bottom (see Tab Bar: What's on the Menu? and The Toolbar). Likewise, when you summon a keyboard by tapping a standard text field, the built-in keyboard automatically slides in at screen bottom, nudging the typed results to the top of the screen. Follow Apple's lead here: everywhere it makes sense, let the primary controls sink to the bottom and main content float to the top.
This guideline is easy to follow when content and controls are separate, but not all iPhone apps make such a ready distinction. In many apps, the primary display info doubles as a view's main controls. That's especially true for list content; whether you're scrolling through contacts, to-dos, songs, or email, you tap list items to see their detail views. In those cases—as well as examples like Home-screen icons or photo album thumbnails—the entire display turns content into tap target from top to bottom. This double duty encourages you to directly tap anything you want to know about, a natural interaction and a good design. Even in these cases, though, it's a good practice to place the most frequent tap targets at the bottom, as discussed earlier.
Figure 3-19. In Gowalla's Passport view (left) every display element doubles as a touch control, but the Check In and New Spot buttons anchor the screen as the most frequent tap targets. Similarly, while the stats at the top of RunKeeper Pro (right) are tappable, the main Stop and Pause buttons remain at bottom, leaving the stats display prominently visible at all times.