Layout conventions to help speed up the design process.

Our design style is very editorially influenced. The following grids and scales form a framework for layout and creativity for a number of mediums & media sizes.

We use a variation of the Gerstner grid that has been optimized for the responsive web. It overlays 2, 3, 4, 5, 6, and 7 fluid column grids on top of each other and is spaced based on our baseline grid unit (aka the var(—line) variable). Our grid concept inspired by Joni Korpi’s Golden Grid System. The margins and columns are fluid while the gutters maintain a fixed width. This ensures consistent proportional spacing and alignment at all screen widths.

Basic grid units

Grid unit combo examples

Talk to us.

Learn more about our programs or talk to a trainer.