9 min read
Humans are highly visual beings. Beautiful design can improve virtually every human experience by providing clarity, simplicity, and organization. Our brains are wired to process visual information fast. These experiences grab our attention, keep us engaged, and help us take action.
Color is a fundamental aspect of any design. It can affect our mood, emotions, and how we feel about any given product, service, or experience.
In this article we want to explore how color can be used in self-service content to help trigger effective emotions, ease your customer’s journey, and channel your brand.
Color psychology is the science of how color affects human behavior. It is a branch of behavioral psychology that looks into how people’s everyday actions are influenced by the way they perceive different hues, values, and chromas of colors.
It is used quite often in the business and marketing world when deciding on brand colors that will invoke the right emotions and actions in an audience. Sometimes choosing the right, or wrong, colors can make a large impact on a person’s impression of the company. For example, many fast-food chains often choose red and yellow as primary logo colors, because they have been proven to invoke hunger.
Neil Patel found that 85% of customers say their primary reason for choosing a certain product or service is color and 90% of purchasing decisions as a whole are influenced by different visual factors.
So, let’s cover some of the nitty-gritty first. The primary colors—red, yellow, and blue—cannot be formed from mixing other colors. Secondary colors are formed by mixing primary colors—red and yellow make orange, red and blue make purple, yellow and blue make green. Tertiary colors are different mixes of primary and secondary colors.
Hue is the name of the actual color, value is how bright or dark that color is (shades are darker, tints are lighter), and chroma is how saturated or vivid that color is. The brightness and vividness of color often have more effect upon a person than the color itself.
Blue, green, and purple are cool colors which have been proven to decrease arousal and provide relaxation. Yellow, orange, and red are warm colors which increase arousal and excitement levels. Colors can also be categorized by their functionality and their gender.
Colors can be combined in a multitude of ways: Monochromatic color schemes use one hue, or color, with different variations in value and chroma. Analogous uses hues that are close to each other on the color wheel, like blue and purple. Triadic chooses three hues from across the color wheel that form a triangle (like primary or secondary). Complementary schemes are opposing colors, like green and red, that provide high levels of contrast.
A lot goes into how a color provokes an emotion onto a person. The value or chroma of a color can have a large impact on how it is perceived. Many people also react to colors differently depending on their gender, heritage, culture, and emotional experiences. It is hard to say that one color always provides certain feelings to any given person, but when you measure the amount of arousal different colors evoke with the common experiences people have with certain colors, you can find commonalities:
In a survey, people were asked to choose the color they associated with particular words.
To summarize this:
Green is one of the more positive reflecting colors. It is one of the most commonly found colors in nature creating a sense of life, growth, and creation. Not to mention that it is universally used to mean “go.” This color best reflects the nature of expansion, positivity, and liveliness. It both builds trust with a brand and indicates a safe choice.
Blue is a dependable color. It portrays reliability and consistency. It makes users feel welcomed and comfortable. Blue is by far the most favored color. It creates trust, indicates reliability, and signifies a safe choice.
Red is seen as powerful and dynamic, working best as a complement to green. The contrast it brings to other colors gives us a strong presence and allows it to stand out. It represents urgency and calls for immediate action.
Yellow & Orange portray happiness, joy, confidence, and inspiration. Orange brings in the passion and power of red with the cheerful and light nature of yellow. These two colors work together well to inspire and motivate. Those colors are great to bring a bit of playfulness.
So what does color psychology have to do with self-service? You can use careful color choices to leverage effective emotional reactions in your self-service content. To do this, you first need to look into your audience. Targeting who your audience is, what they want, what they are looking for in your products and services, why they need help, and the different places they need access to your help content is how you discover the best way to serve them. Understanding the emotional state of your audience and the desired mood you want them to achieve from their interactions with your self-help will help you choose the best-suited colors for different actions.
Imagine that choosing a color is like choosing your tone of voice. It should be custom-tailored to the unique situation that it’s being displayed on in order to best represent your company.
When deciding on your colors, you should think about whether you want to increase arousal and excitement (warm colors) or bring relaxation and decrease arousal and tension (cool colors). Keep in mind different areas you want to increase contrast and make something stand out, or decrease noticeable visibility. Think about what you want a certain action or article to be associated with by its color (gender, common emotional associations, common found universal colors like the blue sky, etc.).
The way you design your experiences has a great impact on how well your customers are able to interact with them. You should make tactical choices when choosing what colors will lead your customers to take specific actions.
After making educated decisions on which colors will best achieve your goals, try leveraging them to help users take specific actions, such as warnings, tips, search buttons, cart icons, calls-to-action, etc. Choosing the appropriate colors should ease your customers’ journey through your self-service content, providing clarity and convenience.
Creating a consistent brand is admittedly not easy. Color plays a huge role in your consistent brand identity. Whatever color you choose for your brand will be displayed across all of your different platforms and areas of content, including your self-help experiences. So, it is crucial to choose the right color for your brand—not just to succeed in delivering the right message—but to succeed in providing a consistent message in the service you provide to your customers.
So how do you do this? Neil Patel found that “color increases brand recognition by 80%.” This means that when you pick a color, you need to stick with it—across all your assets, your website, social media channels, your self-service programs, and your knowledge base content. You want this to be something your audience sees and instantly recognizes as your company.
This doesn’t mean you should be choosing one color and using it everywhere. But, whatever color scheme you decide on should be carried everywhere. And you can use this to your advantage. Maybe you’ve decided to stick with blues and greens. You can leverage that color difference in your self-help by differentiating it. For example, make your homepage mostly blue varieties, while making all of your help content different green varieties. This helps ease your user into understanding that they are on the right path to self-help.
For reference on deciding what color will portray your brand best, “Dimensions Of Brand Personality” created this model for choosing a color to reflect your aesthetics.
This color theory may sound great and all, but it is quite abstract. Is spending time and money on choosing the perfect color for different places really worth the effort? Is changing the value or hue of a Help button on your website actually going to increase self-service resolutions? Let’s look into some real-life examples of color psychology in action.
Slack’s primary color palette consists of seven colors, so there are quite a few to choose from.
For their help center, they went with blue and green. They begin with the hero image, a gradient of those two colors. Green is also used to denote steps users need to take, unordered lists which are represented by check-lists, and outlines notes. Blue is used to draw attention to other relevant content used in tips. Yellow is used for warnings or attention.
Shopify has nine primary brand colors. They also use lighter and darker tones of these colors throughout their website.
Shopify does an excellent job of leveraging the contrast in complementary colors. As you can see below, their homepage is mostly a toned down, pale shade of green, with only a few spots of black and white for text. Otherwise, it is entirely green, matching the hue of their logo.
Now, as you can see below, their help center’s primary color is indigo. They do this for three reasons. First, green and indigo complement each other well because they are opposite on the color wheel. Second, since these are such opposing colors, they could easily clash (think Barney), but Shopify successfully matched their toned down and pale value and chroma, so they can blend together well. Lastly, choosing indigo was a good decision, not just for the contrast it provides, but for the emotion it provokes to those seeking help. Indigo is often used to soothe and calm, while green brings more energy and urgency. So, it was a smart decision to make the help center a more relaxing color than their main home page, because they serve two different purposes.
As you can see below, within their help-center, they continue to utilize color choice in multiple strategic ways:
Asana’s brand colors are vibrant and fun, designed to inject energy and call users to take action progressing work forward.
Asana’s help center is quite colorful too. They use purple to draw attention to call-outs and steps. Blue is used for links and green for tips. They correspond screenshots to parallel numbers with their relative tasks by using a matching purple to help lead your eyes. This also helps provide context and improve task completion.
With all this talk of color, it’s almost shocking to see that one of the most successful companies in the world, Apple, actually lacks color in their brand and logo. There’s some back story to this as well. From 1977-1998 the apple logo was actually colored with rainbow stripes, to represent the first color monitor on a computer. Eventually, as many other companies adopted the color monitors, it was modernized to be a pale blue, and then the gray-silver color we now know it to be. Today, Apple’s main colors are silver, gray, black, and white. This is to shoot for the metallic, modern, innovative, and iconic look that Apple represents as a brand. Not many companies can choose such a neutral color and still be recognized for it, but Apple does it notably well.
In their help center, Apple uses minimal colors as well. Notably, they use a blue for different calls-to-action such as “Change topic” and “Change product” as well as links to content. They also use green to draw user’s attention to the best contact choice:
Color may not be something we actively think about every day, but it is something that affects our actions, emotions, and decisions constantly. Choosing the right colors for your self-service content is key to maintaining brand consistency and aiding customers in their journey with your company. Something like color choice is such an effective and powerful tool for your company to place importance on while being fast and affordable to implement.
A few recommendations:
To learn more about how to improve your self-service program, read about increasing adoption, shaping your customer preferences, and ensuring successful self-service. Investing in self-service can provide a huge amount of benefits to your company and customers, but it is not a one-and-done deal. It is a process of growth, and therefore, you must work to ensure it is reaching its full potential.
.jpg)
.jpg)