Creation Speak Brand Book

Page 1

Brand

Book The new design guidelines for Creative Speak

w | www.creationspeak.com e | connect@creationspeak.com p | 404.732.5286


Brand Guidelines for Creation Speak

Designed by Creation Speak

Introducing Creation Speak

Table of contents

Founded in 2013, by Erica TG Warren, Creation Speak LLC is a story and strategy agency created to bring the #humanback to marketing. We speak the language of the Creators, problem solvers and innovators driving the future. They have a great story to tell. Yet they are struggling with the words and strategy to tell it with impact, engagement and scale. That’s our specialty. We work on brand refreshes, product launches, internal and external events, acquisitions and mergers. Story and Strategy services that repair the breakdown between your message and your marketing.

01 THE LOGO The Logo and its usage

6

Black, white and grey scale

7

Logo construction and clearspace

8

Mininmum logo sizes and incorrect uses

9

02 TYPOGRAPHY The primary & secondary font

12

Typography and hierachy

14

03 COLOR SYSTEM

“Storytelling is one part dreaming, one part creativity, and three parts authenticity.” - Erica T.G. Warren, Chief Creations Officer -

The Logo color palette

18

Secondary color palette

19

The moodboard

20

04 THE STATIONERY The letterhead

24

The business card and envelope

25

05 THE IMAGERY The imagery & color effects

28

06 GRID SYSTEMS Print grid systems

32

Web grid systems

34

07 ADDITIONAL Office supllies

40

Corporate icons

42

Checklist 44 Help or Feedback?

2

45

3


Brand Guidelines for Creation Speak

Designed by Creation Speak

01 Our logo is the touchstone of our brand and one of the most valuable assets. We must ensure its proper usage. 1. The logo and its usage / 2. Black, white and gray scale / 3. Logo construction + clearspace / 4. Minimum logo sizes and incorrect uses

4

5


Brand Guidelines for Creation Speak

The logo + usage

Designed by Creation Speak

The general logo presented through the use of colors, shapes and typography.

The icon

The colors included in the primary logo designs are: a

The Creation Speak logo combines three elements: the Creation Speak logotype,the tagline and the icon as a graphical element. These

Black, white + grayscale

The Creation Speak logo is

100%

fresh gradient green, dark

The word mark

brown, aqua blue, bronze,

Sometimes, often due to production costs, only one color of ink is

metal, grey and white and

The tagline

available and so the Logo must be reproduced using only one color.

black.

In this scenario, the logo, logotype, or symbol must be used following

elements should never be changed. Position, size, and color, along with the spatial and proportional relationships of the Creation Speak logo

DARK VERSION

the convention of using a light color type on a dark background or in

LIGHT VERSION 100% grey

elements, are predetermined and should not be

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 Creation Speak logo palette when possible, using black or white if necessary.

100% white A variant of use when the background is light colored.

6

A variant of use when the background is light or dark colored.

7


Brand Guidelines for Creation Speak

Logo construction + clear-space

Designed by Creation Speak

FULL LOGO AND LOGO ICON

SYMBOL

ICON

Creation Speak logo. Scale and propor-

For digital uses the minimum size for the

space, function and visibility. In print the

size apart from when using an ICO. The

tion should be determined by the available

standard logo is 120 px. This is the smallest

minimum size is 34 mm width, for the sym-

size for the ICOs is 16 px.

bol it is

10 mm width.

34 mm

10 mm

16 px

LOGO: INCORRECT USE

other elements around it. The space required on all sides never should be less than that. The logo must always fit

THE LOGO

There are no predeterminded sizes for the

The Creation Speak logo requires separation from the is roughly equivalent to the cap height of the logo type. It

MINIMUM LOGO SIZES

Whenever you use the logo, it should be surrounded with clearspace to ensure its visibility.

Please note: The logo cannot be changed!

Although creativity is appreciated please do not alter the logo in anyway!

into the clear-space area and can not be intervened by other graphical elements which could hinder legibility of the

DON’T rotate the logo

DON’T add a drop shadow

DON’T rearrange elements

DON’T stretch the logo

Don’t use outside colors

DON’T outline the logo

DON’T change gradient

DON’T use it over an image

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

If you use the logo icon as a single object, it also needs clearspace all around.

8

9


Brand Guidelines for Creation Speak

Designed by Creation Speak

The typography

02 Typography is 95% of design – it’s a driving force in all forms of communication art 1. The primary font / 2. Secondary font

10

11


Brand Guidelines for Creation Speak

Primary font Neo Sans Pro DESIGNER: SEBASTIAN “SEB” LESTER Neo Sans Pro is a modern design. Neo Sans and Neo Tech are the typefaces designed by the British type designer Sebastian “Seb” Lester. The typefaces were released by Monotype Corporation on April 19, 2004. The design concept called for a versatile, futuristic typeface that did not appear “crude, gimmicky or ephemeral”. This font should be used in all Creation Speak communications to project a consistent visual identity. This includes promotional materials, advertising, digital assets, and printed materials.

