Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

aestheticsSkills

Layout Must Be a Choice, Not the Default

SHOULD

SHOULD: Break predictable symmetric grids with asymmetry, overlap, negative margins, and varied scale. Feature one dominant element at unexpected scale. Use whitespace asymmetrically to create tension.

Test the layout against the brief — if it is the grid you would produce for any similar page, revise it

Bad

Good

Why it matters

The symmetric three-column grid is the layout every generator arrives at, for every brief, which is exactly the test upstream proposes: run a similar prompt and see whether you land in the same place. If you do, the layout was not chosen, it was defaulted into. Asymmetry, overlap, varied scale, and diagonal flow are the usual escapes — but they are means, not the point. The point is that the composition should be traceable to something true about this subject.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.