Episode 76 - Create your First Brand Style Guidelines

The Podcast

Show Links

• JadePuma Brand Style Guidelines - https://jadepuma.com/pages/brand-guidelines
• Brand Style Guidelines Section - https://jadepuma.com/blogs/shopify-tutorials/brand-guidelines-section-for-the-flex-theme 

Help the Podcast

• Apply for a Shopify Store Consult - https://jadepuma.com/pages/podcast-consult-application
• Try our Linear Shopping Experiences app - https://apps.shopify.com/linear-shopping-experience 

Transcript

Hey, Scott Austin here. 

In this episode, I'm going to explain how to create the first brand style guide for your business.  And I'll give you a tool to help you document your brand right in your store.  So this episode is focused on those Shopify stores that haven't thought much about their brand.  So let's dig into the basics.

Let's start by defining what a brand style guide is.  A brand style guide is a document that explains how your business wants to present itself to your customers through its logo, fonts, color palettes, photography, iconography and much more. This document is a reference tool for everyone on your team and for vendors you bring into your business to know what the brand rules are so that everyone can consistently support the brand.  Using a brand style guide ensures that your brand looks and feels the same to your customers, even when you have different people working on customer service, marketing, design and sales.

The brand style guide can also be referred to as the brand book, brand guidelines, the brand bible or any number of similar terms. 

Brand guidelines are important.  If you have not defined them yet, you should.  Think of brand identity as your company's personality.  It’s how your customers recognize you and begins to trust you. If you see someone change how they look and act all the time, you won’t feel like you know who they are, and you certainly won’t trust them.  The same logic applies to brands: inconsistency will confuse and alienate your customers. A style guide is important because it helps your business communicate in a consistent way across all teams and channels.  Additionally, by creating your brand guidelines, you'll be forced to put some energy into thinking about what the brand should be.

There are many resources on the web that will tell you what to include in your brand style guide.  Each one will differ slightly, but I find that they have much in common with each other.  That is to say, there is no one, definitive structure for your brand style guides.  You should build the one that makes the most sense to your business and feel free to add or remove sections as your judgement dictates.

Style guides can be for print media, web or both.  For this episode, I'm going to present a web-focused style guide as we all have Shopify stores.

My ideal brand style guide for a Shopify store includes these sections:

1. Mood Board
2. Brand Story
3. Logos
4. Color Palette
5. Typography
6. Brand Imagery
7. Iconography
8. Patterns and Textures

Next, I'm going to go into detail on each of these sections.  If you are like me, you prefer real examples over hypothetical descriptions.  So I'm going to give you both.  I'll explain the concept for the section and then tell you how I did it for my brand, JadePuma.  I've also got my brand style guide on my website.  I'll include a link to it the show notes so you can follow along if you like.

Onto the sections of brand style guide.

1. Mood Board.  This first step can be helpful if your brand is not fully defined in your mind yet.  A mood board is a collection of assets, usually images that illustrate your vision of the brand.  These assets can be from assets that you've created for your business in the past or they can be images and graphics that you've found elsewhere.  The goal is to bring together a collection of images that help you determine how to define your brand.  If you've never participated in a brand building exercise before, it may feel a bit awkward at first.  But you'll find that if you can explain why you picked a certain image for the mood board, it will help you decide how to define your brand.  For example, if your mood board has a lot of product imagery, then your brand may end up relying on product photos.  But if your mood board has a lot of happy people in it, then your brand may go for more lifestyle photography and maybe even lifestyle photography without your products in it.  The JadePuma mood board has some photos of what I see my clients looking like after working with me and some quotes that illustrate my work philosophies.

2. Brand Story.  This is usually the hardest part for new stores to define and has multiple sub-parts:

• The smartest person in the room
• Snarky
• A user of words that needs a dictionary to be understood
• Trying to impress others

I want to call out one important thing about putting together your brand story and that is to be honest with yourself.  Not every brand is going to be the Mercedes in their category nor is every brand going to change the world.  By being honest with yourself when defining your brand, you'll be more authentic with your customers.  And that will help build trust in your brand.

