VISUAL STANDARDS GUIDE
CONTENTS 01 Brand Strategies A. Introduction
05 Photo 1
A. Photo Style
1
B. Original Photos
2
06 Graphic Elements
1
02 Identity A. Description
4
B. Logo Amatomy
6
C. Alternate Versions
7
D. Unacceptable Usages
10
03 Type A. Type Example
11
B. Type Introductions
13
C. Type Scales
14
D. Type In Use
15
04 Color A. Color Source
11
B. Color Palette
13
07 Application A. Grids
4
B. Stationery
6
C. Posters
7
D. App
10
INTRODUCTION
Many streets of San Francisco don’t have bicycle lanes. Safety is a big concern. Bicycle accidents often happen in San Francisco. San Francisco Bicycle Safety Company will protect cyclists safety on the road. The brand will thought education to protect cyclists. We aim to reduce the death rate and injuries amongst cyclists in San Francisco.
INTRODUCTION
AUDIENCE
My target Audience is 20 to 35-year-old urban young people in San Francisco. These people have a passion for cycling, and they like the feeling of freedom on the streets. But it’s also easy to break the bicycle rules.
IDENTITY
Our mission is to protect San Francisco urban cyclists safety. Raise awareness of the safety of cycling. The story behind the our logo is the idea come from street sign and yellow and black caution stripe. We separate logo as two parallelograms. First one on the top is yellow background, black color on type “San Francisco”, and the parallelogram has 30-degree shear X angle. The second one on the bottom is black background, yellow color on type “ Bicycle Safety”, parallelogram has 30-degree shear X angle too. An inclination of 30 degrees indicates a body movement when riding a bike.
02
LOGO AMATOMY
Our mission is to protect San Francisco urban cyclists safety. Raise awareness of the safety of cycling. The story behind the our logo is the idea come from street sign and yellow and black caution stripe. We separate logo as two parallelograms. First one on the top is yellow background, black color on type “San Francisco”, and the parallelogram has 30-degree shear X angle. The second one on the bottom is black background, yellow color on type “ Bicycle Safety”, parallelogram has 30-degree shear X angle too. An inclination of 30 degrees indicates a body movement when riding a bike.
53.5X 12.5X
11.5X
X 29X 10.5X
9X
SAN FRANCISCO 10.5X 10.5X
9X
BICYCLE SAFETY 10.5X 29X X
X
30ยบC
30-degree shear X angle
X
X is the empty square and space
Alternate Versions
Minimum Size
Signature
SAN FRANCISCO
SAN FRANCISCO BICYCLE SAFETY
SAN FRANCISCO BICYCLE SAFETY
SAN FRANCISCO BICYCLE SAFETY
Signature on the backgroud
SAN FRANCISCO BICYCLE SAFETY
BICYCLE SAFETY
0.6inch
Alternate Versions
Signature on the backgroud
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
Application
Bykzone App
Bykzone
Bykzone
Bicycle Safety Festival
BICYCLE SAFETY FESTIVAL
BICYCLE SAFETY FESTIVAL
BICYCLE SAFETY FESTIVAL
BICYCLE SAFETY FESTIVAL
Unacceptable Usages
SAN FRANCISCO BICYCLE SAFETY
TY
E SAFE
BICYCL
No stretching of the logo.
O
ANCISC
SAN FR
No tilting or re-orientation of the logo.
SAN FRANCISCO BICYCLE SAFETY
Don’t cast a shadow for the logo
SAN FRANCISCO BICYCLE SAFETY
Don’t placement for the logotype.
Don’t use 3D effects on the logo.
SAN FRANCISCO BICYCLE SAFETY
Don’t use random font for logotype.
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
Don’t use any other color on the logo.
Don’t put the logo on high contrast texture or imagery.
TYPE
Our mission is to protect San Francisco urban cyclists safety. Raise awareness of the safety of cycling. The story behind the our logo is the idea come from street sign and yellow and black caution stripe. We separate logo as two parallelograms. First one on the top is yellow background, black color on type “San Francisco”, and the parallelogram has 30-degree shear X angle. The second one on the bottom is black background, yellow color on type “ Bicycle Safety”, parallelogram has 30-degree shear X angle too. An inclination of 30 degrees indicates a body movement when riding a bike.
03
Type Example
BICYCLE RULES If you’re moving as fast as traffic, you can ride wherever you want.
DINCond-Bold
Mercury Display
Chaparral Pro
If you’re moving slower than traffic, you can still “take the lane.” The law says that people who ride bikes must ride as close to the right side of the road as practicable except under the following conditions: when passing, preparing for a left turn, avoiding hazards, if the lane is too narrow to share, or if approaching a place where a right turn is authorized. CVC 21202. Unfortunately, some motorists and even police don’t understand cyclists’ right to “take the lane.” If you have a legal problem based on this understanding, consider calling one of the bike-friendly lawyers we identify on our “Crash Help” page. Use the bicycle lane. On a roadway with a bike lane, bicyclists traveling slower than traffic must use the bike lane except when making a left turn, passing, avoiding hazardous conditions, or approaching a place where a right turn is authorized. CVC 21208 R ide with traffic. Bicyclists must travel on the right side of the roadway in the direction of traffic, except when passing, making a legal left turn, riding on a one-way street, riding on a road that is too narrow, or when the right side of the road is closed due to road construction. Mopeds and high-speed electric bikes are not like regular bikes. Gas-powered bicycles and type 3 electric bicycles (with top assisted speeds of 28 mph) may not be used on trails or bike paths or lanes unless allowed by local authorities. They may be used in bike lanes or separated bikeways adjacent to the roadway. CVC 21207.5 They require helmets and may not be operated by people under age 16.
Type Introductions
DINCOND-BOLD DIN 1451 is a sans-serif typeface that is widely used for traffic, administrative and technical applications. It was defined by the German standards body DIN - Deutsches Institut für Normung (German Institute for Standardization) in the standard sheet DIN 1451-Schriften (typefaces) in 1931. Originally designed for industrial uses, the first DIN-type fonts were a simplified design that could be applied with limited technical difficulty. Due to the design’s legibility and uncomplicated, unadorned design, it has become popular for general purpose use in signage and display adaptations. Many adaptations and expansions of the original design have been released digitally. The typeface was adopted by Germany in 1936 as a standard known as DIN 1451 (DIN is an acronym for Deutsches Institut für Normung—in English, the German Institute for Standardization). The typeface became a standard for traffic signs, street signs, house numbers and license plates. Over the next decades the typeface also found use on various household goods and products, making it synonymous with German design.
DIN Condensed Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890 abcdefghijknopqrstuvwxyz‘?’“!”(%) # DIN Pro
ABCDEFGHIJKLMNOPQRSTUV W X Y Z1234567890 abcdefghijknopqrstuvwxyz‘?’“!”(%)# DIN-BlackItalic
ABCDEFGHIJKLMNOPQRSTUVWXYZ12 34567890 abcdefghijknopqrstuvwxyz ‘? ’“!”( %)# DIN-MediumItalic
ABCDEFGHIJKLMNOPQRSTUV WXYZ123 4567890 abcdefghijknopqrstuvwxyz ‘? ’“!”(%) # DIN (OTF)
ABCDEFGHIJKLMNOPQRSTUV W X Y Z 1234567890 abcdefghijknopqrstuvw xyz‘?’“!”(%)#
Type Introductions
Mercury Display The signature typeface we designed for Esquire magazine began its life as a would-be historical revival, but developed into one of our most avowedly modern type families. During its initial design exploration, Mercury was envisioned as a revival of the work of Johann Michael Fleischman (1701-1768), a German punchcutter denizened in Amsterdam, whose unrevived typefaces had so expressively captured the drama and tension of the Dutch baroque. As Mercury’s design developed, it began to draw upon the work of other contemporary punchcutters: both the sparkling display faces of Jacques-François Rosart (1714-1774), and the progressive italics of Pierre Simon Fournier (1712-1768), were inspirations in Mercury’s evolving design. The more time we spent with these historical models, the more it became clear that none of them truly possessed the qualities that were so exciting about the genre as a whole. As a collection, these faces were vibrant: tightly wound, yet quiet, using the tension between introverted and extroverted gestures — and between black letterforms and their white counters — to create a sort of “excited calm” on the page. It was these qualities that we hoped to capture in Mercury, so ultimately we chose to ignore the dictates of historical form and follow a more personal and expressive path instead.
Mercury Display SemiBold
A BCDEFGHIJK LMNOPQ RSTUV WXYZ1234567890 abcdefghijknopqrstuvwxyz‘? ’“!”(%)#
Mercury Display Italic
BCDEFGHIJKLMNOPQRSTU V W XY A Z1234567890 abcdefghijknopqrstuvwxyz‘? ’ “! ”(%)#
Type Introductions
Chaparral Pro Chaparral Pro is a slab-serif typeface designed by Carol Twombly of Adobe Systems and released in 2000. Chaparral Pro is available in 32 fonts, including a huge range of weights and styles such old-style and lining figures. Chaparral Pro takes us back to the 16th century to the book lettering fonts that were popular in the days when mass printing was in its relative infancy. The slab serif was no accidental design addition of the day; it was a functional feature of the glyphs in a character set that leads the eye along the invisible baseline for the lower serifs. This functionality applies to any serif font, but even more so to slab serifs. In more recent times, the invention of the typewriter heralded the ability for anyone who could afford one of these cheap machines to print rather than handwrite everything; the typefaces on these machines were invariably serifs and typically used the roman style. Claude Garamond was among the first to popularize use this typeface design in the 16th century. Printers of the day were moving away from the narrower Jensen-style roman typefaces and exploring wider character glyphs while still retaining the characteristic serifs and ligatures in common use at the time. Twombly captured the essence of this style and design to provide a more contemporary version that has a warmer and more articulate feel to it. This is hardly surprising considering that Twombly has her roots in art and design and regularly enjoys these pursuits such as painting with a passion outside of her award-winning contributions to typography. Chaparral Pro is true to its origins and still conveys a times sense of class and has now become a popular standard for many print applications. Due to the broad range of available styles, Chaparral Pro performs as a workhorse, succeeding in the smallest optical sizes, up to large heavy headlines that boldly convey their message.
Chaparral Pro Regular
BCDEFGHIJKLMNOPQ A RSTUV W X YZ1234567890 abcdefghijknopqrstuvwxyz ‘? ’ “ ! ”(% )# Chaparral Pro Light Italic
A BCDEFGHIJK LMNOPQR ST U V W X YZ 1234567890 abcdefghijknopqrstuvwxyz ‘? ’ “ ! ”( %)# Chaparral Pro Italic
A BCDEFGHIJKLMNOPQRSTU V W X YZ 1234567890 abcdefghijknopqrstuvwxyz ‘? ’ “ ! ”( %)# Chaparral Pro Bold Italic
ABCDEFGHIJKLMNOPQ RSTUV W X YZ1234567890 abcdefghijknopqrstuvwxyz ‘? ’ “ ! ”( %)#
COLOR
The color palette is extraxted from the street warning sign. Yellow and black stripe from the street sign too. Use the color from the street is make sense for the project. It will attract people pay attention on this project.
04
Color Palette
Safety Yellow
Safety Pink
C= 0 M=10 Y=100 K=0 R= 260 G= 200 B=0
C= 0 M=100 Y=20 K=0 R= 250 G= 30 B=120
Safety Black
Safety Grey
C= 70 M=60 Y=70 K=70 R= 50 G= 40 B=40
C= 50 M=40 Y=40 K=0 R= 140 G= 140 B=140
PHOTO
San Francisco Bicycle Safety is using photo of San Francisco urbran city street and urbran cyclists. All the photos we using are original photography work. Our photo style is blackand-white format combine with yellow color layer with multiply effect on the photo.
05
ORIGINAL PHOTO San Francisco Bicycle Safety is using photo of San Francisco urbran city street and urbran cyclists. All the photos we using are original photography work. Our photo style is blackand-white format combine with yellow color layer with multiply effect on the photo.
SEE AND BE SEEN
PHOTO WITH STYLE San Francisco Bicycle Safety is using photo of San Francisco urbran city street and urbran cyclists. All the photos we using are original photography work. Our photo style is blackand-white format combine with yellow color layer with multiply effect on the photo.
10
GRAPHIC ELEMENTS
06
GRAPHIC ELEMENTS
The pink circle is the pop out color in the bicycle safety visual system. This pink circle represent cyclist’s love and passion of cycling. And also using on the top 10 bicycle laws.
The main graphic elements using in this project is parallelogram. In these two parallelograms all has 30 degree shear X angle. This 30 degree tilt represent the act of leaning forward when people riding a bicycle. Black and yellow color is come from the street sign. Improve people’s awareness of bicycle safety.
Black and yellow color is come from the street sign. Improve people’s awareness of bicycle safety.
APPLICATION
07
POSTERS
POSTERS
CAMPAIGN Cyclists get together at an outside location. They can talk face to face, get service there and make new friends. This attracts attention to the need to ensure bicycle safety.
KNOW MORE INFO
KNOW MORE INFO
www.sanfranciscobicyclesafety.com
www.sanfranciscobicyclesafety.com
SF_Bicycle_Safety
SF_Bicycle_Safety
SanFranciscobicycle Safety Project
SanFranciscobicycle Safety Project
BICYCLE SAFETY
BICYCLE SAFETY
SAN FRANCISCO
SAN FRANCISCO
KNOW MORE INFO SanFranciscobicycle Safety Project SF_Bicycle_Safety www.sanfranciscobicyclesafety.com
SAN FRANCISCO BICYCLE SAFETY
Bicycle Safety Pin
PINS
RIDE ON THE RIGHT SIDE OF THE ROAD
RIDE ON THE RIGHT SIDE OF THE ROAD
RIDE ON THE RIGHT SIDE OF THE ROAD
SAN FRANCISCO
SAN FRANCISCO
SAN FRANCISCO
BICYCLE SAFETY
BICYCLE SAFETY
BICYCLE SAFETY
PROUDCTS Bicycle Safety Pin
BICYCLE SAFETY HELMET Flat Paper bicycle helmet
CAMPAIGN ID
GUEST
ALMA Graphic Designer
GUEST
HAMDA Graphic Designer
BROCHURE
TOP 10 BIKE LAWS
SAN FRANCISCO BICYCLE SAFETY
RIDE 2 WITH TRAFFIC
RIDE ON THE RIGHT SIDE OF THE ROAD
CVC is the California Vehicle
Ride in the same direction as traffic. If
Code. The California Vehicle Code contains almost all statutes relating to the operation, ownership and registration of vehicles (including bicycles) in the state of California in
traveling in the opposite direction of a one way street, walk your bicycle on the sidewalk (CVC 21650).
If you are riding as fast as traffic, you can ride in the traffic lane. In most cases, you will be moving slower than traffic. Then you must ride as close as practicable to the right side curb or the edge of the roadway.
CYCLISTS MUST FOLLOW THE CVC 1
the United States. It also contains statutes concerning the California Department of Motor Vehicles and
Several important exceptions in the Vehicle Code allow you to “take the lane.” These exceptions are : (1) overtaking and
the California Highway Patrol.
passing another bicyclist, (2) preparing to take a left turn, and (3) when “reasonably
As a general rule, bicyclists have the same duties and reponsibilities as
necessary to avoid conditions... that make it unsafe to continue to ride along the righthand curb or edge,” such as pedestrians
vehicle drivers. Thus, stop at stop signs and red lights just like all other vehicles (CVC 21200).
walking in the roadway (CVC 21202).
TOP CALIFORNIA BIKE LAWS
CONTENTS
INTRODUCTION
INTRODUCTION
03
TOP 10 CALIFORNIA BIKE LAWS
06
1. Cyclists must follow the cvc
07
2. Ride with traffic
10
3. Ride on the right side of the road
11
4. Use bike lanes
12
5. Stop at, Not in, the crosswalk
13
6. Yield to pedestrians
14
7. Ride with lights and reflectors at night
15
8. Under 18, Wear a Helmet
16
9. One Ear Not Covered
17
10. No Tall Bikes on Roadways
18
Though this booklet, we hope to raise awareness of the urgent need for motorists to be mindful of bicyclists and pedestrians. We also want to provide information for bicyclists and pedestrians on their legal rights and responsibilities. We all benefit by looking out for each other and sharing the road.
San Francisco Ranks as one of the most walkable cities in the U.S. It’s also a very bicycle friendly city. Tens of thousands of bicyclists take an estimated 82,000 daily bicycle trips. Unfortunately, The city is also home to some of the most dangerous intersections for pedestrians and cyclists in California. The California Vehicle Code contains almost all statutes relating to the operation, ownership and registration of vehicles (including bicycles) in the state of California in the United States. It also contains statutes concerning the California Department of Motor Vehicles and the California Highway Patrol.
USE BIKE LANES 4
3
10
Each year more than 800 people are hit by cars in The City. In 2015, 31 people were killed in traffic collisions in San Francisco, including 21 pedestrians and 4 cyclists. The top three causes of fatal collisions were drivers failing to yield to pedestrians (29%), drivers speeding (26%), and drivers running red lights (13%).
If you are riding as fast as traffic, you can ride in the traffic lane. In most cases, you will be moving slower than traffic. Then you must ride as close as practicable to the right side curb or the edge of the roadway. Several important exceptions in the Vehicle Code allow you to “take the lane.” These exceptions are : (1) overtaking and passing another bicyclist, (2) preparing to take a left turn, and (3) when “reasonably necessary to avoid conditions... that make it unsafe to continue to ride along the righthand curb or edge,” such as pedestrians walking in the roadway (CVC 21202).
5
YIELD TO PEDESTRIANS Pedestrians should always use marked crosswalks when crossing a roadway. But even if they do not, bicyclists must exercise due for the safety of any pedestrian on a roadway (CVC 21954).
BROCHURE
UNDER 18, WEAR A HELMET
7
8
STO NOT CRO
6
RIDE WITH LIGHTS AND REFLECTORS AT NIGHT
When riding at night, you or your bike must be equipped with a white light that is visible from a distance of 300 feet in front of the bike. The bike must also have: A red reflector or a solid or flashing red light with a built-in reflector on the rear that is visible from a distance of 500 feet,
Crosswalks bicycles (CV
If you are under age 18, you must wear an approved helmet when riding. If you are 18 and older, a helmet is not required. Do not risk a life-threatening head injury in a bike crash: always wear a helmet (CVC 21212).
A white or yellow reflector on each pedal, shoe, or ankle visible from the front and rear of the bicycle from a distance of 200 feet, and A white or yellow reflector on each side forward of the center of the bicycle, and a white or red reflector on each side to the rear of the center of the bicycle, unless your bike has front and rear reflectorized tires (CVC 21201(d)).
ONE EAR NOT COVERED
10 The bike must be of a size that the bicyclist can stop, support it in an upright position with at least one foot on the ground, and start in a safe manner (CVC 21201(c)).
9
NO TALL BIKES ON ROADWAYS
PLEA
ht
S
w
Bicyclists are not allowed to wear earplugs in both ears or a headset covering both ears. (CVC 27400).
5
OP AT, T IN THE OSSWALK
are for pedestrians, not cars or VC 21455).
ASE FOLLOW US
ttps://www.facebook.com/sanfranciscobicyclesafe-
f_bicycle_Safety
www.sanfranciscobicyclesafety.com
BYKZONE APP
BYKZONE APP
BYKZONE APP
User Testing
08
User Testing
User Testing
User Testing
Design
Xingchen (Star) Chen 04042031
Course
School of Graphic Design Thesis 2-Exploration- Spring 2017 Academy of Art University
Instructor
Phillip Hamlett
SAN FRANCISCO BICYCLE SAFETY