NEXT.GENIUS business for young people
LOGO & DESIGN
Guidelines
Prepared for Next.Genius 2017
C O N TA C T WeDesign | 125 Herold Avenue | 624 Winterland P 34 5678 68 | E info@we-design.com | W we-design.com
Brand Guidelines for NEXT.GENIUS
Table of Contents About this brand 3 The Logo T H E LO G O A N D I T S U S A G E
5
C O N S T R U C T I O N & C L E A R S PA C E
6
C O LO R V A R I AT I O N S & S I Z E S
7
CO R R E CT & I N CO R R E CT U S E
8
U S I N G T H E A RT W O R K
9
The Color LO G O C O LO R PA L E T T E
10
S E C O N D A RY C O LO R PA L E T T E
11
Typography T H E C O R P O R AT E F O N T S
12
T H E T Y P O G R A P H Y & H I E R A C H Y
14
Our brand T H E C O R P O R AT E S TAT I O N E RY
16
M E R C H A N D I S I N G 20
Grid systems P R I N T G R I D S Y S T E M S
22
W E B G R I D S Y S T E M S
23
M O B I L E D E S I G N
24
P LA C E T E X T O N P H O T O
26
Additional
2
I M AG E M O O D B OA R D
28
D E S I G N M O O D B OA R D
29
C O R P O R AT E I C O N S
30
T H E C H E C K L I S T
31
Brand Guidelines for NEXT.GENIUS
About this brand This identity guideline is a tool designed to project the image, values, and aspirations behind the brand. It is the cornerstone of all communication efforts and must be followed carefully to ensure a consistent style and quality of presentation. Every participating institution is responsible for representing or coordinating the use of the brand along with an individual institution’s brand.
Jocelyn Valentine Creative Director
3
Brand Guidelines for NEXT.GENIUS
P E R F E CT I O N I S AC H I E V E D N OT W H E N T H E R E I S N O T H I N G M O R E T O A D D, B U T W H E N T H E R E I S N O T H I N G L E F T T O TA K E AWAY. Antoine de Saint-Exupery
4
Brand Guidelines for NEXT.GENIUS
The Logo & usage The NEXT.GENIUS logo combines three elements: The NEXT.GENIUS logotype,the tagline and the graphical element. These elements should never be changed. Position, size, and color, along with the spatial and proportional relationships of the NEXT. GENIUS logo elements, are predetermined and should not be altered.
01 The Logo symbol
01
02 The Logo word mark
02
03 The Logo tagline
03
Used consistently, they will reinforce public awareness of the company. The corporate logo is presented through the use of colors as well as shape and typography. The colors are a fresh cyan combined with a powerful anthrazit.
THE 2 VERSIONS OF THE LOGO
Standard Logo 01
Standard Logo 02
This is the logo of choice, to be used whenever possible. For all print and digital marketing.
A secondary version of the logo for all versions which need the elements to be centered.
5
Brand Guidelines for NEXT.GENIUS
Construction & clearspace The NEXT.GENIUS logo requires serperation from the other elements around it. The space required on all sides is roughly eqivalent to the heighth of the graphical element. It never should be less than that. The logo must always fit into the clearspace
area and can not be intervened by other graphical elements which could hinder legibility of the brand. These exclusion area is shown below for the two versions of the logo.
Important Please note that text or pictorial figures which have strong impact or impression should not be placed near the logos even though you keep the isolation area blank.
6
Brand Guidelines for NEXT.GENIUS
Color variations & sizes Sometimes, often due to production costs, only one color of ink is available and so the Logo must be reproduced using only one color. In this scenario, the logo must be used following the convention of using a light color type on a dark background or in a dark color
type on a light background. The logotype and the symbol must be clearly distinguishable from the background color. You must honor the NEXT.GENIUS Logo palette when possible, using black or white if necessary.
Logo color variations
Logo on CMYK 75/25/17/0
Logo on CMYK 80/69/54/46
Logo on CMYK 12/4/25/0
Background 100% white - logo 70% black
Background 20% black - logo 100% black
Black, white and grayscale
Background 100% black - logo 100% white
MINIMUM SIZES OF THE LOGO
52 mm for first logo version
46 mm for second logo version
15 mm for the sympol
7,5 mm for the icon
Important There are no predeterminded sizes for the logo. Scale and proportion should be determined by the available space, function and visibility. In print the minimum size is 52 / 46 mm width, for the symbol it is 15 mm and for the icon 7,5 mm.
7
Brand Guidelines for NEXT.GENIUS
Correct & incorrect use Do’s 01. Solid backgrounds always welcomed.
02. Frame the logo with enough space around it.
01
02
Don’ts 01. Never rotate the logo 02. Please don’t add a dropshadow 03. Don’t use non-approved colors
04. Never change the proportions of the logo 05. Don’t use outlines. Wether for the text or the symbol / icon 06. Don’t rearrange the elements in any way
01
02
03
04
05
06
Please note The logo cannot be changed! Although creativity is appreciated please do not alter the logo in anyway! Please avoid adding text, elements or non-approved colors. These list is exhaustive vand contains only examples.
8
Brand Guidelines for NEXT.GENIUS
Using the artwork This page explains the file naming system for the artwork of the various versions of the logotype. The filename contains all key information to identify the appropriate logo version for each application. The logotype is supplied in EPS and PNG file formats. For
printed documents use always the EPS files. PNG files should only be used for the web applications or if you are using Mircosoft Word or Powerpoint.Please make sure that the correct artwork for each application is used..
nextgenius_ logo_firstchoice_CMYK.eps Logotype version
Colorspace
File format
- first choice - second choice
- CMYK - RGB - grayscale - black
- EPS - PNG
AVA I L A B L E L O G O T Y P E F I L E S EPS files
PNG files
nextgenius_logo_firstchoice_CMYK.eps nextgenius_logo_secondchoice_CMYK.eps nextgenius_logo_firstchoice_grayscale.eps nextgenius_logo_secondchoice_grayscale.eps nextgenius_logo_firstchoice_black.eps nextgenius_logo_secondchoice_black.eps
nextgenius_logo_firstchoice_RGB.png nextgenius_logo_secondchoice_RGB.png nextgenius_logo_firstchoice_grayscale.png nextgenius_logo_secondchoice_grayscale.png nextgenius_logo_firstchoice_black..png nextgenius_logo_secondchoice_black.png
9
Brand Guidelines for NEXT.GENIUS
Logo color palette Use of color for the printed & digital logo. The following palette has been selected for use in NEXT.GENIUS communcations. Lighter tints of these colors are also allowed., but the Logotype + background may only be used with a 100% tint. The primary colors include a dark cyan blue, that embodies the
01
creativity and dynamic of the company. The additional colors are gray and white to underline the seriousity of your business. A comprehensive color palette has been developed to provide flexibility while creating a unified, recognizable appearance across all communications.
02
BLUE POWER
100 %
80 %
60 %
40 %
GRAPHIT
20 %
60 %
40 %
Color codes
Color codes CMYK 80 / 69 / 54 / 46 RGB 48 / 56 / 67 HEX #303843 Pantone 432 C HKS 97N
These colors are complementary to our official colors, but are not recognizable identifiers for our company. Use the colors Petrol BLUE, SUMMER OCEAN and SPRINGTIME sparingly.
10
80 %
CMYK 75 / 25 / 17 / 00 RGB 50 / 153 / 188 HEX #3299bc Pantone 7459 C HKS 40N
Important
www.pantone.com www.hks-farben.de
100 %
20 %
Brand Guidelines for NEXT.GENIUS
Secondary color palette The palette allows the addition of secondary colors to enrich the NEXT.GENIUS visual identity as a whole. Lighter tints of these colors are also allowed.
These colors are complementary to our official colors, but are not recognizable identifiers for our company. Use the both orange colors sparingly.
Color codes
PETROL
CMYK 89 / 50 / 44 / 19 RGB 26 / 97 / 112 Hex #196170
Color codes CMYK 12 / 4 / 4 / 00 RGB 221 / 231 / 236 Hex #dce7ec
SUMMER OCEAN
ELEGANT GREY
Color codes CMYK 52 / 00 / 22 / 00 RGB 115 / 203 / 105 Hex #72cbcc
Use of colors CMYK - use primarily to produce print applications with images. Example - brochure, flyer, poster etc. RGB/HEX - REGB is used for all screen based applications. Example - websites, apps Pantone / HKS- use for print with only a few colors and no images. Example - business card, envelope etc.
11
Brand Guidelines for NEXT.GENIUS
The corporate fonts P R I M A RY F O N T P T S A N S Designer
License
Commissioned by
Alexandra Korolkova with Olga Umpelova and Vladimir Yefimov
SIL Open Font License or ParaType Free Font License
Rospechat, a department of the Russian Ministry of Communications
Date created / released
Classification
Category
2009 13 January 2010
Humanist sans-serif, Transitional serif, Monospaced font
Font Superfamily
PT Sans ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 Bold
Dus, consequi repe omnis quas etus, odia dolutem. Em il Git laborro il molore dolore, conet lam que voluptasite voluptia.
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 Regular
Dus, consequi repe omnis quas etus, odia dolutem. Em il Git laborro il molore dolore, conet lam que voluptasite voluptia.
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890
Italic
Dus, consequi repe omnis quas etus, odia dolutem. Em il Git laborro il molore dolore, conet lam que voluptasite voluptia.
Download links for font: https://www.fontsquirrel.com/fonts/pt-sans
https://fonts.google.com/specimen/PT+Sans
12
Brand Guidelines for NEXT.GENIUS
S E C O N DA RY F O N T P T S E R I F Designer
License
Commissioned by
Alexandra Korolkova with Olga Umpelova and Vladimir Yefimov
SIL Open Font License or ParaType Free Font License
Rospechat, a department of the Russian Ministry of Communications
Date created / released
Classification
Category
2010 by Paratype
Humanist sans-serif, Transitional serif, Monospaced font
Slab serif font family
PT Serif
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 Bold italic
Dus, consequi repe omnis quas etus, odia dolutem. Em il Git laborro il molore dolore, conet lam que voluptasite voluptia.
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 Italic
Dus, consequi repe omnis quas etus, odia dolutem. Em il Git laborro il molore dolore, conet lam que voluptasite voluptia.
Download links for font: https://www.fontsquirrel.com/fonts/pt-sans
https://fonts.google.com/specimen/PT+Sans
13
Brand Guidelines for NEXT.GENIUS
The typography & hierachy Size is the simplest way to create contrast between different typographic elements in your design. With 6 levels of typography, the font size generally starts out largest
Main heading
on top (level one; your most important information) and decreases in size as you move down the page. Layout, for both print and screen, is one of the most important
aspects of graphic design. You achieve this through use of typefaces weight, size, capitol and lowercase, letters and color.
Header PT sans bold, font size 80 pt and 0 pt leading
HEADLINE
PT sans bold uppercase, font size 44 pt and 0 pt leading
Headline
PT sans bold uppercase, font size 26 pt and 0 pt leading Headlines 1 & 2
Subline
PT sans regular normal, font size 24 pt and 0 pt leading
SUBLINE PT sans regular, font size 14 pt and 50 pt leading
Subline PT sans bold italic , font size 11 pt and 0 pt leading Sublines 1 - 3
14
Brand Guidelines for NEXT.GENIUS
Type is what meaning looks like Max Phillips C E N T E R - S I G N A L T Y P E F O U N D RY
More Text formats
Character styles
Ex et la nat que es modi ad expliquate pro molendus nobit quos dolorep erunto ma non corporu mquati dolum re eum. Body copy PT serif bold italic 8 pt
E X E T LA N AT Q U E E S M O D I A D E X P L I Q U AT E P RO M O L E N D U S N O B I T Q U O S D O LO R E P E R U N TO. Regular uppercase, leading 100 pt
Ex et la nat que es modi ad expliquate pro molendus nobit quos dolorep erunto ma non.
Ex et la nat que es modi ad expliquate pro molendus nobit quos dolorep erunto ma non corporu mquati dolum re eum. Underlined text
Intro text PT serif bold italic 10 pt
15
Brand Guidelines for NEXT.GENIUS
The corporate stationery Our stationery is one of the most widespread forms of contact for business and corporate communications. Clean and simple, we designed our stationery to align with our visual system. The let-
terhead features the logo in the top left corner with the business contact information on the opposite site.
THE LETTERHEAD
50 mm
90 mm
124 Street Name, City 45
+49 123.456.234.56
contact@next-genius.com
www.next-genius.com
297 mm
210 mm
20 mm
20 mm
Parameter Dimensions: DIN A4 / 210 x 297 mm Weight: 100 g/m²
16
Paper: Offset white Print: HKS or Pantone
Brand Guidelines for NEXT.GENIUS
THE ENVELOPES
Parameter Dimensions: C5 DIN lang with window Weight: 100 g/m²
Paper: Offset white / 100 g/m² Print: HKS or Pantone
17
Brand Guidelines for NEXT.GENIUS
THE BUSINESS CARDS
25 mm
J O H N VA L E N T I N E
124 Street Name, City 45
Creative Director
+49 123.456.234.56 contact@next-genius.com www.next-genius.com
55 mm
Partial UV varnish
Parameter Dimensions: 85 x 55 mm Weight: 350 g/m²
18
Paper: Offset white Print: HKS or Pantone
Special effects: Rounded corners Partial UV varnish
Brand Guidelines for NEXT.GENIUS
P R E S E N TAT I O N F O L D E R
Parameter Dimensions: 340 x 480 mm Weight: 260 g/m²
Paper: Chromo board Print: HKS or Pantone
19
Brand Guidelines for NEXT.GENIUS
MERCHANDISING When used on t-shirts, mugs etc. any of the approved logos can be used. The symbol may also be used separately from the lettering.
T- S H I R T S
Parameter T-Shirt design on graphit, blue power, elegant gbray and summer ocean. The size of the
20
printed logo is 300 mm x 280 mm. Please use the shown logo colors.
For the background use always graphit, blue power, summer ocean or elegant gray. Other colors are not allowed.
Brand Guidelines for NEXT.GENIUS
OFFICE SUPPLIES
Parameter For other office supplies use always the same color, no matter what printable object you use.
POSSIBLE ARE: Mugs or coffee to go cups Basecaps
Tote or paper bags Pencil or ball pen USB Sticks
21
Brand Guidelines for NEXT.GENIUS
PRINT GRID SYSTEMS Use on DIN A4 and letter format The grid is used as a guide for how to place text, photos and advertisements on the page. The font size that you use should be proportionate to the grid. Using a font that is too large will cause odd hyphenation and breaks, which can
be difficult to read and using a typeface that is too small can cause strain on a reader trying to get from the start of a line to the end. The 12 column grid is always the basic. For special prints, a 6 column grid is also allowed.
Use 2, 3, 4, 6, 8, 10 or 12 columns for the layout
22
Brand Guidelines for NEXT.GENIUS
WEB GRID SYSTEMS Use on different devises. Grid systems are used for creating page layouts through a series of rows and columns that house your content. Here are some
examples. The Bootstrap 3 grid system has four tiers of classes: xs (phones), sm (tablets), md (desktops), and lg (larger desktops). Please follow the rules, to have a consistant visual appearance.
The layout is based on a 12 columns bootstrap grid system.
23
Brand Guidelines for NEXT.GENIUS
MOBILE DESIGN LO G O P L AC E M E N T To place the NEXT.GENIUS logo please use the approved grid system. It always should be on the top and center.
24
Brand Guidelines for NEXT.GENIUS
TA B L E T V E R T I C A L G R I D Always place the logo on the top and center. Please use the approved layout
25
Brand Guidelines for NEXT.GENIUS
P LA C E T E X T O N P H O T O Place text on images according to the examples on these pages. It is important to place the text on solid color parts of the background. It is not allowed to use text on complex backgrounds,
26
because it will reduce the readability. Colors for the text are white, blue power, graphit and petrol. Other colors are not allowed. Use the background color of the logo like in the examples.
Brand Guidelines for NEXT.GENIUS
27
Brand Guidelines for NEXT.GENIUS
IMAGE MOODBOARD
28
Brand Guidelines for NEXT.GENIUS
DESIGN MOODBOARD C O L O R C O M B I N AT I O N S
Blue power
Graphit 50%
Petrol
Graphit
Petrol
Summer ocean
Elegant gray
Summer ocean 50%
Elegant gray
Grayscale
100% Elegant gray
P AT T E R N
I M A G E T R E AT M E N T S
CMYK
29
Brand Guidelines for NEXT.GENIUS
C O R P O R AT E I C O N S The icons are pictograms displayed on the screen or print layout in order to help to navigate through the content. The icon itself is a comprehensible symbol of a software tool, function, or a data file, accessible on the system and is more like a traffic sign than a
detailed illustration of the actual entity it represents. The icons are used with the square background or without any background in print and web. They are available in 2 different color combinations.
Icon sizes The minimun size for all corporate icons is 30 px x 30 px. Useable for print and web. Only 100% colors are allowed.
Icons without a background
Icons with a solid background
30
100%
125%
150%
200%
Brand Guidelines for NEXT.GENIUS
THE CHECKLIST Best to have a checklist. Then you know you’ve done everything perfectly!
01 T H E L O G O Only use approved versions of the logo. Please check that you have respected the minimum size and exclusion zone requirements. The logo should not appear on color backgrounds without being reversed out.
02 C O L O R Please make sure that only your approved primary and secondary colors are used.
03 T Y P O G R A P H Y Use the font Adobe Caslon Pro for all top headings. For body text and smaller headings use font Lato. Both fonts are also available for web.
04 I M AG E RY Use desatured photos with vintage color, grayscale photos or photos with color overlay. Please follow the rules.
0 5 P R I N T M AT E R I A L S Please use the provided grids and approved layouts for all printed products and the stationery.
To provide feedback, share informations or seek answers to questions you may have about this brand, please contact: JANE WHITEMORE Brand development manager 125 Herold Avenue, Anywhere 5624 Winterland United States
EUGENE BUNDY Brand communication manager 125 Herold Avenue, Anywhere 5624 Winterland United States
Phone Fax E-Mail
Phone Fax E-Mail
+22 (0) 44 34 5678 68 +22 (0) 44 34 5678 70 whitemore@your-company.com
+22 (0) 44 34 5678 69 +22 (0) 44 34 5678 70 bundy@your-company.com
31
NEXT.GENIUS business for young people
C O N TA C T WeDesign | 125 Herold Avenue | 624 Winterland P 34 5678 68 | E info@we-design.com | W we-design.com