DESIGN & BRAND GUIDELINES - LANDSCAPE

I m a g e a r e a d e s i g n | Ve r s i o n 1 . 0 | M ay 2 0 1 8

Brand Guidelines LOGO & I DE NTI TY FOR CRE ATI VE M IN D S

YOUR COMPANY 125 Herold Avenue, Anywhere | 5624 Winterland Phone 34 5678 68 | E-Mail info@your-company.com | Web www.your-company.com

CLIENT: CREATIVE MINDS

05/04/2018

BRAND GUIDELINES

Good design is obvious Great design is transparent.

(Andrew Grant, Even)

2

Table of contents

BRAND GUIDELINES

0 1 .

I NTRODUCTI ON

4

0 2 .

THE LOGO

6

0 3 .

THE TYPOGRAPHY

12

0 4 . COLOR SYSTE M

16

0 5 . PRI NTE D

20

0 6 .

28

WE B DE SI GN

0 7 . THE I MAGE RY

32

0 8 . A DDI TI ONA L

36

Ilis sapis pra nis arita pa poraeribus quaecepero tem earchil elest, sitiam quiam, et ullitibeaque adit laut que vellabo remporum essintia velles mint omnihita.

3

ABOUT THIS BRAND

4 5

05/04/2018

Information about this brand

01. Introduction

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

About this brand A unified and consistent use of these guidelines is one of the key ways by which we will visibly distinguish and strengthen the equity and hence the value of our brand over the medium and long-term.

These guidelines are designed to help everybody involved in the production of our communications and they also play an important role in building our brand. Please take time to read and understand them: The design principles have been carefully considered and developed to ensure that our visual identity is consistent all around the world. They will continue to evolve as our requirements grow to become a fully comprehensive guide for all identity applications.

Sarah Riverside Graphic designer

5

6

7

B L A C K & G R AY S C A L E

8

C O N S T R U C T I O N & C L E A R S PA C E

9

INCORRECT USES

10

MINIMUM SIZES

11

USING THE ARTWORK

11

Our logo is the touchstone of our brand and one of the most valuable assets.

LOGO & USAGE

02. The logo

CLIENT: CREATIVE MINDS

05/04/2018

BRAND GUIDELINES

BRAND GUIDELINES

Logo & usage The creative minds logo combines three elements: The CREATIVE MINDS lettering, the tagline and the logo icon. These elements should never be changed. Position, size, and color, along with the spatial and proportional relationships of the creative minds logo elements, are predetermined and should not be altered.

The primary color option for our logo is anthrazit . It is intended to be used on lighter

Another acceptable color option is to reverse the logo out to Light Blue on darker back-

backgrounds and images in order to maintain legibility.

grounds and images.

7

BRAND GUIDELINES

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 CREATIVE MINDS Logo palette when possible, using black or white if necessary.

CLIENT: CREATIVE MINDS

05/04/2018

Black & grayscale

100% black color

8

70% black color

100% white color

BRAND GUIDELINES

Construction & clearspace The CREATIVE MINDS logo requires serperation from the other elements around it. The space required on all sides is roughly eqivalent to the letter width of the logo type.

1/2 x

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.

Please note that text or pictorial figures, which have strong impact or impression, should not be placed near the logo, even though you keep the isolation area blank.

1/2 x

9

BRAND GUIDELINES

Incorrect uses The logo cannot be changed! Although creativity is appreciated please do not alter the logo in anyway!

CLIENT: CREATIVE MINDS

05/04/2018

Please note:

DON’T use stroke shadows

10

DON’T use non-approved colors

NEVER change the proportions

DON’T use outlines

BRAND GUIDELINES

Minimum sizes

Using the artwork Creative-Minds_ logo_firstchoice_CMYK.eps Logotype version

Colorspace File format

- first choice

- CMYK

- EPS

- second choice

- RGB

- PNG

- grayscale

-JPG

- black The Logo: Ă˜ 25 mm

The sympol: Width12 mm

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 Ă˜ 25 mm, for the symbol it is width 12 mm

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.

11

