Day 3: Grid Breaking
Understanding rules before breaking them for artistic rebellion
📚 Study (15 min)
Review Josef Müller-Brockmann's "Grid Systems" - then find 3 examples on Brutalist Websites that break these rules
✏️ Practice (15 min)
Sketch 5 radical layout ideas that intentionally violate traditional grids
🔍 Explore
brutalistwebsites.com collection
Breaking the Grid with Purpose
Understanding rules before breaking them is crucial for artistic rebellion. Müller-Brockmann's systematic approach creates order and clarity - exactly what experimental design often needs to challenge. Today you'll learn conventional grid wisdom, then deliberately violate it for expressive effect.
Browse brutalistwebsites.com and identify three sites that make you slightly uncomfortable with their layout choices. Maybe text overlaps images awkwardly, or content flows in unexpected directions. Ask yourself: what rules are they breaking, and how does it serve their message? Discomfort can be a design goal when it serves the content's emotional purpose.
Your sketching exercise should push boundaries fearlessly. Try diagonal grids, circular arrangements, or layouts that respond to content meaning rather than visual organization. Sketch a poetry website where lines of text curve like the verses they contain, or a portfolio where project titles grow and shrink based on their emotional intensity. Don't worry about usability today - focus on expression. Some of your wildest ideas will later become refined concepts when you understand implementation better.
Grid Breaking Analysis Framework
When studying brutalist websites, ask these questions:
- What grid rules are being broken? (alignment, consistency, spacing)
- How does the break serve the content? (emotion, message, brand)
- What feeling does the layout create? (tension, energy, chaos)
- Could traditional grids achieve the same effect?
Radical Layout Sketching Ideas
Try these approaches:
- Diagonal Grids: Content flows at 45° angles
- Circular Layouts: Information radiates from center points
- Organic Flow: Content follows natural, curved paths
- Overlapping Layers: Elements intentionally obscure each other
- Responsive to Meaning: Layout changes based on content emotion
- Broken Columns: Text flows unpredictably between containers
- Gravity-Defying: Elements appear to float or fall
Key Takeaways
- Understanding traditional grids helps you break them meaningfully
- Visual discomfort can be a valid design goal when it serves purpose
- Experimental layouts should enhance content meaning, not obscure it
- Some "bad" ideas become innovative when refined with intent