4. The Wireframes

In the grand hierarchy of pictures of imaginary software, wireframes exist somewhere between sketches and mockups. Their purpose is to nail down the details that sketches leave out: what exactly exists on each screen and how it all fits together—the geography of an app. A sketch is casual and usually disposable; you might attach a sketch to a design document as a reminder of the conversation that led to a decision, but the sketch probably doesn’t represent a definitive understanding of how the software should end up. Wireframes, on the other hand, document some details of how the app should be built. (See Figure 4.1 for an illustration of the difference.)

Figure 4.1 A sketch (left) becomes a wireframe, gaining detail about ...

Get Learning iOS Design: A Hands-On Guide for Programmers and Designers 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.