Brand Identity Guide 2019
TABLE OF CONTENTS
INTRODUCTION Project Brief
1
Design Overview
BASIC ELEMENTS
5
Color Palette Typeface Symbol Description Ratio Primary Version Variations Minimum Size Clear Space Restrictions
STATIONERY Letterhead
19
SIGNAGE Entrance
27
UI
41
Envelope Business Card Folder CD
Above Door Handout Planning Board Wayfinding Toilet Tablet Phone
M7 EDUCATION BRANDING GUIDE • 1
INTRODUCTION 1•
• PROJECT BRIEF • DESIGN OVERVIEW
Welcome to the branding guide for M7 Education. In the following pages readers will find out what our nonprofit organization is about as well as a short explanation of our design choices.
BACK TO MENU M7 EDUCATION BRANDING GUIDE • 2
PROJECT BRIEF
M7 Education provides free, curriculum-based experiences for underprivileged schools. Each field trip is fully funded by our organization but led by the school while based outside of the classroom. All planning and collateral for the field trips are completed by M7 Education so that teachers can continue teaching outstanding lessons.
3 • INTRODUCTION
DESIGN OVERVIEW
For a modern organization that works with primary schools, a contemporary logo was created to enhance the characteristics of what the organization is about. The color palette was kept simple with just two carefully chosen colors to provide a fun, welcoming feel while maintaining professionalism and symbolizing education and success. The purpose of the color palette and design was also to be able to use on multiple mediums.
M7 EDUCATION BRANDING GUIDE • 4
M7 EDUCATION BRANDING GUIDE • 5
BASIC ELEMENTS 5•
• COLOR PALETTE • TYPEFACE • LOGO DESCRIPTION • B/W & RATIO • PRIMARY VERSION • VARIATIONS • MINIMUM SIZE • CLEAR SPACE • RESTRICTIONS • MOCKUPS
The following pages are where you will learn what defines M7 Education through its basic elements. With this guideline, you will be allowed to be creative with the brand while maintaining consistency within.
BACK TO MENU M7 EDUCATION BRANDING GUIDE • 6
COLOR PALETTE
The color palette for M7 Education was made to suit a professional yet fun feel. A contemporary blue was chosen to symbolize education while keeping it young and fun. A friendly, warm yellow was chosen to to keep the nonprofit organization welcoming while symbolizing success and goals. Only two primary colors were chosen as to keep the logo clean and simple as it is an organization for primary schools.
7 • BASIC ELEMENTS
Hex: 00A5DC RGB: 0, 165, 220 CMYK: 74, 17, 1, 0
Hex: FEBE10 RGB: 254, 190, 16 CMYK: 0, 27, 99, 0
M7 EDUCATION BRANDING GUIDE • 8
TYPEFACE
The typeface chosen for the logo was English Grotesque as it has a professional yet not too industrial feel which seemed fitting for a nonprofit that worked with children. P22 Underground was used mostly a secondary typeface for things such as signage, stationery, and the UI/UX design as it is a well-known typeface for the majority of the British public since it is used for the London Underground which communicates easier for children as well as foreigners to navigate so it provides a simple yet professional feel.
9 • BASIC ELEMENTS
English Grotesque ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890..!#$%^&*() P22 Underground AB C D E F G H I J K L M NOP Q R STUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890.,!#$%^&*()
M7 EDUCATION BRANDING GUIDE • 10
SYMBOL DESCRIPTION
GRADUATION CAP TASSEL
SCHOOL BUS WHEEL
TIRE TRACKS
The logo for M7 Education was built upon the goal of providing underprivileged schools with educational field trips. The graduation cap and tassel represent education whilst the school bus wheel represents field trips. The wheel contains seven bolts inside it to have it be cohesive with the nonprofit name. The tire tracks are meant to add motion to the logo as well as the added motion in the tassel to represent perseverance within education. 11 • BASIC ELEMENTS
B/W & RATIO
4x
1/5x x
M7 EDUCATION BRANDING GUIDE • 12
PRIMARY VERSION
13 • BASIC ELEMENTS
VARIATIONS
M7 EDUCATION BRANDING GUIDE • 14
MINIMUM SIZE 1/3 in.
1/2 in.
1 1/4 in. 1/3 in.
15 • BASIC ELEMENTS
CLEAR SPACE
1/10x
x
1/10x
1/6x
1/6x
x
M7 EDUCATION BRANDING GUIDE • 16
RESTRICTIONS
Do not add any effect on the logo (drop shadow, inner glow, outer glow, etc.).
Do not use different colors for logo background color.
17 • BASIC ELEMENTS
Do not remove elements from the logo.
Do not change the orientation of the logo.
Do not change elements in the logo.
Do not use colors outside of the color palette.
M7 EDUCATION BRANDING GUIDE • 18
M7 EDUCATION BRANDING GUIDE • 19
STATIONERY 19 •
• LETTERHEAD • ENVELOPE • BUSINESS CARD • FOLDER • CD
The following pages will provide the objects listed above as well as measurements for the stationery. Readers will see that M7 Education’s stationery uses a simple, contemporary style to keep consistent with our brand.
BACK TO MENU M7 EDUCATION BRANDING GUIDE • 20
LETTERHEAD 8.5 in. 0.5 in.
.15 in
1.2 in. 1 in.
11 in.
m7e.co.uk • 702.772.1282 • 7 Waterloo Rd, London SE1 8SW
21 • STATIONERY
.15 in
ENVELOPE 9.5 in.
0.2 in. 0.2 in.
M7 Education 7 Waterloo Rd London SE1 8SW
4.125 in.
Providing memorable, educational experiences .5 in
M7 EDUCATION BRANDING GUIDE • 22
BUSINESS CARD 3.5 in.
3 in. 2 in.
0.25 in.
0.35 in. 0.45 in.
1 in.
Miguel Tripon Graphic Designer 1.5 in.
702.772.1282 info@m7e.co.uk m7e.co.uk @m7edu
23 • STATIONERY
FOLDER 9 in.
5 in.
8 in.
12 in.
1.5 in.
5.5 in.
3.5 in. 2 in. Providing memorable, educational experiences.
0.5 in.
M7 EDUCATION BRANDING GUIDE • 24
CD 4.5 in.
4.5 in.
2 in.
25 • STATIONERY
3.75 in.
Stationery Mockup
M7 EDUCATION BRANDING GUIDE • 26
M7 EDUCATION BRANDING GUIDE • 27
SIGNAGE 27 •
• ENTRANCE • ABOVE DOOR • PLANNING BOARD • WAYFINDING • TOILET • TRIP HANDOUT
The following pages contain signage used for various situations. The signs were created with a purpose of providing a fun, welcoming environment for both volunteers as well as clients for M7 Education.
BACK TO MENU M7 EDUCATION BRANDING GUIDE • 28
ENTRANCE
2.5’
2.5’
6.5’ 6’
29 • SIGNAGE
M7 EDUCATION BRANDING GUIDE • 30
ABOVE DOOR 1.5’
CREATIVE FUNDING PLANNING 3’
6.5’
31 • SIGNAGE
6’
M7 EDUCATION BRANDING GUIDE • 32
PLANNING BOARD
5’
PROJECT #126
VAUXHALL PRIMARY SCHOOL // LONDON ZOO
3’
SCHOOL • VAUXHALL PRIMARY • S LAMBETH RD SW8 ISR • PP IN CLASS: 40% • ATTENDEES: 35
TRIP • LONDON ZOO • OUTER CIR NWI 4RY • DURATION: 4HRS • TIME: 13:00-19:00
GOALS
COST
• WILDLIFE EDUCATION • ENVIRONMENT • ZOOKEEPER JOB • ANIMAL TREATMENT
• £40/TICKET • £100 EDUCATION FEE • £20 GROUP FEE • £1520 TOTAL
6’
33 • SIGNAGE
M7 EDUCATION BRANDING GUIDE • 34
WAYFINDING
CREATIVE STUDIO PLANNING ROOMS MARKETING BRANDING
CUSTOMER SERVICE APPOINTMENTS
5’5” APPLICATIONS GIFT SHOP
FINANCE DONATIONS TOILETS
35 • SIGNAGE
2.5’
6’5”
6’
M7 EDUCATION BRANDING GUIDE • 36
TOILET
1.3’
1.5’
3.5’
6.5’
4’
37 • SIGNAGE
6’
M7 EDUCATION BRANDING GUIDE • 38
TRIP HANDOUT
Bermondsey: London Zoo Trip Arrive
Penguins Polar Bears
11 in.
Lunch Break
Elephants
5.3 ft. Bermondsey: London Zoo Trip Arrive
Penguins Polar Bears Lunch Break
Rodents
Elephants
Rodents
Trip: London Zoo Time: 12:00 - 16:00 Address: Outer Cir, London NW1 4RY Goal: Educate students about animals
Trip: London Zoo Time: 12:00 - 16:00 Address: Outer Cir, London NW1 4RY Goal: Educate students about animals
Return
8.5 in.
39 • SIGNAGE
Return
M7 EDUCATION BRANDING GUIDE • 40
M7 EDUCATION BRANDING GUIDE • 41
UI DESIGN 41 •
• TABLET • PHONE
In the next few pages, readers will be able to view our User Interface design. Strong colors, beautiful imagery, as well as off-the-grid placement is used to keep with a fun, contemporary, dynamic theme that comes with M7 Education.
BACK TO MENU M7 EDUCATION BRANDING GUIDE • 42
TABLET Header & Intro
ABOUT
TRIPS
DONATE
About
M7 EDUCATION
INSPIRING THE NEXT GENERATION OF LEARNERS Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat Lorem ipsum dolor sit
• Contains links to other pages and intro for nonprofit page
Slideshow • Slideshow containing activities and brief description
amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut.
M7 EDUCATION
PROVIDING MEMORABLE, EDUCATIONAL EXPERIENCES LEARN MORE
SEE WHAT WE DO
• Main points of why and how M7 Education functions and links to pages to further information
HOW WE DO IT
LOREM IPSUM Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
WHY WE DO IT
aliquam erat Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
Trips and Footer
EDUCATIONAL YET FUN
OUR TOP TRIPS
LONDON ZOO
BUCKINGHAM
BBC RADIO
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut.
FOLLOW US
CONTACT US 702.772.1282 7 Crimson Lane London, England SW1A 1AA
43 • UI DESIGN
• Description of most popular trips given by M7 Edcuation and contact information in the footer
M7 EDUCATION BRANDING GUIDE • 44
MOBILE Header & Intro
About
M7 EDUCATION
INSPIRING THE NEXT GENERATION OF LEARNERS Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet
• Contains links to other pages and intro for nonprofit page
HOW WE DO IT
• Main points of why and how M7 Education functions and links to pages to further information
LEARN MORE
WHY WE DO IT M7 EDUCATION
PROVIDING MEMORABLE, EDUCATIONAL EXPERIENCES LEARN MORE
LEARN MORE
Slideshow
EDUCATIONAL YET FUN
LEARN ABOUT US
OUR TOP TRIPS
• Slideshow containing activities and brief description BUCKINGHAM
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod
FOLLOW US
45 • UI DESIGN
Trips and Footer • Description of most popular trips given by M7 Edcuation and contact information in the footer
M7 EDUCATION BRANDING GUIDE • 46
THANK YOU.
Thank you for taking the time to look through this design manual. M7 Education is a real nonprofit organization and if you would like to help support them, you can visit m7e.co.uk or email Nick Minter at nickminter@m7e.co.uk.
47 • CLOSING MESSAGES
designed by: Miguel Tripon email: mig.tripon@gmail.com M7 Education Branding Manual M7 EDUCATION BRANDING GUIDE • 48