brand guidelinesassets.511.org/.../more/511nextgen-branding-guide-draft.pdfconsiderations mandate,...

BRAND GUIDELINESJUNE 2016

DRAFT

2511 Branding Guide

SF Bay Logo PrimarySF Bay Logo Variations 1SF Bay Logo Variations 2Logomark PrimaryLogomark Variations 1Logomark Variations 2

SF Bay Logo w/ Tagline 1SF Bay Logo w/ Tagline 2SF Bay Logo w/ Tagline (CTA)Logomark w/ Tagline 1Logomark w/ Tagline 2Logomark w/ Tagline (CTA)

Primary ColorsSecondary Colors

Print FontsWeb Fonts

SizeClear Space

Modal languageCall to ActionStandardized DescriptionsReferring to 511

345678

91011121314

1516

1718

1920

21222324

511 LOGO

COLORS

FONTS

SIZE & CLEAR SPACE

LANGUAGE & DESCRIPTIONS511 LOGO WITH TAGLINE & CTA

TABLE OF CONTENTS

TABLE OF CONTENTS

DRAFT

3511 Branding Guide

The 511 logo is the single identifying logo for all aspects and elements of 511. It should be used in all communications for which 511 is the call-to-action, and/or for providing links to 511.org. The 511 logo is not to be altered or augmented in any way.

You can download these files along with 511 web banners at: 511.org/branding

Primary (1-Color Reversed)

SF BAY LOGO PRIMARY

511 SF BAY LOGOSF BAY LOGO PRIMARY

DRAFT

4511 Branding Guide

Primary (1-Color Reversed) 2-Color 2-Color (Reversed)

The color logo should be used whenever possible.

When the logo cannot be placed on a green background, the 2-color logo should be used. It works best against white or a light-colored background.

The 2-color reversed logo should be used against black or a dark-colored background.

511 SF BAY LOGOSF BAY LOGO VARIATIONS 1

SF BAY LOGO VARIATIONS 1

DRAFT

5511 Branding Guide

Grayscale Black/White Black/White (Reversed)

The grayscale logo should be used against lighter backgrounds when printing specifications or design considerations mandate, e.g., printing or designing in black and white.

The black logo should be used against light backgrounds whenprinting specifications or design considerations mandate, e.g.,printing or designing in black and white.

The reversed logo should be used against a dark background.

511 SF BAY LOGOSF BAY LOGO VARIATIONS 2

SF BAY LOGO VARIATIONS 2

DRAFT

6511 Branding Guide

The 511 Logomark can be used alone for certain communications.

Primary (1-Color Reversed)

511 LOGOMARKLOGOMARK PRIMARY

LOGOMARK PRIMARY

DRAFT

7511 Branding Guide

Primary (1-Color Reversed) 2-Color 2-Color (Reversed)

The color logo should be used whenever possible.

When the logo cannot be placed on a green background, the 2-color logo should be used. It works best against white or a light-colored background.

The 2-color reversed logo should be used against black or a dark-colored background.

511 LOGOMARKLOGOMARK VARIATIONS 1

LOGOMARK VARIATIONS 1

DRAFT

8511 Branding Guide

Grayscale Black/White Black/White (Reversed)

The grayscale logo should be used against lighter backgrounds when printing specifications or design considerations mandate, e.g., printing or designing in black and white.

The black logo should be used against light backgrounds whenprinting specifications or design considerations mandate, e.g.,printing or designing in black and white.

The reversed logo should be used against a dark background.

511 LOGOMARKLOGOMARK VARIATIONS 2

LOGOMARK VARIATIONS 2

DRAFT

9511 Branding Guide

Tagline

The official 511 Tagline is: “Wherever you’re going, start here.”

Depending on the design of the piece, the tagline’s position in relation to the logo may vary. The tagline doesn’t need to be used every time the logo is used, but as much as the communication and design warrants.

You can download these files at:511.org/branding

511 SF BAY LOGOSF BAY LOGO W/ TAGLINE 1

SF BAY LOGO W/ TAGLINE 1

DRAFT

10511 Branding Guide

Tagline Doubled Stacked

511 SF BAY LOGOSF BAY LOGO W/ TAGLINE 2

SF BAY LOGO W/ TAGLINE 2

DRAFT


The tagline can also be used with the call to action (CTA) ‘Call 511 | 511.org’ — with or without the logo.

You can download tagline CTA lockups at:511.org/branding

CTA CTA Stacked

511 SF BAY LOGOSF BAY LOGO W/ TAGLINE (CTA)

SF BAY LOGO W/ TAGLINE (CTA)

DRAFT


Tagline

The official 511 Tagline is: “Wherever you’re going, start here.”

Depending on the design of the piece, the tagline’s position in relation to the logo may vary. The tagline doesn’t need to be used every time the logo is used, but as much as the communication and design warrants.

You can download these files at:511.org/branding

511 LOGOMARKLOGOMARK W/ TAGLINE 1

LOGOMARK W/ TAGLINE 1

DRAFT


Tagline Doubled Stacked

511 LOGOMARKLOGOMARK W/ TAGLINE 2

LOGOMARK W/ TAGLINE 2

DRAFT


The tagline can also be used with the call to action (CTA) ‘Call 511 | 511.org’ — with or without the logo.

You can download tagline CTA lockups at511.org/511brandtoolbox.

CTA CTA Stacked

511 LOGOMARKLOGOMARK W/ TAGLINE (CTA)

LOGOMARK WITH TAGLINE (CTA)

DRAFT


The primary colors for the 511 logo is green and white. With the improvements of technology, the primary green has also been updated with a brighter tone and more saturated color.

For 2-color logos, very dark gray is used. The very dark gray is close to black, but less harsh.