12 T H E P R I M A R Y T Y P E FA C E 13

T H E S E C O N D A R Y T Y P E FA C E 14

TYPOGRAPHY & HIERACHY 15

05/04/2018

Typography is 95% of design – it’s a driving force in all forms of communication art.

03. Typography

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

The primary typeface Adobe Caslon Pro ABOUT THE FONT

A long running serif font first designed in 1722 and used extensively throughout the British Empire in the early eighteen century. It was used widely in the early days of the American Colonies

and was the font used for the U.S. Declaration of Independence, but fell out of favor soon after.

It has been revived at various times since then, in particular during the British Arts and Crafts

ABCDEFGH IJKLM NOPQRSTUVWX YZ abcdefghijklmnopqrstuvwxyz 1234567890 !�§$%&/()=?+*#

movement and again each time it went through a redesign for technological changes.

It continues to be a standard in typography to this day.

Aa

13

BRAND GUIDELINES

The secondary typeface L ATO

CLIENT: CREATIVE MINDS

05/04/2018

ABOUT THE FONT

14

Lato is a sanserif type­face fam­ily designed in the Sum­mer 2010 (“Lato” means “Sum­mer” in Pol­ish). In Decem­ber 2010 the Lato fam­ily was pub­lished under the open-​​source Open Font

License by his foundry tyPoland, with sup­port from Google. In 2013 – 2014, the fam­ily was greatly extended to cover 3000+ glyphs per style. The Lato 2010 fam­ily now sup­ports 100+ Latin-​​based

ABCDEFGH IJKLM NOPQRSTUVWX YZ abcdefghijklmnopqrstuvwxyz 1234567890 !Ӥ$%&/()=?+*#

lan­guages, 50+ Cyrillic-​​based lan­guages as well as Greek and IPA pho­net­ics. In the process, the met­ rics and kern­ing of the fam­ily have been revised and four addi­tional weights were created.

Aa

BRAND GUIDELINES

Tpography & hierachy Heading 1 / Adobe Caslon Pro, 42 pt bold

The quick brown fox Heading 2 / Adobe Caslon Pro, 30 pt bold

The quick brown fox Heading 3 / Adobe Caslon Pro, 18 pt bold

The quick brown fox

RU L ES Size is the simplest way to create contrast between different typographic elements in your design. With 5 levels of typography, the font size generally starts out largest 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.

Heading 4 / Lato, 12 pt bold uppercase, spacing 100

T H E Q U IC K BRO W N FOX Heading 5 / Lato, 9 pt bold uppercase, spacing 200 THE QUICK BROWN FOX

Body Copy Lato (8 pt regular) The quick brown fox

This fonts should be used in all creative minds communications to project a consistent visual identity. This includes promotional materials, advertising, digital assets, and printed materials.

The font Lato is available in 10 weights.

We use 3 of them. The regular, italic and bold versions.

Body Copy Adobe Caslon Pro (10 pt regular) The quick brown fox

15

16 L O G O C O L O R PA L E T T E 17

SECONDARY COLORS 18

USE OF COLORS 19

05/04/2018

With 93% of customers influenced by colors and visual appearance.

04. Color system

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

Logo color palette The primary colors include a nthrazit color and apastel blue, that embodies the creativity and dynamic of the company. The additional colors are gray and white to underline the seriousity of your business. Lighter tints of these colors are also allowed, but the Logotype + background may only be used with a 100% tint.

Anthrazit

Pastel blue

COLOR CODES

COLOR CODES

CMKY - 20 / 0 / 0 / 82

CMKY - 16 / 4 / 0 / 0

RGB - 68 / 76 / 80

RGB - 21 / 235 / 249

HEX - #444c50

HEX - #ddebf9

Pantone - 433 C

Pantone - 656 C

HKS Process - 97 N

HKS Process - 39 N (40ww%)

17

BRAND GUIDELINES

01

02

CLIENT: CREATIVE MINDS

05/04/2018

Secondary colors

01 ATUMN BROWN

02 LILAC

COLOR CODES

COLOR CODES

