To create a visual system with a consistent look, general principles have been created as a starting point to help you determine the sizing of margins, the colour bar and the logo across all collateral.
The colour bar should appear at the top of all layouts, while the logo should appear at the bottom, within the defined margins.
Sizing
The canvas should be divided into 24 across its longest side to determine “x” (the minimum size of the margin).
The thickness of the colour bar should be 3/4x.
The size of the logo is determined by the height of the shield. For the horizontal logo and faculty logos, it should be equal to 1. For the vertical logo, it should be equal to 1.25x.
Colour bar
Use the minimum size to ensure legibility in communication material.
| Application | Minimum size |
|---|---|
| Application Print | Minimum size 5.5 mililmeters (mm) or 20 pixels (px) high |
| Application Digital- desktop | Minimum size 18 px high |
| Application Digital - tablet landscape | Minimum size 16 px high |
| Application Digital - tablet portrait | Minimum size 14 px high |
| Application Digital - mobile | Minimum size 10 px high |
Logo
Sizing of the logo should be in proportion to the thickness of the colour bar to create a unified look across collateral. Ideally, if the logo is resized, the thickness of the colour bar should change in proportion and vice versa.
In scenarios where the colour bar may become too thick relative to the size of the logo, the logo can be scaled up independently of the bar, providing that it maintains a relative relationship to “x.”
Canvases
Click to view full image
Portrait canvas
A sample portrait canvas divided into 24 equal parts. Where 'x' equals the value of 1 part.
Landscape canvas
A sample landscape canvas divided into 24 equal parts. Where 'x' equals the value of 1 part.
Sample layouts - with bleed
Portrait layout with horizontal logo
A sample portrait layout, showing the colour bar using 3/4 of the height of 'x', a margin of 'x' on all sides, and the logo at a height of 'x' in the bottom right.
Portrait layout with vertical logo
A sample portrait layout showing the colour bar using 3/4 of the height of 'x', a margin of 'x' on all sides, and the logo at a height of 1.25 'x' in the bottom centre.
Sample layouts - without bleeds
Without a background image
Without a background image, lower the bar and maintain a 1X margin around the entire canvas. The margin should align to the left and right of the colour bar.
With a background image
With a background (image or colour), lower the bar and maintain a 1X margin around the entire canvas.