For JadePuma, the brand style guidelines has versions for horizontal, vertical, dark background and icon.

4. Color Palette.  The color palette should outline of all the colors used with the brand which may include ones that are not in the logo.  It should also be clear if you are using pure white and black for text and background or a slight tints of them.  I frequently use shades and tints of a color as needed for contrast.  As such, I define up to 5 different approved shades and tints for a given color.  One is the main color.  Then there are two lighter versions and two darker versions.  As we're making a web style guide, we'll want to document the Hex code for each color as that is the primary way that color gets communicated on the web.

For JadePuma, the main brand color is a green.  The brand also has a gold and a blue color that are used for accents and contrast.  I've defined 5 versions of these colors.  And the brand has slight variation from pure black.

5. Typography.  Here you will define the approved fonts and how they should be used.  Here's the typography guidance for JadePuma:
The main font for body text is Cabin. It's an easy to read sans font.
Oswald is used for menus and buttons as its a narrow font with impact.
Headings are in Sabon Next - a serif font with just a bit of flair. Its also has thin lines like the font used in the logo.

I also show how the text is used in different situations with guidance on font size, font weight, color and capitalization.

6. Brand Imagery.  Brand imagery includes banners, navigational images, blog article images, marketing materials, ads and social posts.  Providing some guidelines for imagery will bring a consistency to them that will help support the brand.  For example, one client of mine had an imagery rule that every photo had to include a shade of the main brand color.  That was often photoshopped in.  Doing this brought all of the images together even though most of them were stock photography.  I had another client whose guidelines said that all banners were of parents and children together.  The children were calm.  And all images were outdoors under blue skies.  This supported the brand which sold supplements for children that have issues with focus, stress and anxiety.
The imagery guidelines for JadePuma are 'Images are of proud, happy, engaged Shopify store owners. They are shown working in their business. They are not in front of Ferraris or travelling to Paris. Images are sourced from stock photography.'

7. Iconography.  Just as with imagery, consistency in your icons or graphics will help support the brand.  JadePuma's icon guidelines are 'Icons are simple. They use the main colors from the color palette. They are high-contrast. No drop-shadows or gradients.'

8. Patterns and Textures.  Patterns and textures can be an important visual identifier for a brand.  So be sure to document them if you use them.  Apple is an example of a brand that include a texture in its visual identity.  The brushed aluminum of its products is also used in brand elements.  You may want to specify a certain backdrop for images to maintain a consistency that will build your brand.  As I don't use any patterns or textures with JadePuma, my brand guidelines have nothing for this section.

So that's what should go into your first brand style guide.  You may need to build it in steps.  For example, you probably already have your logo and color palette defined, so documenting those should be easy.  But if you haven't thought about your brand story before, you may need to put some thought into it.

If you've been looking at the JadePuma brand guidelines that I linked to in the show notes, I made that page with a custom section.  As you know, I'm a fan of the Flex theme and I use it on the JadePuma website.  So the section I made is optimized for the Flex theme and automates some of the documentation of your brand.  For example it automatically gets the color and typography settings that you specified in Theme Customization and shows them in the guidelines.

I'll include a link in the show notes where you can get the code for this section and add it to your store.  A simple copy and paste should work if you are using the Flex theme.  If you have a different theme, some code editing will be needed.  The page with the code also includes a video on how to use the section.

Your company is more than just the products or services you sell. A strong brand tells customers why they should choose you over all the other options on the market. A brand style guide tells your team and partners how to stay true to that brand so that you are consistent in your presentation to your customers.

While it is possible to generate good e-commerce revenue without a strong brand, the top Shopify stores like All-Birds, ColourPop, GymShark and Chubbies all have very strong brands.  And the same is true with my clients.  The most successful ones are the ones that have the spent time and energy to define their brand on top of all the other tasks that a successful store needs to do.  So please, define your brand and let that guide your site and marketing.

Thanks for listening.