Layout
System

Our layout system brings everything together. Expressing the brand in a consistent and impactful way.

Overview

We use two types of layouts in our graphic system;

Modular is used for communications that display both our products and art direction.

Layered should be used for editorial applications.

Modular Layered

Grid

All of our layouts use the same method to create our modular grid system. This method will work with any size of format, it’s important to follow this system so that our modular system looks as consistent as possible.

Modular

Our modular system allows for various different types of layouts.
The square grid system we have created is to determine where each module sits.

Our layouts can be made out of up to 4 of these modules, these modules can hold typography, imagery and our icons. The size of the modules is not restricted but they should work harmoniously with one another.

Grid With image

Layered

Our layered layout works in the same way as our modular system. However, in this system we can lower imagery over our Hero copy. This system works best for editorial purposes.

Grid With image

Type

For the placement of our headline, sub-heading and logo we use a margin. Our margin (X) should be 1/20 of the short edge. The Hero copy must always be left aligned with the Headline or Sub Heading aligned to it.
The Sub Heading should be 50% of the size of our Hero copy.

When creating banners our margin (X) should be 1/10 of the short edge.