12
www.citycorridor.com Internal Style Guide TABLE OF CONTENTS Brand Standards 2 Typefaces Color Palette Stationery Email Signatures Logo 7 Variations Do’s/Do Not’s Spacing Imagery 11 Web Standards Print Standards

Style guide v1

  • View
    384

  • Download
    1

Embed Size (px)

DESCRIPTION

style guide

Citation preview

Page 1: Style guide v1

www.citycorridor.com

Internal Style GuideTABLE OF CONTENTS

Brand Standards 2TypefacesColor Palette StationeryEmail Signatures

Logo 7VariationsDo’s/Do Not’sSpacing

Imagery 11Web StandardsPrint Standards

Page 2: Style guide v1

| 2 www.citycorridor.com

BRAND STANDARDS

TYPEFACES

Raleway

Use this typeface for section and content headers, and sub-headers. Always use with CAPITALIZATION to signify its importance in the hierarchy, but only in the section and content headers, never for sub-headers.

EnriquetaUse this typeface for the main content in all applicable documentation.

HelveticaHelvetica should be used in the case of numbering. If there is data, use Helvetica for numbers, and symbols.

SECTION HEADER

CONTENT HEADER

Content sub-header

Examples: Examples: Examples:

Content Sub-header

Use this typeface for the main content in all applicable documentation. Odis re porepel estincimus est laborum ex eos que vente nonsed mod modi sam earupis excerovit acepe occulla boreiciet facererepuda dolut ut liquia.

41%Young Adults

29%Adults

16%Seniors

15%Children

Page 3: Style guide v1

| 3 www.citycorridor.com

BRAND STANDARDS

COLOR PALETTE

Section Headers

Section Title

Content Header

Content Sub-head

Headline (web)

ADVERTISING

LISTING FEATURES

UI FLOW

ANALYTICS

Typography Colors

ABOUT

Page 4: Style guide v1

| 4 www.citycorridor.com | 4 www.citycorridor.com

BRAND STANDARDS

COLOR PALETTE

Logo Colors

These color palettes show the various colors selected from the logo, and used in different opacities ranging from 100, to 25%. It also includes two swatches darker than the original color, for breadth of choice.

The use of these colors is yet to be determined.

Page 5: Style guide v1

| 5 www.citycorridor.com

BRAND STANDARDS

STATIONERY

GIVING YOUR BUSINESS AN ADVERTISING EDGE

www.citycorridor.com

5264 International Blvd., Suite 200, North Charleston, SC 29418MAILING ADDRESS P.O. Box 80904, Charleston, SC 29416

PHONE: (843) 278.5558 | FAX: (843) 277.1184

PO Box 80904Charleston SC 29416

www.citycorr idor.com

Chad PriestChief Operating Officer

o 843.278.5558 | m [email protected]

Letterhead

Business Card

Page 6: Style guide v1

| 6 www.citycorridor.com

BRAND STANDARDS

EMAIL SIGNATURES

Email Signature

The above screenshot shows the new standard for City Corridor Email Signatures. Everyone is to use this exact template in order to foster a consistent brand identity. The signature is to always be center aligned. No variation to this signature is allowed unless previously approved in writing by the Marketing Manager.

Directions

Go to the gear icon at the top right of your Gmail account.

Click on the “settings tab” and scroll to the signature section.

Copy and paste the template from a colleagues email, filling in your own information.

Check the box below signature section that reads “Insert this

signature before quoted text in replies and remove the “--” line that precedes it.” This is very important.

1

2

3

4

Special phone number instructions

If you are not located at HQ, and rely on your cellphone for communication, here is how to change “office” to “cell” without losing detail.

When under the signature editing section of “settings”, change “Office” to “Cell”.

Insert the number.

Highlight the number, and click the hyperlink button”

Insert number in “Text to display” and “email to”. It doesn’t matter that it is not a link, it should still

brute force the stylization onto your cell number.

1

2

3

4

Page 7: Style guide v1

| 7 www.citycorridor.com | 7 www.citycorridor.com | 7 www.citycorridor.com

LOGO

VARIATIONS

Page 8: Style guide v1

| 8 www.citycorridor.com | 8 www.citycorridor.com | 8 www.citycorridor.com

LOGO

DO’S

The Trademark Logo

The trademark logo is to be used whenever possible. As per the standards of owning a trademark, we must prove it is being used often. Resize with constraints on the resolution to keep the dimensions at their intended ratio. This is to also be used on stationery.

This is our most important logo variation, use liberally.

The Horizontal Logo

The horizontal logo is to be used in footers of internal documents. For a proper example, see bottom right of this document. This is the only acceptable usage of this logo variation (as it is not a trademarked logo).

11

2

3

4

2

The Website Logo

The above logo’s are to only be used for the website, and video content introduction screens, as seen in the promo videos made previously.

The Powered By Logo

The powered by logo is to be used in the case of media kits, where the main focused logo is of the vendor’s own brand. (ex. Choose Chicago).

3

4

Page 9: Style guide v1

| 9 www.citycorridor.com | 9 www.citycorridor.com | 9 www.citycorridor.com www.citycorridor.com

DO NOT’S

LOGO

Things you CAN’T do to the logo

Place any variation of the logo on a background color other

than white, black, or approved light grey. This includes gradients of any shade.

Use the black bg logo type without a black background present.

Use a “TM” mark on any logo variation other than the trademarked stacked logo.

Re-color any part of the logo

Drop opacity on the logo unless approved by Creative Director.

Stretch/shape the logo in any way that distorts the ratio, and lowers resolution.

Place the logo on an angle, or vertical.

Stack other objects on top of the logo (there must be at least an half an inch buffer zone around

the logo at all times).

1

2

3

4

5

6

7

8

Page 10: Style guide v1

| 10 www.citycorridor.com | 10 www.citycorridor.com | 10 www.citycorridor.com

LOGO

SPACING

.5” .5”

.5”

.5”.5”

.5”.5”

.5”

.35”

1.2”

.35”

.67”

.35”

1.1”

Spacing standards

There must be half an inch of spacing around the logo (no matter the variation being used) at all times. Keep a .35” padding between each side of the logo, no matter the variation. In the case of the trademarked logo, bottom padding must be set to .67” to ensure .35” margin on most of the remaining sides. Under no circumstances should the .5” rule, nor the .35” rule be broken for any logo.

Page 11: Style guide v1

| 11 www.citycorridor.com | 11 www.citycorridor.com | 11 www.citycorridor.com | 11 www.citycorridor.com | 11 www.citycorridor.com

IMAGERY

WEB STANDARDS

Restaurant Name

How to use imagery on web

For web based imagery the following standards are to be followed:

Color Mode: RGB

Dpi: 72

Formats: PNG, JPEG, GIF

For Transparency: PNG-24 is best.

Optimize for web use in these ways, but never use these same standards for print, as a separate set of standards is necessary for print.

ALWAYS keep the ratio of the image constrained as to not lose quality. (Don’t do below)

Page 12: Style guide v1

| 12 www.citycorridor.com | 12 www.citycorridor.com | 12 www.citycorridor.com | 12 www.citycorridor.com | 12 www.citycorridor.com

IMAGERY

PRINT STANDARDS

How to use imagery in print

For print based imagery the following standards are to be followed:

Color Mode: CMYK

Dpi: 100

Formats: JPEG, TIFF

For Transparency: PSD sourced files are acceptable.

Optimize for print use in these ways, but never use these same standards for web, as a separate set of standards is necessary for print.

ALWAYS keep the ratio of the image constrained as to not lose quality.