booj look and feel guidelines

14
look and feel guidelines

Upload: abarry29

Post on 12-Feb-2016

228 views

Category:

Documents


0 download

DESCRIPTION

 

TRANSCRIPT

Page 1: Booj look and feel guidelines

look and feel guidelines

Page 2: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

logo

tagline only

logo & tagline

logo text only

logomark only

configurations & usage

red gradient This is our primary logo. Use on marketing materials, letter head, business cards etc.

solid redThis is our secondary logo that can be used when gradients are not possible.

black and whiteUse when color printing is not an option.

whiteUse this logo when placing on a black or dark background color or photograph.

logomark onlyUse only when booj logo is present somewhere else on the same document.

logo & taglineUse when booj and its branding are the focus of the document/piece.

tagline onlyUse only when booj logo is present somewhere else on the same document/page.

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

Page 3: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

logo clear space & minimum size

clear spaceClear space is the space surrounding our logo that is free from an obstructions such as other logos, text, images or the edge of a page.

The minimum clearance space for each variation of the logo is 2X. X is defined as the distance between the logo mark and the “b” in “booj”.

minimum sizeThe minimum size is the smallest width the logo can have to ensure it is still prominent and legible on the document.

The minimum size for the logo is 1.4” and the minimum size for the logo mark is .36”. Scale will increase proportionately with the logo’s width.

tagline only

logo & tagline

logo text only

logomark only

X

2X

2X

2X

2X

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

1.4” .36”

Page 4: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

logo dos & don’ts

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

tagline only

logo & tagline

logo text only

logomark only

1 3

2 4

5

6

dos1. Give the logo the correct amount

of space surrounding it.

2. Only use the white logo on black or dark backgrounds

don’ts3. Never distort, stretch or squish

the logo in any way.

4. Never cop the logo in any way

5. Do not cover logo with text, other logos or graphic elements.

6. Never use the primary logo on dark/busy backgrounds.

Page 5: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

color specifications

secondary colors

main color

dark red

light red

dark grey

medium grey

light grey

black

white

primary colors

yellow

orange

light blue

dark blue

turquoise

1 98 95 0

25 100 100 24

0 89 72 0

67 60 59 44

60 51 51 20

27 21 22 0

100 100 100 100

0 0 0 0

CMYK

235 34 39

153 11 15

255 62 67

68 68 68

102 102 102

187 187 187

0 0 0

255 255 255

EB 22 27

99 0B 0F

FF 3E 43

44 44 44

66 66 66

BB BB BB

00 00 00

FF FF FF

RGB HEX (HTML)

6 5 97 0

0 41 89 0

84 45 0 0

100 87 33 22

55 0 27 0

245 224 27

250 164 52

0 124 196

18 52 102

107 200 196

F5 E0 1B

FA A4 34

00 7C C4

12 34 66

6B C8 C4

CMYK RGB HEX (HTML)

Page 6: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

Typography Print

super header-kabel book 48 ptheader-kabel book 30 ptsubheader-kabel book 18 ptitem header-kabel medium 12 pt

body text-veranda regular at 12 pt font and 14 pt leading. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla. Duis libero diam, condimentum et, condimentum in, congue eu, tellus. Phasellus eu elit at nisi ultricies lobortis. Suspendisse porta commodo leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla.

Duis libero diam, condimentum et, condimentum in, congue eu, tellus. Phasellus eu elit at nisi ultricies lobortis. Suspendisse porta commodo leo. Sed tincidunt tincidunt massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla. Duis libero diam, condimentum et, condimentum in, congue eu, tellus. Phasellus eu elit at nisi ultricies lobortis.

Suspendisse porta commodo leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla. Duis libero diam, condimentum et, condimentum in, congue eu, tellus.

Page 7: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

typography Web

super header-veranda 45 ptheader- veranda 24 ptbody text-veranda regular at 16 pt font and 20 pt leading. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla.

linked text-veranda 16 pt-”Main Color”

hover

Page 8: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

Icons

option 1

option 2

Page 9: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

imagery/ photography

overall guidelinesThe photography used should be bright, candid and when possible, orignial booj photography. Imagry can be overlayed with a texture when a background or a red bar for captions.

staff photosOnly use official staff photos. There are both BW and color versions, but BW is preferred.

Page 10: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

signatures

emailThe officail email signature should not contain images.

Laura Williamcreative/design director | boojphone | 555.555.5555

email | [email protected]

printPrint signatures will include the logo mark instead of the entire logo. It should be on a document that has the entire logo somewhere else.

Laura Williamcreative/design director | boojphone | 555.555.5555

email | [email protected]

tagline only

logo & tagline

logo text only

logomark only

Page 11: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

business cards

back

front

Laura Williamcreative/design director

phone | 555.555.5555email | [email protected]

tagline only

logo & tagline

logo text only

logomark only

booj.com

Page 12: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

letterhead

Laura Williamcreative/design director | boojphone | 555.555.5555email | [email protected]

tagline only

logo & tagline

logo text only

logomark only

575 Union Blvd. Suite 310Lakewood, CO 80228

June 21, 2013

Dear John Smith,

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupi-datat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

booj.com

tagline only

logo & tagline

logo text only

logomark only

Page 13: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

envelopes

front

tagline only

logo & tagline

logo text only

logomark only

575 Union Blvd. #310Lakewood, CO 80228

back

tagline only

logo & tagline

logo text only

logomark only

booj.com

Page 14: Booj look and feel guidelines

booj | look and feel guidelines

tagline only

logo & tagline

logo text only

logomark only

power point