12

Designed by Creation Speak

Neo Sans Pro

Helvetica Neue

REGULAR ITALIC BOLD BOLD ITALIC BLACK BLACK ITALIC

LIGHT REGULAR ITALIC BOLD BOLD ITALIC

Secondary font Helvetica Neue DESIGNER: MMAX MIEDINGER Miedinger and Hoffmann set out to create a neutral typeface that had great clarity, no intrinsic meaning in its form, and could be used on a wide variety of signage.

Specimens

Specimens

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890!Ӥ$%&/()=?;,.:-_

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890!Ӥ$%&/()=?;,.:-_

This sans serif font is available in 10 weights. We use 4 of them. The light, regular, italic and bold versions. The subline of the logo uses the regular weight. 13


Brand Guidelines for Creation Speak

Designed by Creation Speak

The color system

03 With 93% of customers influenced by colors and visual appearance, make sure you pick the right colors for your company. 1. The logo color palette / 2. Secondary color palette/ 3. Moodboards

14

15


Brand Guidelines for Creation Speak

Designed by Creation Speak

100%

100%

The logo color palette

80%

PRIMARY COLOR AQUA GREEN

60%

CMKY

62 / 0 / 18 / 6

RGB

99 / 177/ 188

HEX #63b1bc

(choice for icon and logo)

USE OF COLOR FOR THE PRINTED & DIGITAL LOGO

80%

COLOR CODES

SECONDARY COLOR PEA GREEN

60%

COLOR CODES CMKY

48 / 0 / 100 / 0

RGB

146/ 200 / 62

HEX #92c83e

(choices for expanded color scheme) 40%

40%

20%

20%

100%

100%

The palette allows the addition of secondary colors to enrich the Creation Speak visual identi-

The following palette has been selected for use in Creation Speak communcations. Lighter tints of these colors are also allowed., but the Logotype + background may only be used with a 100% tint.

80%

PRIMARY COLOR DEEP BROWN

60%

COLOR CODES CMKY

30 / 71 / 75 / 81

RGB

78 / 54 / 41

HEX #4e3629

(color choice for logo and font)

brown that embodies the creativity and dynamic of the

SECONDARY COLOR PALE ORANGE (choices for expanded color scheme)

40%

The primary colors include a pale aqua green and deep

80%

60%

COLOR CODES CMKY

2 / 81 / 93 / 0

RGB

235 / 86/ 46

HEX #eb562e

40%

20%

20%

100%

100%

Secondary color palette ty 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.

company. The additional color is a light cool grey 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.

16

80%

PRIMARY COLOR COOL GREY

60%

COLOR CODES CMKY

23 / 16 / 13 / 46

RGB

121 / 125 / 130

HEX #797d82

(color choice for logo and font)

80%

SECONDARY COLOR TAUPE

60%

COLOR CODES CMKY

28 / 41 / 94 / 5

RGB

183 / 143 / 57

HEX #b78f39

(choices for expanded color scheme)

40%

40%

20%

20%

17


Brand Guidelines for Creation Speak

Moodboard cool colours If you are using the primary color palette, just take photos with some cyan in it. This color should contain a lot of green. Don’t use photos with too much of one color in it.

18

Designed by Creation Speak

Moodboard warm tones If you are using the secondary color palette, just take photos with brown in it. This color should contain a lot of taupe. Don’t use photos with too much red or yellow in it. You can also use photos with gray colorscheme.

19


Brand Guidelines for Creation Speak

Designed by Creation Speak

The stationery

04 When it comes to developing the stationery, consistency is the key for all layouts and designs 1. The letterhead / 2. Business card and envelope

20

21


Brand Guidelines for Creation Speak

Designed by Creation Speak

210 mm

BUSINESS CARDS

The letterhead

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

Dimension: 85 mm x 55 mm

Print:

Our stationery is one of the most widespread forms of contact for

350 g/m² glossy white paper

Clean and simple, we designed our stationary to align with our visual system. The letterhead features the logo in the top left corner

297 mm

business and corporate communications.

ENVELOPES

with the business contact information on the opposite site. The envelope will be used for all official contact

Dimensions:

and communication of our company. These are

DIN A4

the approved layouts.

(297 x 210 mm)

Dimension: Paper:

Din lang with address window

100 g/m² offset white

Print:

NOTICE:

80g/m² offset white paper

The backside of all envelopes

with window, self-adhesive

will be plain. Other formats are allowed.

22

23


Brand Guidelines for Creation Speak

Designed by Creation Speak

The imagery

05 Brand image is the overall impression in consumers’ mind that is formed from all sources 1. The imagery & color effects / 2. Examples and rules

24

25


Brand Guidelines for Creation Speak

Designed by Creation Speak CMYK

EXAMPLES AND RULES

The imagery + color effects

