Overview
Illustrations help convey the human and trust elements of our new branding.
They can represent an action, product feature or idea in an immediately impactful way.
Illustration1
Illustration 2
Illustration 3
Illustration 4
Design
To mirror our logo, our illustrations use rounded corners, geometric shapes, circle-to-capsule construction and stencil joints.
They are bold, flat and graphic with a degree of exaggerated whimsy.
You can find illustrations here though please read the ‘Best practice’ section before using one.
Best practice
Composition
Hero illustrations convey relevant themes using abstract scenes featuring characters interacting with the world around them.
Brilliant green elements should represent the key activators or catalysts in the visual story.
Size
Character illustrations roughly fit into a 900 x 600 pixel area for hero banners but can also be scaled down as spot illustrations for content panels.
They should not be any smaller than 400 x 400 pixels.
If a smaller visual is needed, opt for a spot icon.
Color
Hero illustrations use a strict reductive palette focused on brilliant green, white, and grayscale values. Touches of the extended palette below can be used, but very selectively.
Always set the hero illustration on a black stage so that the brilliant green can stand out.
When to use illustrations
Only use illustrations where they have tangible purpose and goal.
Key moments and situations can be brought to life with an illustration, such as:
To congratulate and celebrate with your user - for example, exceptional success states.
To prevent confusion or frustration - for example, exceptional error states.
When a feature is being bypassed, misused, or underused - for example, getting started or empty state experiences.
Illustrations should positively impact user behaviour. Don’t use illustrations to 'fill space' or simply to add dynamism to a page. All illustrations must have an intended purpose and represent an idea, so don’t use generic or recycled illustrations intended for other contexts.