View
388
Download
1
Embed Size (px)
DESCRIPTION
style guide
Citation preview
www.citycorridor.com
Internal Style GuideTABLE OF CONTENTS
Brand Standards 2TypefacesColor Palette StationeryEmail Signatures
Logo 7VariationsDo’s/Do Not’sSpacing
Imagery 11Web StandardsPrint Standards
| 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
| 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
| 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.
| 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
| 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
| 7 www.citycorridor.com | 7 www.citycorridor.com | 7 www.citycorridor.com
LOGO
VARIATIONS
| 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
| 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
| 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.
| 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)
| 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.