REQUIREMENTS: 1. Use desaturated colors with light vintage feel 2. For photos with people use only single persons (max. 2 persons if required.

Good imagery helps to reinforce our values and creativity.

3. All photos should be light and clean

Any photography needs to be professional in its approach

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

and engaging in its content. It is essential for our

into the picture.

Creation Speak brand, because it creates emotions

5. Also allowed are grayscale images for print and web

and has a distinct personality. Avoid clichĂŠs and obvious poses.

6. Use of imagery that demonstrates creativity, nature or

The uniqueness of each photo will help to reiterate the

7. Use CMYK (RGB for web) modus, when the background is

persons.

white or the colorscheme fits with the colors of

independent spirit of our brand.

Creation Speak. Grayscale

70% beige

8. Use grayscale images, when the colorscheme doesn’t fit with the background.

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

26

27


Brand Guidelines for Creation Speak

Designed by Creation Speak

The grid system

06 Using a grid system is one way to achieve a level of consistency that would be otherwise extremely difficult to master 1. Print grid system / 2. Web grid system / 3. Mobile devices

28

29


Brand Guidelines for Creation Speak

Designed by Creation Speak

GRID SYSTEMS FOR IMAGES

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

Use 2, 3, 4, 6, 8, 10 or 12 columns for the layout

prints, a 6 column grid is also allowed.

30

31


Brand Guidelines for Creation Speak

Web grid systems

Designed by Creation Speak

GRID SYSTEM WEB LAYOUT

WIRE FRAMES

The layout is based on a 12 columns bootstrap grid system.

General information of the content and layout of each page.

4 column grid

6 column grid

Custom layout

Portfolio page

Product page

Article right

Article left

Blog

Landing page

Team members

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.

32

33


Brand Guidelines for Creation Speak

Mobile devices

Designed by Creation Speak

LOGO PLACEMENT

TABLET VERTICAL GRID

To place the Creation Speak logo please use the approved grid system. It is

The layout is based on a 8 columns bootstrap grid system. Please use the approved layout

based on a 6 column grid. Other ways are not allowed.

FONTS The fonts Neo Sans Pro and Helvetica Neue can also be used on the web. Neo Sans Pro is always used for the big headlines, Helvetica Neue for the basic text and smaller headlines.

USE ON MOBILE PHONE.

COLOR

Grid systems are used for creating page layouts

The basic color for the websites is always white. Use

through a series of rows and columns that house

dark brown to highlight some

your content. Here are some examples.

articles. The blue and brown colors are mainly used for headlines, underlines or icons.

The Bootstrap 3 grid system has four tiers of

NAVIGATION

classes: xs (phones), sm (tablets), md (desktops),

The navigation is always on See more Âť

the top. Use appropriate casing for letters based on current branding theme.

34

35


Brand Guidelines for Creation Speak

Designed by Creation Speak

The additional

07 An organization, no matter how well designed, is only as good as the people who live and work in it. 1. Office supplies / 2. Corporate

36

37


Brand Guidelines for Creation Speak

Designed by Creation Speak

OTHER SUPPLIES

Office supplies

For other office supplies use always the same color, no matter what printable object you use. Possible are:

When used on t-shirts, mugs etc. any of the

Mugs or coffee to go cups

approved logos can be used. The symbol may

Basecaps

also be used separately from the lettering.

Tote or paper bags Pencil or ball pen

For the background use always our custom

USB Sticks

white, grey, blue and brown. Other colors are

Mobile phone cover

not allowed.

etc.

T-Shirt design on our custom white, spring blue, grey and deep brown. The logo size is 300 mm x 280 mm. Please use the shown logo colors.

38

These are only some examples of possible supplies.

39


Brand Guidelines for Creation Speak

Designed by Creation Speak

Corporate icons

MINIMUM ICON SIZE

The icons are pictograms displayed on the screen

The minimun size for the icon usable in web is 8,5 mm for print designs 14 mm

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

MAXIMUM ICON SIZE

sign than a detailed illustration of the actual entity it represents The icons are not limited to what is displayed in this section, but they are always used with the round background in print and web. They are available in multiple color combinations within Creation Speak branding, but mainly the 2 combinations

40

ICONS FOR LIGHT BACKGROUND

ICONS FOR DARK BACKGROUND

The maximum size for the icon usable in web is 20 mm for print designs 55 mm

41


Brand Guidelines for Creation Speak

Designed by Creation Speak

CREATION SPEAK LLC

Help or feedback?

1040 W Marietta Street NW Atlanta, GA 30318 www.creationspeak.com

Thank you! Branding & Identity Guidelines | Version 1.0

(404) 732.5286 connect@creationspeak.com

We know how important your brand is to your consumers. Interested in engaging? Reach out. We’d love to talk to you.

TEAM MEMBERS ERICA TG WARREN Founder and Chief Creations Officer erica@creationspeak.com MARTINE ST. HILAIRE Designer + Marketing Operations Specialist martine@creationspeak.com

42

43


CREATION SPEAK 1040 W Marrietta St NW Atlanta, GA 30318 United States

e | connect@creationspeak.com w | www.creationspeak.com


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.