Last week, I told you all about the redesign hell I went through with my last website. I cycled through “Coming Soon” pages and a website I hated for 2 years before I got my stuff together and finally launched a site that I loved.
What finally got me to the finish line was getting clear on my brand and creating a reference for it in the form of a style guide.
A style guide contains your brand’s attributes or vibes, color palette, a mood board of inspiration images, and a preview section showing how your combined brand elements will look on your website.
Testing and tweaking combinations here will save you so much more time compared to doing it on your actual website.
Here’s an empty style guide template…
And here’s the template after it’s been customized.
If you’re designing a completely new brand, I’d start with the Vibes section first. Write down 3-4 words that come to mind when you think of your brand. Everything you add going forward needs to reflect at least one of these words.
The next section to hit would be Brand Inspiration. Chances are, you’ve seen an image somewhere, whether it be online, or offline in a magazine or product label that caught your eye and gave you some inspiration. Make sure to save a picture of it so that you can add it to your guide.
Another way to approach the mood board is to add pictures of what you’d use to design the reception area of your business. Think about the floors, wallpapers, wall-hangings, knick nacks, etc. This will help you draw out textures, patterns and even fonts that you can use in your branding. But remember, if any of the pictures don’t reflect at least one of the words, get rid of it.
From there you should have enough to start pulling out colors and fonts that match your inspiration images and brand attributes. Then start mixing and matching in the preview section to get a sense of how everything will look together on your website once finished.
By using an online graphics editor like Canva, you can create your own style guide in no time. I even created a workshop that walks you through the whole process step-by-step. Check it out and grab a link to my Canva template right here.