CMKY - 21 / 20 / 25 / 0

CMKY - 16 / 8 / 0 / 0

RGB - 211 / 201 / 191

RGB - 220 / 228 / 245

HEX - #d3c9bf

HEX - #dce4f5

Pantone - 433 C

Pantone - 433 C

HKS Process - 97 N

HKS Process - 97 N

03 03 SOFT ROSE COLOR CODES CMKY - 4 / 16 / 10 / 0 RGB - 244 / 223 / 222 HEX - #f4dfde

18

Pantone - 433 C HKS Process - 97 N

04 04 WINTER BLUES COLOR CODES CMKY - 100 / 88 / 39 / 33 RGB - 31 / 44 / 81 HEX - #1f2c51 Pantone - 433 C HKS Process - 97 N

BRAND GUIDELINES

Use of colors

A comprehensive color palette has been developed to provide flexibility while creating a unified, recognizable appearance across all communications.

The logo color palette includes specifications for Pantone colors on coated stock (C) and HKS on natural paper (N).

When reproduced using the four-color process (CMYK), and when creating PowerPoint presentations (RGB).

The palette allows the addition of secondary colors to enrich the creative minds visual identity as a whole. Lighter tints (up to 20 %) of these colors are also allowed.

These colors are complementary to our official colors, but are not recognizable identifiers for our company. Use the the “Winter blues“ and “Soft Rose” colors sparingly.

U SE O F C O LO RS CMYK - use primarily to produce print applications with images.

Example - brochure, flyer, poster etc.

RGB/HEX - REG 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.

19

21

BUSINESS CARDS

22

THE ENVELOPE

23

PRINT GRID SYSTEM

24

PLACE TEXT ON PHOTO

25

MERCHANDISING 26

20

Consistency is the key for all layouts and designs

THE LETTERHEAD

05. Printed

CLIENT: CREATIVE MINDS

05/04/2018

BRAND GUIDELINES

BRAND GUIDELINES

The letterhead Clean and simple, we designed our stationary to align with our visual system. The letterhead features the logo in the middle of the top with the business contact information on the opposite site.

Parameter DIMENSIONS: DIN A4 / 210 x 297 mm WEIGHT: 100 g/m² PAPER: Offset white PRINT: HKS or Pantone

21

BRAND GUIDELINES

CLIENT: CREATIVE MINDS

05/04/2018

Business card The business card will be used for all official contact and communication of our company. These are the approved layouts.

The cards will always be double sided.

Sarah Riverside Graphic designer

+49 123.456.234.56 123 Street Name

contact@creative-minds.com

Wellington City 45, CA

www.creative-minds.com

Parameter

22

DIMENSIONS:

WEIGHT:

PAPER:

PRINT:

DIN A4 / 210 x 297 mm

100 g/m²

Offset white

HKS or Pantone

BRAND GUIDELINES

Envelopes The envelope will be used for all official contact and communication of our company. These are the approved layouts.

Other formats are also allowed.

23

BRAND GUIDELINES

CLIENT: CREATIVE MINDS

05/04/2018

Print grid system

24

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 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.

BRAND GUIDELINES

Place text on photo

Timeless design

We love to create things that matter

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, because it will reduce the readability.

Colors for the text are Anthrazit and Pastel Blue.

Other colors are not allowed. Use the background color of the logo like in the examples.

Timeless design

We love to create things that matter

25

BRAND GUIDELINES

CLIENT: CREATIVE MINDS

05/04/2018

Merchandising

26

When used on t-shirts, aperbags etc. any of the approved logos can be used. The symbol may also be used separately from the lettering. For the background use always winter blue, pastel blue, soft rose or anthrazit. Other colors are not allowed.

BRAND GUIDELINES

Paper bags These are the apporoved layouts for a paper bag, pencil and price tags.

27

28 GRID SYSTEM WEB 29

MOBILE WEB DESIGN 30

SOCIAL MEDIA 31

05/04/2018

Using a grid system is one way to achieve a level of consistency

06. Web design

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

Grid system web 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.

29

BRAND GUIDELINES

