Chapter 6

Designing the iPhone UI

WHAT YOU WILL LEARN IN THIS CHAPTER:

  • Understanding the iPhone viewport
  • Exploring IOS design patterns
  • Designing for touch

More than anything else, the iPhone and iPad are known for their usability, intuitiveness, and overall positive user experience. The native IOS user interface (UI) is known by novices and geeks alike as being easy to use; no instruction manual needed.

An IOS web app doesn’t need to copy or perfectly emulate native IOS UI design and controls. In fact, some developers even argue that developers shouldn’t try to create IOS-focused web apps. Regardless of your position on that issue, there’s one thing you will want to do when you create an IOS web app — create a usable and navigable UI.

That’s why, in this chapter, you explore many of the common design patterns that Apple uses in its UI as well as the key design patterns used to present data in a mobile device. In this chapter, I focus primarily on iPhone; in Chapter 7, I focus on iPad.

EVOLVING UI DESIGN

User interface design has been evolutionary rather than revolutionary over the past decade. Most would argue that Mac OS X Lion and Windows 7 both have much more refined UIs than their predecessors. As true as that may be, their changes improve upon existing ideas rather than offer groundbreaking new ways of interacting with the computer. Web design is no different. All of the innovations that have transpired — such as HTML5 and Ajax — have revolutionized the structure and composition ...

Get Beginning iOS Application Development with HTML and JavaScript® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.