Safari® and WebKit Development for iPhone® OS 3.0

Chapter 6. Programming the Interface

The previous two chapters surveyed the UI standards and guidelines that you need to keep in mind as you design a Web application that works well on iPhone as well as iPod touch. With these design principles in hand, you are ready to apply them as you develop and program your Web app.

To demonstrate how to implement an iPhone interface, I will walk you through a case study application I am calling iRealtor. The concept of iRealtor is to provide a mobile house-hunter application for potential buyers. The current pattern for Internet-based house hunting is to search MLS listings online, print individual listing addresses, get directions, and then travel to these houses. However, with iRealtor, you can do all those tasks on the road with an iPhone-based application. The design goals of iRealtor are to provide a way for users to do the following:

• Browse and search the MLS listings of a local realtor.

• Get a map of an individual listing directly from its listing page.

• Access information about the realtor and easily contact the realtor using iPhone phone or mail services.

• Browse other helpful tools and tips.

As you look at these overall objectives, an edge-to-edge navigation design looks like an obvious choice given the task-based nature of the application. The realtor information will be relatively static, but the MLS listings need to be database-driven. Therefore, you will take advantage of Ajax to seamlessly integrate listing data into the application. ...