design-reviewlisted
Install: claude install-skill Univers42/claude-deal-with-the-devil
# Design review
"It looks off" is a real observation with a findable cause. The cause is almost always
one of five things, and none of them is taste. Find which, name it, and give the
smallest change that fixes it.
Pairs with `frontend` (how to build it) and `browser-testing` (see it running before
judging it).
## 1. Hierarchy — can you find the one thing?
Squint at it, or blur it. The most important element should still be the most
prominent. If three things compete, the user reads none of them.
- **One primary action per view.** Two primary buttons means neither is.
- Emphasis comes from **size, weight and space** before colour. Colour is the weakest
signal and the one people reach for first.
- De-emphasise the secondary rather than shouting the primary. Most "make it pop" is
really "quiet everything else".
- Reading order should match importance. In a form, the label is not the hero.
## 2. Rhythm — is the spacing saying anything?
Spacing communicates grouping. Wrong spacing is the most common cause of "off".
- **Related things are closer than unrelated things.** A label 16px from its input and
8px from the *next* input is actively lying about the structure.
- One spacing scale, used consistently. Values off the scale (13px, 27px) read as
sloppy even when nobody can say why.
- **Alignment: pick an edge and hold it.** Mixed left/centre within a block is the
single most visible amateur tell.
- Consistent gutters; consistent vertical rhythm between sections.