Order, alignment and proportion, to designers of all stripes, are like pen and paper. Critical tools we use again and again to create beautifully designed systems.

Foundational texts like, Grid Systems in Graphic Design by Josef Muller-Brockmann, is a print reference first published in 1961.  But the grid method is so sound and elemental that it has a home in modern application and software design. And Metro style is a pure manifestation of Josef’s lasting principles.

My copy of Grid Systems, sun bleached spine and all, is displayed prominently in my office as a visual reminder to honor the grid. Honor. Not obey. Why not, you ask? Because slavish devotion is narrowing and dogmatic and good design can’t be so single-minded.

Now, let me knock this down a peg. As this high-minded, postulation gets designers (and design as a discipline) in trouble. So I’ll be concrete.

I’ve been working on Windows 8 apps for nearly 9 months. Live, sleep, eat Metro style. To help folks get started with such a large shift in application design the Windows team made some amazing Photoshop templates. They’re an essential tool and perfectly lay out the grid system that the entire OS depends on. A great example is the Metro silhouette (I know, Metro, Metro, Metro). Without it, switching between apps would feel unorganized and disconnected. Designing with the grid creates unity, structure and user trust in a way that only great visual systems can.



But. Within every design system there’s spacious room to creatively push boundaries. And you should.
Each application, with its unique features, brand focus and user scenarios means a fresh, objective analysis generates the best results. Take the Loku design created by the ass-kicking design studio, thirteen23, for example. They’ve respected the grid but pushed hard to ensure that the social/local heart of the product was front and center. As you explore categories, the map is ‘always on’ and interactive so users can toggle interests via location simultaneously. Loku for Windows 8 is a stunningly innovative lesson in moving beyond the grid while honoring the system.

I’ve been doing a bunch of tablet prototyping lately so I thought I’d share with you! Feel free to print, share and use as you wish. Happy creating and look for more prototyping downloads coming soon.

Grab the pdf prototype template here.