CONNECT ENRICH EDUCATE SAVE
Section /Title
TABLE OF CONTENTS
2
01 HISTORY 7 9
Ethos History
05 VISUAL LANGUAGE 34 36 38
Patterns Photographic style Image Treatment
02 LOGO 12 Logo Lockup 14 Clearzone & Sizing 16 Incorrect Logo Usage
06 STATIONERY SYSTEM 44 Letterhead 46 Business CardsIm 48 Envelope
03 COLOURS 22 Primary Colours 22 Secondary Colours 24 One Colour
04 TYPOGRAPHY 30 Typeface Family 30 Application Examples
07 APPLICATIONS 52 66 68 72 76 78 80 81 82
Desktop / Mobile Website Native Application Digital Advertising Print / Outdoor Campaign Front Entry Spatial Design Wayfinding System Animal Information Panel Transportation Wrap Design Children’s T-shirt Design
Section /Title
4
Section /Title
HISTORY 5
OUR ETHOS / THE FUNDAMENTAL CHARACTER OR SPIRIT OF A CULTURE; THE UNDERLYING SENTIMENT THAT INFORMS THE BELIEF, CUSTOMS, OR PRACTICES OF A GROUP OR SOCIETY. OUR ETHOS COMMUNICATES THE ESSENCE OF WHO WE ARE AT THE SANTA BARBARA ZOO. WHAT WE BELIEVE WE ARE KNOWN FOR & WOULD LIKE TO BE KNOWN FOR.
THE SANTA BARBARA ZOO is dedicated to the preservation, conservation, and enhancement of the natural world and its living treasures through education, research, and recreation.
7
HISTORY / BEFORE THE DEVELOPMENT OF THE SANTA BARBARA ZOO, THE PROPERTY WAS OWNED BY A STRONGWILLED NEW ENGLAND WOMAN NAMED MRS. CHILD.
Lockup
1947
1935 Before the development of the Santa Barbara Zoo, the property was owned by a strong-willed New England woman named Mrs. Child. She had been a gracious hostess at the social galas for which Vegamar was famous, and she became an equally gracious hostess to a community of “knights on the road,” homeless pensioners who lived in shacks on her property. Around 1935, a few men, victims of the Depression, stopped for awhile on Mrs. Child’s property. To the chagrin of local authorities she didn’t drive them off, but instead allowed them to settle there and eventually to build a permanent, self-policed community. She offered her estate to the Santa Barbara Foundation, to be disposed of upon her death in such a fashion benefiting the community.
The Foundation accepted her gift, and in 1947, took over the deed to Vegamar. In September 1953, Foundation President Archie M. Edwards recommended the Foundation make the Child Estate a gift to the City for use as a park. The Trustees concurred, and in October 1953, Edwards presented the City with the deed to the Child Estate property. Edwards commented, “Since this is the 25th anniversary of the incorporation of the Santa Barbara Foundation, this might be considered a birthday gift in reverse.”
1963 In August 1963, the Santa Barbara Zoological Gardens opened its doors to the public and has continued to serve and fulfill this mission: preservation, conservation, and enhancement of the natural world and its living treasures through
Logo Development 9
Section /Title
10
Section /Title
LOGO 11
LOGO / A RECOGNIZABLE GRAPHIC DESIGN ELEMENT, OFTEN INCLUDING A NAME, SYMBOL OR TRADEMARK, REPRESENTING AN ORGANIZATION
Lockup
LOCKUP The placement and alignment of mark elements. For each signature mark, these components must remain in the specified structure and should not be altered.
Logo Development 13
LOCKUP, CLEARZONE & SIZING/ TO MAINTAIN THE INTEGRITY AND HEART OF SANTA BARBARA ZOO IDENTITY, WHEN WORKING WITH THE SIGNATURE MARKS IT IS CRUCIAL TO ADHERE TO THE CLEARZONE
SIZING
The clearzone is the spacing around each signature mark where no other element is allowed to enter. It is proportional to whatever the size of the logo.
The minimum size specified is to ensure the impact and readability of the signature marks. Reducing the size too much would be illegible.
Clearzone / Sizing
CLEAR ZONE x
x
x
x x
x
x
x
x-height
MINIMUM SIZES Web
162px
0.90in
109px
Native App
0.65in
Mobile
0.90in
0.54in
58px
70px 50px
58px
0.39in 0.65in
Logo Development 15
INCORRECT LOGO USAGE / IT IS IMPORTANT THAT THE APPEARANCE OF THE LOGO REMAINS CONSISTENT. THE LOGO SHOULD NOT BE MISINTERPRETED, MODIFIED, OR ADDED TO. LOGO MISUSE No attempt should be made to alter the logo in any way. Its orientation, colour and composition should remain as indicated in this document — there are no exceptions.
Incorrect Logo Usage
Do not apply a gradient to the icon or wordmark.
Do not distort or warp the logo in any way.
Do not rotate the logo.
Do not outline or create a keyline around the logo.
Do not change the logo colour or tone outside of the brand colors.
Do not change the typeface nor recreate or manipulate the wordmark and the icon.
Logo Development 17
Section /Title
18
Section /Title
COLOURS 19
Section /Title
COLOUR IS A POWERFUL MEANS OF IDENTIFICATION. CONSISTENT USE OF THE SANTA BARBARA ZOO LOGO COLORS WILL HELP BUILD VISIBILITY AND RECOGNITION FOR THE BRAND AND WILL SET US A PART FROM OUR COMPETITORS.
20
Colours 21
LOGO MISUSE / IT IS IMPORTANT THAT THE APPEARANCE OF THE LOGO REMAINS CONSISTENT. THE LOGO SHOULD NOT BE MISINTERPRETED, MODIFIED, OR ADDED TO. SPOT COLOR
RGB
Spot (Pantone) color is a special premixed ink that is used instead of, or in addition to, process inks, and that requires its own printing plate on a printing press. Use spot color when few colors are specified and color accuracy is critical.
RGB (red, green, and blue) refers to a system for representing the colors to be used on a computer display. Red, green, and blue can be combined in various proportions to obtain any color in the visible spectrum.
CMYK
HEXADECIMAL
When it is not feasible or cost-effective to print the spot color logo, use the 4-color process logo. To reproduce a color image, a file is separated into four different colors: Cyan (C), Magenta (M), Yellow (Y) and Black (K).
A hex triplet is a six-digit, three-byte hexadecimal number used in HTML, CSS, SVG, and other computing applications to represent colors. The bytes represent the red, green and blue components of the color.
Primary & Secondary
PRIMARY COLOURS
SECONDARY COLOURS
Pantone: PMS 2995 C CMYK ( 100, 0, 0, 0) RBG ( 0, 174, 239) HEX #00adef
Pantone: PMS 102 C CMYK ( 0, 0, 100, 0) RBG ( 255, 242, 0) HEX #fff100
Pantone: PMS 388 C CMYK ( 30, 0, 100, 0) RBG ( 191, 215, 48) HEX#bed62f
Pantone: Orange 021 C CMYK ( 0, 76, 85, 0) RBG ( 220, 198, 63) HEX #f05a22
Pantone: PMS 109C CMYK ( 0, 20, 100, 0) RBG ( 255, 203, 5) HEX #ffcb04 100%
GREY TONES
70%
40%
20%
Colours 23
BLACK & WHITE / ACROSS APPLICATIONS, EVERY EFFORT SHOULD BE MADE TO USE THE FULL COLOR SANTA BARBARA ZOO LOGO. HOWEVER, IN INSTANCES WHERE ONLY ONE COLOR IS AVAILABLE FOR PRINTING, USE THE SIMPLE ONE-COLOR BLACK AND WHITE OPTIONS TO THE RIGHT.
One Colour
Colours 25
Section /Title
26
Section /Title
TYPOGRAPHY 27
TYPOGRAPHY IS AN ART FORM THAT CAN MANIPULATE THE SIGNIFICANCE OF WHAT IT COMMUNICATES. DUE TO ITS EFFECTS ON THE CONTEXT OF COMMUNICATION, UNDERSTANDING TYPOGRAPHY IS ESPECIALLY IMPORTANT WHEN DEVELOPING A BRAND IDENTITY.
GIFFAFE / LEOPARD / ELEPHANT / LION / FLAMINGO / KOALA / CONDOR / PARROT / GIBBON / MEERKAT / ALIGATOR / Typography 29
FRUTIGER & ALLER DISPLAY / IS SANTA BARBARA ZOO’S PRIMARY TYPEFACE. MODERN, FLEXIBLE AND EASY TO READ, FRUTIGER IS UNIQUELYSUITED FOR A WIDE RANGE OF VISUAL COMMUNICATIONS. MULTIPLE LEVELS OF TYPOGRAPHIC HIERARCHY ARE DEFINED BOTH FOR IMPACT AND CLARITY OF OUR COMMUNICATIONS.
Frutiger & Aller Display
ALLER DISPLAY
A B CD E FG H I J K L M N O P Q R S T U V W X Y Z 1 2 3 4 56789!@#$%^& * ( ) - = _ + [ ]{ } <>
FRUTIGER LIGHT abcdefghijklmnopqrstuvwxyz 123456789!@#$%^&*()-=_+[]{}<>
FRUTIGER BOLD abcdefghijklmnopqrstuvwxyz 123456789!@#$%^&*()-=_+[]{}<>
FRUTIGER ROMAN abcdefghijklmnopqrstuvwxyz 123456789!@#$%^&*()-=_+[]{}<>
FRUTIGER BLACK abcdefghijklmnopqrstuvwxyz
Title
MISSION & VISION
Subtitle
Engage. Education. Save
Body Copy
The Santa Barbara Zoo is dedicated to the preservation, conservation, and enhancement of the natural world and its living treasures through education, research, and recreation.
Typography 31
Section /Title
32
Section /Title
VISUAL LANGUAGE 33
Patterns
34
Visual Language
Patterns
Visual Language 35
Photographic Style
36
Visual Language
Photographic Style
Visual Language
37
Image Treatment
38
Image Treatment
+
+
39
Section /Title
STATIONERY SYSTEM 40
Section /Title
41
STATIONERY SYSTEM / COMMERCIALLY MANUFACTURED WRITING MATERIALS, INCLUDING CUT PAPER, ENVELOPES, WRITING IMPLEMENTS, CONTINUOUS FORM PAPER, AND OTHER OFFICE SUPPLIES OR PRODUCT.
Stationery System 43
Letterhead
Standard Letter Size 8.5â&#x20AC;? x 11â&#x20AC;?. Back of the stationery is custom pattern at 10% opacity.
44 Stationery System
Letterhead
Stationery System 45
Business Card
46
Stationery System
Business Card
Stationery System 47
Envelope
Envelope shown at 50% of original size. The outside of envelop is the custom pattern at 30%. Envelope form is #10 Squareflap Envelope
48
Stationery System
Envelope
Stationery System 49
Section /Title
50
APPLICATIONS
Section /Title
51
Website Desktop
A web desktop or webtop is a desktop environment embedded in a web browser or similar client application. The browser is primarily used for display and input purposes. In popular use, web desktops are sometimes referred to incorrectly as a web operating system or simply a Web OS.
52
Digital Applications
Responsive Mobile Application
Digital Applications 53
Website Desktop
54
Digital Applications
Website Desktop
Digital Applications 55
Website Desktop
56
Digital Applications
Website Desktop
Digital Applications 57
Website Desktop
58
Digital Applications
Website Desktop
Digital Applications 59
Website Desktop
60
Digital Applications
Website Desktop
Digital Applications 61
Website Desktop
62
Digital Applications
Website Desktop
Digital Applications 63
Responsive Mobile Application
A responsive website automatically changes to fit the device youâ&#x20AC;&#x2122;re reading it on. Typically there have been four general screen sizes that responsive design has been aimed at: the widescreen desktop monitor, the smaller desktop (or laptop), the tablet and the mobile phone.
64
Digital Applications
Responsive Mobile Application
Digital Applications 65
Native Mobile Application
A native mobile app is a smartphone application that is coded in a specific programming language, such as Objective C for iOS or Java for Android operating systems. Native mobile apps provide fast performance and a high degree of reliability. The Santa Barbara Zoo takes great pride in being a eco-concious zoo, creating the native mobile app will allow the Zoo to use less paper to help the environment.
66
Digital Applications
Native Mobile Application
Digital Applications
Digital Advertising
Digital marketing is the marketing of products or services using digital technologies, mainly on the Internet, but also including mobile phones, display advertising, and any other digital medium.
68
Digital Applications
Digital Advertising
Digital Applications 69
Promotional Campaign
70
Digital Print Applications Applications
Promotional Campaign
Print Applications 71
Promotional Campaign
72
Digital Print Applications Applications
Promotional Campaign
Print Applications 73
Street Pole SIgnage
74
Print Applications
Street Pole SIgnage
Print Applications 75
Front Entry Signage & Building Treatment
76
Print Applications
Front Entry Signage & Building
Print Applications 77
Wayfinding System
ocean
Feeding Experience
Cabrillo Lawn
Palm Garden
Hilltop
The Wave
Barnyard Feeding Experience
Stage
Explore Store
Tiny's Mining Camp Kallman Family Play Area & Childrenâ&#x20AC;&#x2122;s Garden
Climbing for Condors
The Dreier Family Elephant Junction
Train Station
mountains
Rainforest Passage Eeeww!
Souvenir Photos
Ridley-Tree House Restaurant
Discovery Pavilion Administration Lost & Found
Gift Store ENTRANCE
78
Print Applications
Wayfinding System
Print Applications 79
Animal information Panel
80
Print Applications
Transportation Wrap
Print Applications 81
Childrenâ&#x20AC;&#x2122;s T-shirt Design
82