Study · Structure & Interaction · framework
Garrett's five planes
Every product decision sits on one of five planes, abstract to concrete. Lower planes constrain the ones above.
Built with Claude + NotebookLM · Updated · 3 min read
In short
Five planes, from abstract to concrete: strategy, scope, structure, skeleton, surface. A decision on a lower plane constrains every plane above it. When a screen keeps getting redesigned and nobody is happier, the trouble is almost never on the surface — it is a question lower down that no one has answered.
When to use
- A screen is on its third redesign and the complaints have not changed.
- A review turns into opinions about color.
- You need to tell a stakeholder where their request belongs — and who answers it.
How
In February 2018 Snapchat shipped a redesign, and more than a million people signed a petition to undo it. The complaints sounded like surface — "it looks wrong" — but the surface had barely moved. What had changed was underneath: friends' Stories and messages were merged into one feed. People were reacting to structure · cấu trúc with the only vocabulary they had.
Jesse James Garrett's five planes · năm tầng của Garrett give you that vocabulary. Each plane answers one question:
- Strategy — why does this exist, and for whom?
- Scope — what does it include?
- Structure — how does it behave; what leads where?
- Skeleton — where does each thing sit?
- Surface — what does it look like?
Two rules of use. First, name the plane for every open question before you argue about it. Second, when something is unsettled, work downward: a surface argument you cannot win is usually a structure or scope question nobody has answered. Settle that plane, then polish the one above.
Concrete — what the person sees
- 05SurfaceWhat does it look like?
- 04SkeletonWhere does each thing sit?
- 03StructureHow does it behave? What leads where?
- 02ScopeWhat does it include?
- 01StrategyWhy does it exist, and for whom?
Abstract — why it exists
Each plane constrains the ones above it.
Example
A stove with four burners and four knobs in a row. The knobs look fine — surface. What makes you turn the wrong one is the mapping · ánh xạ between a row of knobs and a square of burners — structure. Repainting the knobs will not help; moving them into a square will. Don Norman has used this stove for forty years because it shows the planes in one object you can touch.
Traps
- Treating the planes as phases with sign-off. They are lenses, not gates. You revisit scope when structure teaches you something.
- Starting at the surface because it is the only plane stakeholders can see. Put a flow or a wireframe on the table; the conversation moves down a plane on its own.
- Using the model to end a debate. "That's a strategy question" is only useful with a second half: who answers it, and by when.
Try this
Take the last design comment you received. Write down which plane it is on. If it is surface, write the structure question underneath it.
Map
Rule
- A lower plane constrains every plane above it
- A surface argument you cannot win is a lower question
Try
- Write which plane your last comment was on
The planes
- Strategy: why, and for whom
- Scope: what it includes
- Structure: how it behaves
- Skeleton: where things sit
- Surface: what it looks like
Traps
- Planes as phases with sign-off
- Starting at the surface
- Naming the plane without naming who answers
Sources
- 01The Elements of User Experience (opens in a new tab) — Jesse James Garrett, 2000; 2nd ed. 2011
- 02The Design of Everyday Things (opens in a new tab) — Don Norman, Revised ed. 2013
- 03Snapchat responds to the 1.2 million users who signed a petition to kill the redesign (opens in a new tab) — BGR, 2018
Related
- Shift work to the system
Every step the system takes is one the person doesn't. Count the steps, then move them.
- Find the right problem
Most bad designs solve the wrong problem well. Ask why until you reach a cause you can change.
Next note