Reverence the Grid
Structure provides rhythm; chaos alone is weak.
A disciplined grid organizes complexity, creates balance, and guides the eye. Without structure, even brilliant ideas appear chaotic and lose their impact.
The New York Times' editorial layout is structured around a strict grid, allowing complex content to be readable and visually coherent across print and digital.
- 01Establish a consistent grid for layouts.
- 02Align elements consciously—disorder erodes trust.
- 03Use grids to experiment within boundaries, not to constrain creativity.
When to Apply
- After every version of anything you create
- When something isn't working but you're not sure why
- When you've received feedback
- When conditions change
- Always—iteration is a continuous practice
When NOT to Apply
- When iteration becomes procrastination
- When you're iterating on the wrong thing
- When the cost of iteration exceeds the benefit
- When you need to commit and ship
Assessment Criteria — Where Are You?
You understand that first drafts are rarely final. You're willing to revise your work.
Self-assess honestly — growth requires knowing where you are
The grid is the invisible skeleton of professional design. It creates consistency across pages and screens, establishes rhythm that guides the eye, and provides structure that makes complex information accessible. Designers who work without grids produce work that feels amateur.
- 01Swiss International Style: The grid elevated to philosophy—Müller-Brockmann's systematic approach.
- 02The Guardian's redesign: A flexible grid that works across all devices and content types.
- 03Material Design's 8dp grid: Google's systematic approach to spacing and layout.
- 01Establish a baseline grid before any design work—4px, 8px, or other consistent unit.
- 02Create columns and gutters appropriate to your content and medium.
- 03Align all elements to the grid, even if they span multiple columns.
- 04Use the grid to create variation through deliberate breaks, not random placement.
- 05Document your grid system for consistent application across projects.
Figma Layout Grids
Built-in grid tools for consistent design
Bootstrap Grid System
Responsive web grid framework
Gridlover
Typography-based grid calculator
8pt Grid System
Comprehensive spacing methodology
- →"Grid Systems in Graphic Design" by Josef Müller-Brockmann — The definitive text
- →"Making and Breaking the Grid" by Timothy Samara — Modern grid approaches
- →"Ordering Disorder" by Khoi Vinh — Grid systems for the web
Reflection Prompts
"What would version 10 of this look like?"
We often stop at version 2 or 3. Imagining version 10 reveals how much growth is possible.
"What am I learning from each iteration?"
Iteration without learning is just repetition. Each cycle should teach something.
"Where am I iterating on the wrong thing?"
Perfectionism on unimportant details is a form of avoidance. Iterate on what matters.
Practice Exercises
Create 10 versions of something in one hour. Don't evaluate until you're done. Which version surprises you?
Power Combinations
Synergies — Laws That Amplify This One
Prerequisites — Understand These First
Personalized Analysis
Sign in to get AI-powered insights on applying this law to your life.
Sign In to Continue