CLIENT: CREATIVE MINDS

05/04/2018

Mobile web design

General

Welcome.

Branding on the web is about function as well as style. That is why consistency is essential throughout the pages of a website, with navigation bars, headers and footers, and color schemes all serving to orient the visitor.

In this way, the graphics enable the visitor to find information quickly and easily.

Fonts The fonts Adobe Caslon Pro and Lato can also be used on the web.

The Caslon font is always used for the big headlines, Lato for the basic text and smaller headlines.

30

Inspiring.

Modern.

Cheerful.

BRAND GUIDELINES

Social media

Inspiring. Modern. Cheerful.

Inspiring. Modern.

Cheerful.

Facebook and Instagram story Our Social media applications are an important way to tell our brand story to internal and external stakeholders. The following is a small sample of ways to execute our new brand identity in collateral.

The size of Facebook banners should always be 851 x 315 px and the size of the Instagram story should be 1080 x 1920 px.

31

32 DIFFERENT COLOR MODES 33

IMAGE MOODBOARD 34

TEXTURE MOODBOARD 35

05/04/2018

Brand image is the overall impression in consumers’ mind that is formed from all sources

07. The imagery

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

Different Color modes These are the 3 color modes, that are allowed. CMYK (or RGB for web), grayscale and Pastel Blue color overlay (Transparency: Multiply).

33

BRAND GUIDELINES

Image moodboard

CLIENT: CREATIVE MINDS

05/04/2018

Examples and rules Requirements: For photos with people use only single persons (max. 2 persons if required.

All photos should be light and minimal.

Use pastel and gray colors.

Use the optimal image detail, so that it looks like zoomed into the picture.

Also allowed are grayscale images for print and web Use CMYK (RGB for web) modus, when the background is white or the colorscheme fits with the colorschemes Use grayscale images, when the colorscheme doesn’t fit with the background.

Use grayscale images with color overlay, when you want to write some text on it.

34

BRAND GUIDELINES

Texture moodboard Glitter & marble

Palette of glitter, foil and marble textures.

Make it simple, but significant!

35

36 C O R P O R AT E I C O N S 37

THE CHECKLIST 38

05/04/2018

An organization is only as good as the people who live and work in it.

08. Addtional

CLIENT: CREATIVE MINDS

BRAND GUIDELINES

BRAND GUIDELINES

Corporate icons 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.

Icon sizes

100%

125%

150%

175%

200%

Icons without background

The icons are used with the square background or without any background in print and web. They are available in 2 different color combinations.

Icons with a solid background

37

BRAND GUIDELINES

The checklist 05/04/2018

Best to have a checklist. Then you know you’ve done everything perfectly!

01 THE LOGO

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.

Contact for feedback & questions

SARAH RIVERSIDE Brand development manager 125 Herold Avenue, Anywhere 5624 Winterland

CLIENT: CREATIVE MINDS

United States

02 COLOR

Please make sure that only your approved primary and secondary colors are used.

03 TYPOGRAPHY

+22 (0) 44 34 5678 68

Fax

+22 (0) 44 34 5678 70

E-Mail

riverside@your-company.com

Use the font Adobe Caslon Pro for all top headings. For body text and smaller headings use font Lato or also Adobe Caslon Pro. Both fonts are also available for web.

EUGENE BUNDY

04 IMAGERY

Use desatured photos with less color, grayscale photos or photos with color overlay. Please follow the rules.

38

Phone

Brand communication manager 125 Herold Avenue, Anywhere 5624 Winterland United States

0 5 P R I N T M AT E R I A L S

Phone

+22 (0) 44 34 5678 69

Please use the provided grids and approved layouts for all printed products and the stationery.

Fax

+22 (0) 44 34 5678 70

E-Mail

bundy@your-company.com

BRAND GUIDELINES

Work hard in silence.

Let success make the noise.

Sarah Riverside (Graphic designer)

39

YOUR COMPANY 125 Herold Avenue, Anywhere | 5624 Winterland Phone 34 5678 68 | E-Mail info@your-company.com | Web www.your-company.com