White

Very Dark Gray

Green

HEX: ffffffRGB: 255, 255, 255CMYK: 0, 0, 0, 0

HEX: 221f20RGB: 34, 31, 32CMYK: 71, 67, 64, 74

HEX: 48a136RGB: 72, 161, 54 CMYK: 75, 13, 100, 1

PRIMARY COLORS

COLORSPRIMARY COLORS

DRAFT


The secondary colors are used to support the logo in web and print communications. They are not to be used for the logo.

The dark green, dark gray, and black are best used for text. The gold, pale blue, and pale gray are best used for backgrounds. HEX: 167d01

RGB: 22, 125, 1CMYK: 86, 26, 100, 15

HEX: f2d00dRGB: 242, 208, 13CMYK: 7, 14, 99, 0

HEX: 444444RGB: 68, 68, 68CMYK: 67, 60, 59, 44

HEX: d1e1ecRGB: 209, 225, 236CMYK: 16, 5, 3, 0

HEX: f1efefRGB: 241, 239, 239CMYK: 4, 4, 3, 0

HEX: 000000RGB: 0, 0, 0CMYK: 100, 100, 100, 100

Gold

Pale Blue

Pale Gray

Dark Green

Dark Gray

Black

SECONDARY COLORS

COLORSSECONDARY COLORS

DRAFT


For large sections of body copy, Univers Roman should be used. The preferred font size for print body copy is between 9pt and 11pt.

Legal copy should appear no smaller than 7pt. Headline and subhead sizing can vary by piece.

Univers Light

Univers Light Oblique

Univers Roman

Univers Roman Oblique

Univers Bold

Univers Bold Oblique

Univers Bold Condensed

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz







PRINT FONTS

FONT TYPEPRINT FONTS

DRAFT


For online applications, Oxygen and Arial are all acceptable for use. Oxygen should have first priority, followed by Arial.

Arial Regular

Arial Italic

Arial Bold

Arial Bold Italic





Oxygen Regular

Oxygen Italic

Oxygen Bold




WEB FONTS

FONT TYPEWEB FONTS

DRAFT


To ensure legibility, the 511 SFBay logo should be printed no smaller than 1.15” wide or appear on the web no smaller than 182 pixels wide.

The 511 logomark should be printed no smaller than .475” wide or appear on the web no smaller than 75 pixels wide. 182 PX1.15”

Smallest size for Print Smallest size for Web

75 PX.475”

Smallest size for Print Smallest size for Web

LOGO SIZE

LOGO SIZE

DRAFT


A clear space void of any typography ordistracting imagery and must always surround the logo. As shown to the right, the clear space is the width of the ‘5’ in ‘511.’

When a tagline is used, the clear space starts at the edges of the logo/tagline.

Clear Space

Clear Space

CLEAR SPACE

CLEAR SPACE

DRAFT


511 Modes

511 has four modes: Traffic, Transit, Rideshare and Bicycling. These are all elements of 511 and should always be referred to as “511 Traffic,” “511 Transit,” “511 Rideshare,” and “511 Bicycling.”

Modes, phone menu names, and web page names should always be capitalized, e.g., “call 511 and say ‘Rideshare.’”

On the Phone

511 provides information via a speech recognition system. After calling 511, the caller is connected to the Main Menu. Callers should always be instructedto call 511 and then say the appropriate menu choice or mode. For example: “Call 511 and say ‘Bicycling.’”

On the Web

The 511.org home page features links to the four modal pages within the 511 header. The modal pages of the website should be referred to as “pages,” not as their own sites or services.

Whenever possible, all messaging should drive usage through 511.org. For instance, messaging directing users to a modal page such as Rideshare, should include “Go to 511.org and click Rideshare.”

LANGUAGE & DESCRIPTIONSMODAL LANGUAGE

MODAL LANGUAGE

DRAFT


All web, spoken, or written communicationinvolving 511 should include the call to action:

CTA CTA Stacked

LANGUAGE & DESCRIPTIONSCALL TO ACTION

CALL TO ACTION

DRAFT


To the right are three descriptions of varying lengths and detail. These exact descriptions should be used to describe 511. The longest possible description should always be used, pending on the availability of space.

Long Description

“511 is a free phone and web service that provides transportation information for the nine-county Bay Area. 511 gives up-to-the-minute information on driving times, traffic conditions, real-time transit departures and trip planning, instant carpool and vanpool referrals, bicycling information, and more. Call 511 or visit 511.org.”

Medium Description

“511 is a free phone and web service that provides Bay Area transportation information. Call 511 or visit 511.org to get information about Traffic, Transit, Rideshare or Bicycling.”

Short Description

“511 is a free phone and web service that provides Bay Area transportation information. Call 511 or visit 511.org.”

LANGUAGE & DESCRIPTIONSSTANDARDIZED DESCRIPTIONS

STANDARDIZED DESCRIPTIONS

DRAFT


In all spoken mediums, 511 should always be referred to as “five one one” and “five one one dot org,” never “five-eleven.” In spoken or written contexts, never use the “www.” before “511.org.” It is unnecessary and adds clutter.

511 and 511.org should be referred to as a “phone service” and a “web service” respectively. Whenever possible, emphasize that 511 is a Bay Area service and free. Not just toll-free, but a free phone and web service.

LANGUAGE & DESCRIPTIONSREFERRING TO 511

REFERRING TO 511

DRAFT

For questions or more information, please contact the 511 Brand Guidelines Manager at MTC:

Shauna Callow510-817-5704

[email protected]

THANK YOU

DRAFT

brand guidelinesassets.511.org/.../more/511nextgen-branding-guide-draft.pdfconsiderations mandate,...

Documents