THE GUIDE
Brand Guidelines Aug u s t 2 01 6 The purpose of this style guide is to explain the use of The Guide brand style and to reinforce consistent application of the visual elements in all communications, both online and offline.
Our Brand
Our Logo
Color Palette
Typography
Brand essence Brand purpose Tone of voice Mood board Logo concept Clear space Min. sizes Logo variations Prohibited use Our color palette Tints and shades Color proportion Heading typography Subheading typogr. Body typography Typography style Written example
Graphic Elements
Backgrounds Patterns Corporate Identity
Photography
Photography style
Contact
Contact details
Our Brand.
Brand Essence
Our mission’s brand is to make the world connect and expend faster it’s knowledge. Through our online platform we help people to connect, learn, explore and share their knowledge and what maters most to them. This way we are maximizing and straighten people’s ability to build and improve their knowledge which gives them the chance to contribute for the growth of other people lives.
Ou r p er so na lity Informed, tech-savvy, future oriented, open, honest, innovative, exploratory, energetic, responsible, fun, approachable, open and brave.
Brand Purpose
To bring to the world a lifestyle of exploratory learning thorough fun and intelligent online learning.
Ou r va lues •
learning from each other
•
sharing and connecting
•
innovation and technology
•
openness and integrity
Tone of Voice
The Guide tone of voice through verbal and
Our communication, external and internal rep-
written communication represents the way we
resents how we should behave with our custom-
are recognized and distinguished in the market.
ers and with our employees.
Off line cha nnels
O u r co mm u n ica t ion
Through offline channels like print collaterals,
•
show your expertise and be helpful
signages, client interactions, and online chan-
•
do not use jargons
nels like websites, online ads, emails, presenta-
•
avoid gambling references
tions, etc our tone of voice is:
•
empower and encourage
•
promote The Guide in a positive light
•
smart and confident
•
be specific, use facts to support claims
•
engaging and honest
•
share information and ideas
•
human and sincere
•
be polite and respectful
•
fun and energetic
•
be open and show genuine interest
What is our look and feel? W ha t is a Moo d B o ard? The mood board is a fun way of establishing the aesthetic and visual feel of our brand which has given us the inspiration of creating our brand look and feel. The board is basically a loose of visual interpretation that the brand identity should take, but please note that this doesn’t mean that the brand is meant to be taken literally and automatically like in our collage.
Mood Board
Our Logo.
Logo Concept
In an abstract way, through a customized “g” as
O u r “g ” s ta n d s for
a person inside of an enclosed circle the logo is representing the people integrated into the
•
giving - to people the best tool to help
community. By having the “g” intersected with
connect and share their knowledge
the circle we show that we are approachable,
•
gaming - using the game theory to moti-
open and we connect with the community.
vate people
•
guidance - guide people to learn, share
and connect
•
generate - outstanding long life results
•
genuine - everything in a genuine way
Logo concept
+
P u r pl e s ta n d s for
=
In psychology, purple is a humanitarian, selfless and unlimited color being recognized as the C OM M UN I T Y
P EO P LE
T H E G U ID E
color of good judgement.
Clear Space Clear space is separating the logo from other elements such as headlines, text, imagery and the outside edge of printed materials. The x equals to the hight/wight of the logo.
Brochure design LOREM IPSUM
x
x
x
x
m i n . c l e ar s pace
x
x
x
x
T H E GU I DE I S AN O NLI NE PLAT FO R M FO R EX PLO R ATO RY LEAR NI NG
Min. Size
O N SCRE E N 55px
The minimum size described includes the clear space. The minimum sizes are applicable for displays of 72DPI. If the display screens have
5 5 px
55px
higher DPI/retina, minimum size should be adapted proportionally. 55px
On sc reen
IN PRIN T
The minimum logo width for web pages and ap-
13mm
plications is 55x55px.
In p r int
13m m
13mm
The minimum logo width for print is 13mm. The optimal width for A4 print is 49mm. 13mm
Logo variations
Primary recommended use of logo on a dark background (i.e. purple)
Logo variations
Secondary recommended use of logo on a light background (i.e. white)
Logo variations
The logo can be published only in the primary color palette on light backgrounds. This is recommended on cases of service distinction. To better visualize and connect the brand with a specific service, it is recommended to keep a color system. For instance:
A.
B.
Do’s A.
The Guide for e-learning
B.
The Guide for gaming
C.
The Guide for business
C.
Prohibited use
It is important to not get the logo mixed up and loose the visibility. The following list contains some examples of prohibited use of the logo in order to maintain a coehensive look over the online and offline chanells.
A.
B.
C.
D.
E.
F.
Don t’s A.
Don’t recolor the logo
B.
Don’t reverse the logo
C.
Don’t skew the logo
D.
Don’t apply any effects
E.
Don’t place the logo in any color on col-
ored backgrounds
F.
Don’t place the logo in color on complex
backgrounds or photography.
Color Palette.
Our color palette #4C 3E D7 R G B 7 6/62/215 CMYK 7 9 /7 7/0/0
# D35 2BF P R IM ARY C O LO RS
R G B 211/8 2/19 1 CMYK 24/78 /0/0
# 6 6 329 8 R G B 102/5 0/15 2 CMYK 74/9 6/0/0
# FFC C 33 R G B 25 5 /204/5 1 CMYK 0/19 /8 9 /0
#FB ED 93 RGB 251/ 237/ 147 CMYK 3/ 2/ 53/ 0
#D 5FCEB RGB 213/ 252/ 235 CMYK 14/ 0/ 11/ 0
#CA D 4 FD RGB 202/ 212/ 253 CMYK 16/ 13/ 0/ 0
#6 6 6 CE8 RGB 102/ 108/ 232 CMYK 69/ 62/ 0/ 0
S EC ONDA RY C O LO R S
# 33C C C C R G B 5 1/204/204 CMYK 64/0/26/0
# FFFFFF NEUT R AL C O LO RS
R G B 25 5 /25 5 /25 5 CMYK 0/0/0/0
#312 C 4 8 RGB 49/44/ 72 CMYK 83/82/44/44
#5B 596 D RGB 92/89/ 110 CMYK 67/ 62/40/ 18
Tints and shades
TIN TS
10%
Re comm end ed var i at i o n s
2 0% 3 0%
Tints are the mixture of the brand colors with
40%
white, which increases lightness. Shades are the mixture of the brand colors with black, which
5 0%
reduces lightness. A tone is produced either
60%
by the mixture of a color with gray, or by both tinting and shading. Please note that tints and
7 0%
shades are different than color opacity.
SHA DES
Color proportion
This graphic is made to give you an idea of how you can balance the colors in The Guide branded materials.
Do’s •
use the core colors for a constant plat-
form that allows introduction of other
design elements
•
case by case, color proportion depends
on the individual application
•
from time to time please check out the
graphic to make sure you are balancing
the colors correctly. MAIN CO LO RS
ACCE N T CO LO RS
Typography.
Heading typography The Guide primary typeface for heading on printed and online materials is Sofia Pro Condensed. The alternative for web safe usage is Questrial/Century Gothic/Arial typeface.To be used to increase contrast. The font can be found on https://typekit.com/ fonts/sofia-pro-condensed
S ofia Pro C o n d e n s e d ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$!
Aa
Subheading typography The Guide primary typeface for titles and subheading on printed and online materials is Sofia Pro. The alternative for web safe usage is Questrial/Century Gothic/Arial typeface. The font can be found on https://typekit.com/ fonts/sofia-pro
S ofi a Pro ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$!
Aa
Body typography The Guide primary typeface for body copy on printed and online materials is Sofia Pro Light. The typeface is to use on all documents. Typical applications include letters, presentations, websites and documents. The alternative for web safe usage is Questrial/Century Gothic/Arial typeface.
Sofia Pro L ig ht ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$! ABCDEFGHIJKLMNOPQRSTUVXYZ abcdefghijklmnopqrstuvxyz 0123456789&?$!
Aa
Typography style
Boxing wizards jump Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus portitor. Donec ullamcorper nulla non metus auctor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Curabitur blandit tempus porttitor. Etiam
H EA D I N G S SO F IA PRO ME DIUM/ Q UESTRIA L BO LD/CE N THURY GOTHIC BO LD
I N T R O D UCT I O N SO F IA PRO REGULA R/ Q UESTRIA L REGULA R
S UB H EA D I N G S SO F IA PRO S E MIBO LD/ Q UESTRIA L BO LD/CE N THURY GOTHIC BO LD
B O DY
Fringilla Ligula Ridiculus Dolor
SO F IA PRO LIGHT/ Q UESTRIA L LIGHT
• Etiam Parturient Commodo Elit Mattis Tellus Aenean Solli
B UL L ET ST Y L E
• Sem Nibh Ornare Parturient Venenatis Cras Ferment hfarn
SO F IA PRO LIGHT/ Q UESTRIA L LIGHT
• Nullam Sit Pellentesque Cursus Elit Ipsum Tortor Solkrime
Donec sed odio dui. Curabitur blandit tempus porttitor. Vivamus sagittis lacus vel augue laoreet rutrum
B UL L ET ST Y L E SO F IA PRO E X TRA LIGHT ITA LIC/ A RIA L ITA LIC
Written communication
TH E GUI D E I S A N ON L IN E PLATFOR M FO R E XPLOR ATO RY LE A RN I N G
Nibh Cras Ullamcorper Mattis Ultricies Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec id elit non mi porta gravida at eget metus.
Graphic Style.
Backgrounds
A.
B.
C.
D.
E.
F.
Recommendations You can use both solid and gradient backgrounds. It is recommended to use only the colors from the primary color palette including the tints and shades of it.
How are we using the gradients? Gradient b a ckg ro u n ds Gradient backgrounds can be used in combination with other graphic elements or with photography. It is recommended to be used for achieving contrast and not be used excessively. Some examples can be seen on the next page.
Patterns
A.
B.
C.
D.
E.
F.
Recommendations The patterns are to be used to give the brand a particular style. It is recommended to not be used excessive and always be combined with light elements.
Corporate identity
Rebacca Ringdahl r.r@theguide.com +882-90320-067 theguide.com
The Guide is an online platform for people looking to learn exploratory
The Guide Streetname 8700 Seattle, USA
Magna Tristique Sollicitudin Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Donec sed odio dui. Maecenas faucibus mollis The Guide Streetname 8700 Seattle, Usa
interdum. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Maecenas sed diam eget risus varius blandit sit amet non magna. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Sed posuere consectetur est at lobortis. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. D apibu s Pellen tes qu e
Ridiculus Egestas Condimentum Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam.
The guide i s an on li n e p l a tfor m for ex plorator y learning
Photography.
Photography style
The Guide uses photography to communicate the brand with the audience. Hence, both inhouse and purchased stock imagery must comply with the following:
Do’s •
proper ownership of artwork copyright
•
photos used must be of high quality
•
imagery types: lifestyle, hobby, mood
•
students: learning, sharing, guiding
•
people: happy, fun, excited, active
•
people using tech products, business
Students Learning
Students Guiding
People Sharing
Fun
People
Passionate People
People &
Technology
Contact.
Do you want to reach us? Ou r contact details Megadodo Interactive, LLC 2624 Western Ave, #202 Seattle WA 98121 United States For Design: Mariana Aspru mariana.aspru@gmail.com www.marianaaspru.com
ŠMegadodo Interactive, LLC. All rights reserved Design and content by Mariana Aspru