BRAND GUIDELINES
2
3
THE VALUE CONSISTENCYOF
Keeping your brand cohesive is essential to the professionalism and stability of the identity. In this guide you’ll find helpful tips to keep your logo usage and brand identity consistent without questioning how and when to use your new assets.
4
PRIMARY LOGO This is the main logo that will represent your brand in most instances. Using this design consistently will help audiences easily identify your business. Applying the logo with care and respect to these guidelines is essential to the professionalism of the brand. Use this logo when horizontal space is limited, and a more compact application is appropriate.
5
6
PRIMARY LOGO MARK
The primary icon features an owl, a fox, and a tree. The owl and fox represent the animals Sleeping Bear Wildlife Fund hopes to rescue and care for - animals on land and in the sky and everything in between. It also features a pine tree that is unique to Michigan’s landscape.
Use the logo mark when the primary logo is not necessary, or if the brand name is already displayed in plain text. For example, in social media profiles, favicons, or icons on website.
7
ALTERNATE LOCKUP (HORIZONTAL LOGO)
This is a wide form of the primary logo. Use this logo when vertical space is limited, and a more horizontal application is appropriate. For example, advertisements, merchandise, website navigation, signage, etc.
8
9
A. B. C. 10
SECONDARY LOGOS (ALTERNATIVE VARIATIONS)
Use these badges, or emblems, when the primary logo is not necessary, but brand name should be displayed. Use this mark when viewers are familiar with the brand. For example, use this logo on merchandise (Shirts, hats, stickers, etc), on the second page of printed materials or presentations, and as a watermark on photos.
Similar to the emblem/badge use this design when the primary logo is not necessary, or if the brand name is already displayed in plain text. Use this mark when viewers are familiar with the brand. For example, use this logo on the second page of printed materials, letterheads, presentations, or as a secondary graphic element on materials.
When the primary logos are not used, these logo variations, or alternative variations, may be used to supplement the brand in a more informal setting.
A. & B. BADGE & ALTERNATIVE BADGE
C. ALTERNATE MARK
Use these variation in place of the primary logo, and never directly next to the primary logo, as it is repetitive to the audience. These designs may present a more casual and fun approach on marketing materials.
11
POSITIONING When placing the logo, it is important to be mindful of clear space around the design. This space isolates the design without allowing other content to overcrowd, clash with, or diminish the integrity of the design. This clear space is measured by the height of the “E” in “Sleeping Bear.” When resizing, or scaling, the logo, make sure the logo is still readable at it’s smallest size. Each logo should never be used smaller than the minimum height suggested.
HEIGHT:MINIMUM0.75"
12
HEIGHT:MINIMUM0.25" HEIGHT:MINIMUM0.25" 13
ADDING A CONTAINER
CLEAR SPACE
ROTATION
Don’t change the color of the logo. Use the color options provided in the final logo files.
RESTORING MICHIGAN’S WILDLIFE PROPORTION
STYLING EFFECTS
Don’t scale, or re-size, any elements of the logo. Additionally, do not add any unofficial elements to the logo.
Don’t rotate the logo.
Don’t squish or stretch the logo to fit it into a space. Always scale proportionally or use the included variations.
Don’t add any elements to the clear space surrounding the logo.
USING COLOR VARIATIONS
RE-COLORING
Don’t contain the logo in a box on a background. Use the proper logo file to place a transparent logo background on a photo or solid color. 14
Don’t add a drop shadow or other styling effects to the logo.
Don’t put a mid-tone logo on a midtone background. Be sure to always make sure there is high contrast between the logo and it’s background.
RE-ARRANGING Don’t re-arrange parts or create new compositions of the logo. When applicable, use the secondary logos instead.
ADJUSTING ELEMENTS
15
UNACCEPTABLE USAGE Consistency with placement and use of the logo is essential to maintain the integrity of the brand. The logo should never be re-colored, altered, distorted, skewed, squished, or compromised in any way other than the recommended use outlined in this guide. Included are examples of wrong ways of using the logo, these should NEVER be done.
65
33
83
59
7
144
PRIMARY COLORS SECONDARY COLORS LIGHT
182
169
PINE
72
120
46
142
160
51
52
50
COLOR PALETTE Using color consistently is an integral part of brand identy. It reinforces cohesiveness of the brand, and psychologically communicates a feeling or message to the Thisvewer.colorpallette uses shades of green oranges and browns to represent nature. Additional secondary colors have been selected to highlight and compliment the primary colors. Consider using these additional colors in monochromatic designs. For example, layer the greens with text and icons in the three different green colors. 7 / 11 / 14 / 0 RGB: 234 / 222 / 211 HEX: #EADED3 GREEN CMYK: 44 / 14 / 47 / 0 RGB: 149 / 183 / 150 HEX: #95B796 CMYK:GREEN70/47 / 70 / 36 RGB: / / HEX: # 445746 SKY CMYK:BLUE48 / 27 / 24 / 0 RGB: 138 / 165 / HEX: # 8AA5B2 DEEP CMYK:LAKE73/58 / 51 / RGB: 68 / 79 / HEX: CMYK:BURNT#444F57ORANGE31/72/78 / 23 RGB: 147 / 80 / HEX: #93503B CMYK:SUNSHINE2/15 / / 0 RGB: 249 / 214 / HEX: #F9D690 GRAY CMYK: 30 / 30 / / 0 RGB: / / HEX: CMYK:BROWN#B6A9A0BARK46/72/ / RGB: / / HEX: CMYK:ORANGE#56332E10/64 / / RGB: / / HEX: CMYK:GREEN#DD7853FERN62/28/ / RGB: 105 / / HEX: #698E6D
221
178
0
86
WARM
109
16
87
34
69
CMYK:SAND
DEEP LAKE + ORANGE PRIMARY COLORS ORANGE + BROWN BARK SKY BLUE + SAND PINE GREEN + GREEN FERN 17
B & C. LIGHT 1-COLOR LOGO ON DARK BACKGROUND
A. FULL COLOR LOGO
When using the logos, choosing a color to use is often dependent on the background color. The logos will mostly be used in full color (A). When that isn’t an option, please use a variation (B, C, & D).
When the full color logo is not available, it is appropriate to use the one-color dark brown logo on a light brand color background, or black logo on white background. The logo mark on the dark-colored logos has been simplified to outlines, keeping the inside of the animals light.
18
This logo is the full color version. Use this full color logo on a light or white background.
LOGO COLOR USE
When the full color logo is not available, it is appropriate to use the one-color light sand logo on a dark brand color background, or white logo on black background. The logo mark on the light-colored logos have been simplieifed and filled in, and the outines are absent, to keep the inside of the animals light.
D. DARK 1-COLOR LOGO ON LIGHT BACKGROUND
19
C.A. D.B.
20
When using your logo, it’s imporant to keep high contrast from the background, and make the animals visually appealing. These are unacceptable color uses of the logo and should NEVER be done. Tips: - Keep the animals’ filled shapes a lighter color. - Never use two mid-tones on top of one another. - Keep the full-color version on a light background.
21
COLORUNACCEPTABLEUSE
Don’t place the logo over a complicated or low contrast part of the image, where details are disrupted. - both in the logo and the image.
When placing the logo, on a photo background, it is important that the photo content is not obstructed by the logo, and vise versa. The contrast between the logo and the photo background must make the logo easy to read. In most cases, it is acceptable to use a white or dark version of the logo, other brand colors may be difficult to read depending on the photo.
A. B. B. ADD A DARK OVERLAY
A. BE MINDFUL OF CONTENT
PHOTO BACKGROUND
Do add a black transparent overlay when necessary over the photo, and under the logo. This is useful on website pages, presentation decks, marketing materials, etc.
22
23
TYPOGRAPHY
24
Use these fonts consistently with proper styling and usage across all applications for a strong brand identity. Indecise and Montserrat are used in the logo, although they have been slightly modified to create a more custom look. Indecise Bold can be purchased from myfonts.com.
ABCDEFGHIJKLMNOPQRSTUVWXYZ ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ
BOLDINDECISE UseUPPERCASEforheadlines EXTRAMONTSERRATBOLD UseSentenceMEDIUMMONTSERRATUseUPPERCASEforsub-headlinescaseforbodycopy
Montserrat Extra Bold & Medium can be downloaded from fonts.google.com for free. It’s also available to use on Canva.
SLEEPING BEAR WILDLIFE FUND RESTORING MICHIGAN’S WILDLIFE Riandae odi si serit mi, cum quaectur mi, officip suntio blandandusda pedit occus, quis sedit dolutectum fugit eaquodia aboreperum et occumet aut exerferum. Doluptatem aut atem volendit, cus pore voloritaquas dollest, nihilit, cone volut velit est fugit pa il im eossiti atquaes esequi temporio doluptati voluptae nonse pos que nonsequi aut deles dolenis alibusciis eosapelic to blaborepta sincil ma quo idus, quaturectum quaturecum quam quias etures voloriam aut quam harchit faccupt aerferae volorem sam voluptas placeped que officaborum. HEADLINE SUB-HEADLINE BODY TEXT 25
APPLICATIONSSAMPLE
These are examples of your brand identity across various platforms. WINDOW SIGNAGE MOCKUPSOCIAL MEDIA PROFILE IMAGE PEN MOCKUP 26
WEBSITE MOCKUP ADVENTURE PATCH / EMBROIDERY MOCKUP T-SHIRT MOCKUP SIGNAGE MOCKUP 27
PRINT APPLICATIONS (CMYK COLORS)
When viewing your designs online or on a screen (video, website, TV, phone, tables, etc.), these devices use three colors, Red, Green, and Blue (RGB) to create the colors in the design. Use RGB files for designs viewed on mobile devices, tablets, television, computers, videos, websites, social media, etc.
28
The logos files you receive are broken down into two categories, print vs. web, because the color profiles are slightly different for each application.
WEB APPLICATIONS (RGB COLORS)
USING THE LOGO FILES
When printing designs, a digital printer typically uses four process colors Cyan, Magenta, Yellow, Black (CMYK) to create the colors in the design. Use CMYK files for advertisement, signage, merchandise, letterheads, business cards, brochures, magazines, etc.
JPG FILE A .jpg is a common compressed image file. This file format is not meant to be scaled up, as it loses quality. It automatically has a white background flattened with the design.
PDF FILE A .pdf file is very common and can contain infinitely scalable, high-resolution vector designs when opened with editing software (Adobe programs). It can be saved with a transparent background.
PNG FILE A .png file is common in web applications. It is similar to a jpeg file in quality, but it can contain a transparent background. It’s not recommended to scale up png files as they lose quality. 29
EPS FILE An .eps is a vector file that is infinitely scalable and high-resolution with a transparent background. It can only be used in specific software including Adobe programs.
MOVING FORWARD Refer back to this guide when questioning how to use your new brand elements and even reach out for help (meow@pipandcricket.com). This guide allows for enough flexibility for you to use your new elements how you see fit, with staying consistent across all platforms.
30
31
© PIP & CRICKET LLC 2022 | MEOW@PIPANDCRICKET.COM | PIPANDCRICKET.COM