By Mireille Sampson
Make your visual brand distinct.
You don’t need telekinetic superpowers to elevate your visual brand.
To be recognizable, your visual brand must be memorable; to be memorable, your visual brand must be distinct and have its own well-defined personality.
How do you figure out your own visual brand personality? Try thinking about these questions:
What do you want to remind people of?
What do you want to avoid reminding people of?
How do you want them to feel when they interact with your brand?
Why is your type of product/service/event meaningful?
When I was planning the website for Colleen’s Bridal Boutique in Corner Brook, Colleen knew that she wanted the boutique’s brand to be an extension of her own personality—fun and lighthearted. Colleen also knew that she wanted to avoid reminding people of the previous bridal shops in Corner Brook—that meant avoiding pale pastel colours and the black-and-gold combination.
When I researched bridal shop websites, I found a sea of white, off-white, and pale pastels. Meanwhile, Colleen had a fun, hand-painted sign outside her boutique in bright colours she really liked. That information gave me my starting point for designing the distinct website visuals.
Make your visual brand consistent.
Once you know how you want to make it distinct, how do you make your visual branding consistent? By styling consistently across all your visuals—online and in print.
Your visual branding is more than your logo; in fact, your logo isn’t even the foundation for your visual brand. For websites, visual branding starts with your colours and fonts, which are the basis for creating all aspects of your website and print marketing materials.
With that in mind, here are a few tools to help.
Google fonts are used by both website designers and graphic designers, so you can have the same fonts online and in print. There’s a huge and growing number of fonts to choose from—and they are free.
You’ll need at least two fonts. One is for the bulk of the text, and the primary concern is readability. Usually your website designer will choose or narrow down the choice for you because they can take into account various requirements, such as accessibility for visual impairments.
The other type of font is called a display font or fancy font, and it usually has a lot of personality, though it’s difficult to read in large doses. These fonts are normally used in logos and titles—somewhere you want a little extra personality. I chose “Leckerli One” for my logo and clipped a multicoloured gradient to it.
Coolors is a favourite tool of mine for choosing colours—and it’s freemium. They have a website and they have apps. They have a library of colour palettes, or you can generate a palette in a few ways—my favourite is picking colours out of a photo. When I was building a website template, I designed it around the idea of a fictitious food company selling berry products and services. I chose the colours by picking them out of a photograph of bakeapples growing in the wild.
Each digital colour has two codes that are used by website designers and graphic designers—using either of these codes ensures that you’re always getting the exact colour across all your media. These are called hex code and RGB code.
Again, your website designer can choose or narrow down the choice for you because we can take into account accessibility requirements for visual impairments such as colour blindness.
One of the places you can use your colour codes is Blush. Blush has a library of customizable illustrations that add polish and professionalism to your website. They come in a variety of styles and topics, and various aspects of the illustration can be swapped around. Remember paper dolls? Well, it’s like that, only digital and on steroids. You can apply your brand colour codes to the different shapes in the illustrations.
I always provide my clients with copies of their website illustrations so they can be used across their online presence: website, newsletter, social media—and in print marketing too. This provides brand consistency across all your media (well, except radio).
Online, links are clickable. On paper, links are scannable. That’s what QR codes are—links you scan with your cellphone camera. QR codes are fast and easy to generate—I use Qrafter Pro, an inexpensive app. The code can be customized with your brand colours (using your hex codes) and you use them on your print media. There’s no need to use them online because there we use clickable links, not scannable ones.
QR codes have many more uses than I could think of, but here are a few places to put them to get your imagination going:
business card or business card magnet
posters and brochures
print media article
product packaging—for example, linking to a how-to-use-our-product page or video
the exterior of your business vehicle
a television ad or appearance
your shop sign, so even when your shop is closed, people can get information on your products or services
real estate signage
Of course, your website needs to be mobile friendly for any of this to work.
When I asked Colleen what weddings mean to her, she replied: “family and friends celebrating together.” That is also part of her brand—and I tapped into that when choosing her website photos on Pexels. I chose photos that make the viewer feel like they’re in the middle of a big family celebration, with people of different sizes, shapes, skin tones and ages, including children. I also found a great shot of two sisters and a grandmother with bridal dress voting paddles. Too many bridal stock photos are just of the bride or the bride and groom—but we all know that granny has got to be at the wedding.
I’m an award-winning international artist who has turned my creative skills in a new direction: tech! I’m a user experience (UX) designer and a webflow developer—and I own and operate User-Friendly Website Design. My not-so-user-friendly name is Mireille (she/her); I’m originally from Stephenville and now live in Corner Brook after fourteen years abroad.
709-703-5001 | hello@UserFriendlyWebsite.design