Official Websites
Brand Guidelines
2022
Brand Summary
Mission
- To have a global impact by helping millions of students reach their learning potential and learn with confidence, through technology rooted in learning science [^1].
Core Values
- learning science
- global impact
- confidence
- accessibility
- premium quality
- innovation
- organization
- support
Target Audience
- Students of all abilities, especially those in post-secondary education seeking to improve their learning outcomes and confidence [^2].
Personality Traits
- modern
- approachable
- innovative
- supportive
- organized
- vibrant
- premium
Visual Identity Overview
- The brand uses vibrant gradients and abstract shapes in pink, purple, red, and blue, with a clean, modern sans-serif wordmark, isometric illustrations, and a focus on digital learning and technology. Visuals include patterns, blobs, gems, and a distinctive logo and symbol, all tied together with accessible typography and photography of real people [^3].
Categories
Brand Imagery
- Our photography is used in conjunction with our pattern elements to tie it into the overall brand.
- Whether staff photography or location shoots, our photography is professional but personal. We capture people being themselves, not forced, stiff poses.
Color Palette
Brand palette These are the key codes that form our brand; the design, story and authority that is Glean. At each touch point with our brand, we should endeavour to include a number of these codes.
The Glean palette Palette and hierarchy
- #000 #FFF #FC88C6 #BF72FD #FF5457 #9797FF
- Tertiary colours
- #FFDA69
- #OOC6B2
- *Tertiary colours are only to be used in charts etc. where the secondary colours have already been used.
- #FFA343
Typography
- Fonts Poppins (bold) for headers Poppins (light) for subheaders Nunito Sans (regular) for body copy. We may also use Nunito Sans (extra bold) for emphasis in body copy.
- We always allow ample line spacing in all of our type to maximise legibility. For Google Slides, set line width to 1.5x
- βPoppins (light) can also be used for pull quotes within body copy.β
- Use this page as a guide for sizing hierarchy between headers and body copy.
- Our text is black by default
- When used on white, or our secondary brand colours, our black text is AA or AAA WCAG accessible.
- We do not invert text colours, or use text in our brand colours other than black.*
- *With the exception of UI text in Dark Mode.
- Black text is AA+ accessible over all our brand colours
- White text over our colours fails most contrast tests
Logo Usage
- In most instances, use the full wordmark logo.
- The coloured symbol can be used for social media profile pictures and anywhere else where the wordmark will not fit.
- Do not stretch, warp or otherwise transform the logo.
- Allow ample empty space around the logo.
- Do not invert the logo. Our black logo may be used on any of our brand gradients, but will primarily appear on white.
- Do not use the pattern symbol on any other background besides white.
Tone And Messaging
Visual Style
- These are the key codes that form our brand; the design, story and authority that is Glean. At each touch point with our brand, we should endeavour to include a number of these codes. β’ The Glean logo β’ The Glean Symbol β’ The Pattern β’ The Wedge and house illustration β’ Learning messaging β’ The CORI process β’ Our CEO and visionary
- In most instances, use the full wordmark logo.
- The coloured symbol can be used for social media profile pictures and anywhere else where the wordmark will not fit.
- Do not stretch, warp or otherwise transform the logo.
- Allow ample empty space around the logo.
- Do not invert the logo. Our black logo may be used on any of our brand gradients, but will primarily appear on white.
- Do not use the pattern symbol on any other background besides white.
- The pattern represents our world of information overload: it symbolises the overwhelming profusion of information in our tech-centred lives.
- The ‘swoosh’ graphic is used to represent a sea of information, disorganised and uncontrolled. It is generally used as a background element, footer, or on slideshow titles etc.
- The shape of the swoosh is fluid and infinitely variable.
- The container ‘blob’ graphics represent information that has been captured and organised. It suggests a more manageable, contained piece of the sea of information in our ‘swoosh’, ready to be studied from.
- These blobs can appear in an infinite variety of shapes, and can be used in conjunction with photography, screenshots and mockups.
- The refined, single colour βgemβ graphics are used to represent the organised information resulting from study. They are gems of knowledge and insight ready to be integrated into wider learning processes.
- In the brand visuals, these can be used in conjunction with photography or iconography.
- #000 #FFF #FC88C6 #BF72FD #FF5457 #9797FF
- #FFDA69
- #OOC6B2
- *Tertiary colours are only to be used in charts etc. where the secondary colours have already been used.
- #FFA343
Iconography
- Where icons are more appropriate than full illustrations, single objects may be used. These appear over our ‘gems’ graphics. Example uses include lists and smaller graphics such as video thumbnails.
- Single objects can also be used where a full scene would either be distracting or would require shrinking beyond acceptable fidelity.
- Icons should not be used on a coloured background, as the icons’ gradient element clashes with flat colours. Icons should only appear on a white background.
Layout And Composition
- Allow ample empty space around the logo.
- Do not stretch, warp or otherwise transform the logo.
- Do not invert the logo. Our black logo may be used on any of our brand gradients, but will primarily appear on white.
- Do not use the pattern symbol on any other background besides white.
- The coloured wedge can be used as an alternative to the Pattern as a background layout element, in conjunction with illustrations.
- The Wedge is essentially an angled coloured area used to divide sections of a document, or act as a footer.
- The angle of the hypotenuse of The Wedge matches the angle that our isometric illustrations are drawn on.
- The Wedge can be any of our primary brand colours or gradients, however for printed materials, gradients should be avoided as they do not print well.
- The Wedge can be used in any orientation as long as the hypotenuse matches the angle of our illustrations’ perspective.
- The Wedge colour may also be inverted, i.e a white wedge on a coloured background.
- Primarily for use on printed materials, CTAs should be pulled out in a box overlaying any background elements such as the Pattern or Wedge.
- The box should be white with a ~3pt black stroke, and be set central to the page at the full width of the main content. It should have a rounded edge with a diameter of -8px.
Printed Material Guidelines
- The quality of our printed materials and promotional items should reflect our brand as a whole; they should be contemporary, accessible, and have a ‘premium’ feel.
- With promotional products, we don’t settle for the cheapest option.
- With printed documents, we take care to ensure that our brand colours and pattern appear as rich and vibrant as possible.
- Paper documents should be printed on silk paper with matt lamination where possible. This ensures optimal vibrancy of the pattern without excessive sheen.
- Single sheet or folded documents should be printed on ~170gsm paper. Longer booklets on ~130gsm.
- For booklets under 20 pages, saddle stitch binding should be used. For longer documents, choose perfect bound.
- The Wedge can be any of our primary brand colours or gradients, however for printed materials, gradients should be avoided as they do not print well.
- Highlighting is not suitable for printed material.
- Primarily for use on printed materials, CTAs should be pulled out in a box overlaying any background elements such as the Pattern or Wedge.
- The box should be white with a ~3pt black stroke, and be set central to the page at the full width of the main content. It should have a rounded edge with a diameter of -8px.
- The quality of our printed materials and promotional items should reflect our brand as a whole; they should be contemporary, accessible, and have a ‘premium’ feel.
- With promotional products, we don’t settle for the cheapest option.
- Our promotional products should provide brand awareness without relying solely on applying a logo to an object. We should use the pattern where applicable (on white) and our illustration on coloured products. Promotional items and employer merchandise are areas where our brand can be stretched and explored.
Illustrated Ui Guidelines
- When demonstrating (or simply suggesting the function of) UI elements, we can use a simplified vector illustration of the function instead of a raster screengrab.
- These illustrations simplify the UI, removing text elements and smaller icons for a clearer depiction of the app than a screenshot.
π Report