UX for Lean Startups

Chapter 8. Diagrams, Sketches, Wireframes, and Prototypes

In this chapter:

• Learn the difference between a wireframe, a sketch, and an interactive prototype.

• Understand when you can save time by skipping higher fidelity design deliverables.

• See the drawbacks of paper prototyping.

Up to now, I’ve talked rather vaguely about “design,” but UX design isn’t synonymous with creating big, pixel-perfect Photoshop files. In fact, in many ways, starting a design in Photoshop is the opposite of Lean.

As we’ve already explored, starting a design means starting with a hypothesis and designing tests to validate or invalidate that hypothesis. The Photoshop mockup of a final screen is a very tiny part of the entire user experience, and in many cases it should be skipped entirely. The UX is what the user is going to do and how she is going to do it, as well as what the product is going to look like.

But, still, we need to create something. It can’t all be scribbles on whiteboards and enthusiastic hand waving.

At some point, we need to create designs. For the purpose of this chapter, a “design” is going to be represented by some artifact that fulfills one of several very different types of functions.

These artifacts might be one of the following:

• A diagram

• A sketch

• A set of wireframes

• An interactive prototype

• A visual design

They are all at very different levels of fidelity, and they’re all used for very different functions in design.

The most important thing to remember is that, to create a good design, you don’t ...