Chapter 9

Programming the Interface


  • Using iUI to program and style your IOS web app
  • Developing a web app that closely resembles native IOS apps
  • Discovering how CSS and JavaScript can work together

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

In order to demonstrate how to implement an IOS interface, I 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 out individual listing addresses, get directions, and then travel to these houses. However, with iRealtor, all of those tasks can be done on the road with an IOS-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 IOS phone or mail services
  • Browse other helpful tools and tips

Because the target user for this app uses an iPhone, most design decisions need to target the smaller iPhone UI. However, because some users may use an iPad, I want to ...

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

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.