Even at an early stage, creating a brand personality for your company and products justifies the time and energy it requires. Organizing the personality in a style guide makes any contact you have with the outside world more relevant and convincing. You may or may not have the resources for the ‘plan A’ approach, which is to establish a relationship with a professional designer or design firm. Regardless, you should put together a style guide.
If you will work with a professional designer, the style guide is almost always the starting point for establishing your look and feel. The style guide serves as foundation and blueprint for the look of everything your produce. The only instance where I’ve seen this not be the case is a situation where you’re working on some major deliverable (like a website) that, once finished, you plan to reverse engineer into a style guide. If you don’t have the resources to work with a designer, the next few sections will give you the tools to hack something together, which is far better than nothing.
The reason why something is so much better than nothing in this case is that simple consistency itself signals to your audience in subtle but important ways that your company (or product) knows who it is and what it wants to do (and the reverse is also true). There’s nothing wrong with revising your style guide as long as you do it coherently. The key thing is to do it even if you feel unprepared- don’t end up ‘waiting for Godot’.
The balance of this post will describe:
- What a style guide will do for you
- What it should include
- Example style guides of various types
- How to pull together a ‘lean’ style guide in three steps
- Resources if you want to learn more
What will a style guide do for me?
The style guide will put you in a position to make your materials look 1) convincing and 2) relevant to your brand personality. Branding is a largely qualitative discipline where quantitative tools are deployed for measurement. A fairly rigorous way to think about items relevant to your brand is the ‘associative network’ model. The basic idea is to think about attributes and ideas a person is aware of as ‘nodes’ in their grey matter. Your brand is also a node. The nodes have different sizes, representing their importance or ‘mindshare’. The nodes have bidirectional associations with each other. (The directionality is important but beyond the scope of this post- I added some resources about this at the end if you’re interested.) The key questions you’re addressing in building a brand are:
- What are these associations with your brand currently? (If your brand is new, this is moot.)
- What do you want the associations to be?
- How do you get them where you want them?
The diagram below describes the basics of this associative network model:
The size of the nodes represents their mindshare and the size of the arrows represent the strength of their association. Note: I’ve just dealt with the one direction here (brand to ideas/attributes vs. attributes/ideas to brand).
As an example, here what I’d like to achieve around ‘Starting a Tech Business’:
What should a style guide include?
Your style guide should include at least the following core items:
1. Brand Vision & Values
This is where you describe the personality of the brand- part of the reason the term personality is popular is that an easy starting point for the exercise is the question ‘If the brand was a person, what are they like?’. This is different than the associations above- it’s more a question of what brand behavior will get you the associations you want.
2. Visual Identity
Typically this is the elements of your logo, which may include a symbol (as is the case in the Leonid and Webex examples below) in addition to your logotype, the stylized printing of your company or product name. This section in many cases will also provide guidelines about how to use the logo.
3. Brand Elements
This includes but is not limited to your brand’s colors, typefaces, and textures.
4. Applications
This is where you apply the guide to your visual communication: website, email signatures, documents, product packaging, etc.
Hmmm. Examples?
Below are a few examples I thought were notable.
//Starting a Tech Business
I compiled this style guide myself based on the work of the editorial team at Wiley on the book and of the designers I work with on the website and related materials. It’s not nearly as polished as the items below, which were created by professional designers. That said, it does the trick as an organizing reference for everyone working on materials related to the book. I also created it in Power Point, which is not a tool you’re likely to see professional designers use. I used Power Point so that anyone could take the guide and use it as a template. You’ll see a copyright notice- the content itself (logo, etc.) is copyrighted but you’re welcome to use the document as a template to fill in your own style guide.
For a single product, you’ll notice a relatively large number of typefaces and colors. This is primarily because the product is itself media with its own particular style requirements.
The pane below shows a preview. If you click the icon with the four arrows in the lower right, you’ll see the presentation at the correct aspect ratio. To download the file, click on the button that says ‘view on slideshare’ and you’ll see a link to download on the navigation bar above the presentation.
Style Guide- Starting a Tech Business
//Leonid Systems
Leonid (where I work) creates enterprise software for communications providers (phone companies, cable companies, SaaS providers). The thing I thought was notable about the Leonid guide was that it has extensions for our various products, each of which have their own sub-persona under the Leonid umbrella. This is different than a true multi-brand company like Nestle or PepsiCo where they have products with no particular relationship to each- products in those kind of portfolios have their own separate and distinct personalities. You can download the guide from this link: Leonid Style Guide (this is copyrighted by Leonid).
//WebEx.
WebEx is a multimedia conferencing/screen sharing service now owned by Cisco. This is a good example of a thorough, robust, established style guide. You’ll notice all the elements from the section above as well as brand extensions for their various sub-products. You can link the guide here.
//Virginia Tech
Though not in exactly the same order, you’ll find all the elements above in Virginia Tech’s guide. The guide is highly developed around print production and prescriptive in that area. You can link to the guide here.
If you’d like more examples, maybe one in your space, for example, try Google’ing around some. Many institutions and large companies now publish their guides publicly online.
How do I pull together a style guide?
Plan A is to hire a professional designer. Forming a relationship with an individual designer or design firm early in the game will help you grow the brand more effectively. That said, you may not have the time or money to do this and it’s better to have something to establish that all-important consistency in your communication. The process has three more or less sequential steps:
- Define your brand personality
- Define your brand elements
- Implement applications of the style guide.
//Defining Your Brand Personality
Before you attempt this, you want to have a solid understanding of your target customer and company strategy. Chapters 1 and 2 of ‘Starting a Tech Business’ describe the development process for your product and corporate strategy as well as the formulation of customer personas. Chapter 3 describes the formulation of user stories. I recommend establishing a working take on these things before working your brand personality since your findings there should drive its formulation.
With those things in mind, think about your brand like a person- how would they behave, talk? Are there other, relevant brands you admire? How do they communicate? Your output here should be a succinct statement of brand vision, key brand values, and (optionally) associations.
//Defining Your Brand Elements
We’ll start with the logo. You want this to be distinctive, in line with your personality, and compatible with the balance of your brand elements. Creating a logo from scratch is tough if you don’t have training in art or design.
If that’s the case, my advice is to keep it simple and look for simple formulas you can see working elsewhere. Without any such training to speak of, I created the original Leonid logo with a blue circle overlaid with the Chinese character ‘can’, which, broadly speaking, means ‘consultation’ (we started as a consultancy). You can see it . I did it in MS Visio though I could have just as easily done it in Power Point. Was it a logo for the ages? No. But it was OK for the purpose and much better than nothing. When we had professional designers come in and reformulate our style guide, they kept the core of it but made it more consistent with the rest of the brand elements (see Leonid style guide in the previous section).
Next we’ll tackle colors. You want to keep these to a minimum- a couple of primary colors and then a few supporting colors. The main thing is that they look good together, which is a topic I can’t speak to in any meaningful way. The folks at Color Scheme Designer created a great tool for generating color schemes which you can reach here. I won’t bother describing how it works- they’ve done a great job of making it very clear. (Note: At the time of this post they have an expired Kickstarter campaign to expand their project. It’s a valuable public service and personally I’ll be keeping an eye out for a re-launch.)
Next we have fonts, or ‘typefaces’. This matters a lot more than you might think- we all have lots of associations about fonts, even if they’re subconscious. Sans serif fonts like Arial are most popular for digital presentation, though there are many choices within that category. Again, the main thing is to pick something and be consistent. Here are a few useful resources for typeface selection and pairing:
Good step by step guide
List of popular fonts on the web
Typeface combinations by personality:
Best practice examples of typeface implementations
Finally, we have applications- your website, business cards, and such. If you’re doing this yourself, look for best practice templates you can leverage, particularly ones that allow you to easily supply the attributes of your style guide as an input. Secondly, keep the materials simple. I also recommend referring back to examples to make remind yourself of how the applications go.
I want to learn more. Where do I go?
Beyond the resources above, here are a few items that will help you if you want to dive into the bigger picture on any of the topics we’ve covered here.
//Associative Model of Brand Awareness
There’s a useful snippet from ‘Brand Equity & Advertising: Advertising’s Role in Building Strong Brand’s’- click here.
I first learned about the topic reading ‘Strategic Brand Management’ by Kevin Keller.
//Graphic Design
This firm published a good step by step guide and worth looking at if you want to know more about putting together a style guide. It has a number of useful items, though much of it deals specifically with working in Illustrator which will be beyond the beginner.
David Kadavy’s ‘Design for Hackers’ is a great starting point for understanding design, particularly for those in high tech.
or
add to:
add to:
add to: