The Elements of User Experience, in detail
The Elements of User Experience is Jesse James Garrett's attempt to give the field of web design a shared vocabulary and a structural framework at a moment — 2002 — when web design was still being understood as a single discipline rather than several interrelated ones. The book is best known for the "Elements" diagram, a visual model that separates the work of creating a web product into five planes: Strategy, Scope, Structure, Skeleton, and Surface. The diagram appeared first as a free download in 2000 and was downloaded hundreds of thousands of times before the book that explained it was published.
Garrett's argument is that user experience problems usually trace back to decisions made at the wrong level of abstraction. Teams spend weeks debating the visual surface of a product — color, typography, imagery — while the structural and strategic decisions that actually determine user success remain unmade or implicit. The five planes model is designed to make those decisions visible and to enforce a sequence: surface decisions should emerge from skeleton decisions, which should emerge from structural ones, which should emerge from scope, which should emerge from strategy.
The strategy plane covers the purposes the product serves — for the business and for the user. The scope plane translates those purposes into specific features and content. Structure covers information architecture and interaction design: how the pieces relate and how users navigate between them. Skeleton covers interface design, navigation design, and information design: where things are on the page. Surface is the final visual layer.
The book is short, clearly written, and has aged better than most early UX texts. The framework predates the smartphone era and was designed primarily around websites, but Garrett's second edition (2011) updated it for mobile and application contexts. The core model remains in active use in design education and practice. Its weakness is that the planes can seem cleaner in the diagram than they are in actual project work, where strategy and surface decisions sometimes collapse into each other. But as a conceptual map for orienting a design team's discussions, it remains one of the most useful tools in the field's foundation documents.
The big ideas
- 1.
User experience can be divided into five planes — Strategy, Scope, Structure, Skeleton, Surface — and problems at higher planes cannot be solved by better decisions at lower ones.
- 2.
Strategy is the first plane because it asks the most fundamental questions: what does the product do, for whom, and why? Teams that skip strategy and go straight to features build the wrong things well.
- 3.
Information architecture — how content is organized and labeled — shapes user behavior as much as visual design does, and receives far less attention in most design processes.