Article
Three Passes for a Healthy Design System
Build the system in layers so the visual language stays coherent as the site grows.
Most design systems go wrong in one of two ways: they either stay too vague to guide real work, or they become so over-specified that every small change feels bureaucratic.
-
Pass one: establish the primitives
This is where the site learns what it is made of.
-
Pass two: shape the recurring compositions
Now the system learns how content tends to be arranged.
-
Pass three: refine emotional tone
This is where the system stops feeling generic and starts feeling like a place.
Pros
- Design drift becomes easier to spot.
- Components inherit a shared language naturally.
- Redesigns become token edits more often than markup rewrites.
Cons
- It takes discipline to avoid one-off exceptions.
- A rushed build can still skip the refinement pass.
The practical rule
If a visual decision appears three times, it probably wants to become part of the system.