Santa Barbara Zoo Brand Book

Page 1

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

Print

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� x 11�. 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’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’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’s T-shirt Design

82


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.