What colors look good in digital signage?
If you've ever had trouble deciding what colors look good when you're creating your content, this post will benefit you. Once you practice enough with color in digital signage, it will be like second nature.
The first thing we'll talk about is color and light. If you already know and understand color, and you'd rather just know which sets look good together, feel free to skip ahead.
There are two types of light you deal with every day: Additive and Subtractive. If you're reading this post on a computer screen, you're dealing with Additive light. If you printed this post out, and are reading it on paper, you're dealing with Subtractive light.
Additive light is PROJECTED light, and is comprised of the Primary colors of Red, Green, and Blue. That's why when you get really close to your television, you see red, green, and blue pixels, or spots of light. The computer screen is PROJECTING light which your eye is then receiving. Digital signage is additive light.
Subtractive light is REFLECTED light, and is comprised of the Primary colors of Red, Yellow, and Blue. You may remember learning your primary colors in middle school art class. Technically, if you're wearing a green shirt, and that shirt looks green to you, it's because green is the only color of light that is being reflected off of your shirt and into your eye. We could go into more detail, but since Digital Signage deals with Additive light and paper signage deals with Subtractive light, we don't need to elaborate any more.
Even though your digital signage screen might technically be making your colors out of red, green, and blue (RGB) pixels, it's much easier to think of your colors in three different parts: Hue, Saturation, and Luminance.
Hue is what you probably already know as "color." Red, orange, yellow, green, blue, and purple are all Hues. In the Noventri Designer custom color picker, as well in Microsoft Windows, hue is on a range from 0-239.
Saturation is how "strong" a color is. To better explain, imagine the grass outside your house in summer. The grass is a very strong, vivid green. As summertime fades, and fall arrives, the green loses a bit of color. Finally, when winter arrives, grass will commonly lose most of its green coloration. This is Saturation. Here's another example: imagine you have a glass of milk and some blue food coloring. The milk starts off as white, but for each drop of food coloring you add the milk becomes more blue, or more saturated. In the Noventri Designer custom color picker, as well in Microsoft Windows, saturation is on a range from 0-240.
Luminance is how much White or Black is mixed with your color. You probably already refer to colors as light and dark; this is what luminance is. Some colors have more common or widely used names. Blue, for instance, becomes "baby blue" when its luminance is increased. When orange's luminance is decreased, it becomes brown. In the Noventri Designer custom color picker, as well as in Microsoft Windows, luminance is on a range from 0-240.
It is good to think of your colors in reference to these three parts, and it can really help you describe colors to other people better than just saying "red" or "blue." An evergreen tree could be a low luminance, low saturation green; the sky on an overcast day could be a high luminance, low saturation blue; and the highlighter at your desk could be a high luminance, high saturation orange.
Now that you have a better understanding of color, the second thing we'll talk about is what colors look good together.
Picture a wheel of color like a clock face: red at 12:00, red-orange at 1:00, orange at 2:00, yellow-orange at 3:00, yellow at 4:00, yellow-green at 5:00, green at 6:00, blue-green at 7:00, blue at 8:00, blue-violet at 9, violet at 10:00, red-violet at 11:00 and back to red at 12:00. If you can imagine a line running through the middle of that color wheel, connecting one end to another and passing through the very center of the circle, then you can make good color choices in digital signage. It's that easy!
You'll notice that red is directly across the circle from green, orange is directly across the circle from blue, and yellow is directly across the circle from violet or purple. These colors look good together because they are pure opposites, and when used together in digital signage you're sure to get more positive attention than using two colors that don't go so well together.
White and Black: White and Black are interesting because they can be combined with just about any other color and look good. Use your best judgement based on readabilty; you already know that yellow text on a white background is nearly impossible to read, just as rich blue text on a black background is.
You're probably thinking, "What if I want to use more than two colors?" Using multiple colors is simple, too. We already know that a circle is 360 degrees around, so by using a little simple math we can figure out complimentary colors. Drawing a line straight across, as we mentioned before, would be separating colors by 180 degrees. If we wanted to pick three colors instead of two, we just divide 360 by 3: 120. Three colors that are 120 degrees apart make a complimentary color triad: this can be achieved by drawing an equilateral triangle on the color wheel. Four colors would be 90 degrees from one another: this can be achieved by drawing a cross on the color wheel. Five colors are 72 degrees apart, six colors are 60 degrees, and so on.
Do they really need to be a certain angle from their compliments? No. Colors that are beside of one another on the color wheel can often work well in conjunction with one another, too. Red, orange, and yellow, for instance, look very warm and fiery and work well as a group. Yellow, green, and blue feel much cooler in temperature than red, orange, and yellow and look tropical and nautical. We'll talk more about color associations and emotions further below.
You may also be thinking, "Well, that doesn't leave me with too many options." Remember what we covered in the first section about what makes up a color? By choosing color compliments we are only altering the Hue; you can alter the Saturation and Luminance to get endless combinations of complimentary, good-looking colors. For best results, if you use high saturation and luminance in one of your colors, use low saturation and luminance in your other color.
Finally, we'll talk a bit about the emotional responses tied to each color. These emotional responses are better known by the marketing crowd and are used daily in advertising to evoke certain responses from you, the viewer. Some are more obvious than others. Depending on your industry, you may want to take a risk and get away from your company colors on your digital signage to use something more emotion-evoking. Below is a list of pure hues and a few emotions and words associated with each.
Red- Passion, Violence, Fire, War, Love, Danger
Orange- Energy, Movement, Change, Vitality, Welcoming
Black- Formality, Elegance, Power, Mystery, Sophistication
White- Cleanliness, Purity, Goodness, Nuetrality
Yellow- Hunger, Happiness, Cowardice, Hope, Caution
Green- Earth, Growth, Abundance, Stability, Wealth, Fresh
Blue- Corporate, Sadness, Calmness, Peace, Reliability
Purple- Royalty, Imagination, Luxury, Romance
While it's recommended that you use these emotions in color to your advantage, don't let yourself feel tied down with them. If a color combination makes you feel a certain way, then use it when appropriate. Don't be afraid to ask the people around you how colors make them feel; get some opinions before making a final decision.
Red Text Rule: The color red, especially when used as thin text, can generate some unwanted noise and lack of detail. If you've ever seen a television commercial with red text that's hard to read, you know what I mean. By red, I don't necessarily mean a high luminance red (like pink), and I don't necessarily mean a high saturation, low luminance red (like maroon or burgundy). It's generally a good idea to avoid the bright "fire-engine" reds, especially when using thin text.
Readability: Generally, the more contrast between the color of your content's text and the color of the background behind it the more readable your text will be. Black text on white or white text on black is about as readable as it gets. Just because two colors contrast one another, or are complimentary, does not mean they'll look good used in conjunction with backgrounds and text. Take red and green for instance; not only does it immediately evoke feelings of Christmas to some viewers, but it's downright difficult to read red text on a green background. To increase readability with complimentary colors, just darken one color and brighten another. For instance, put light red text on a dark green background, or vice-versa.
Specialized Communications Corp. / Noventri
20940 Twin Springs Dr.
Smithsburg, MD 21783-1510 USA
Digital Information Display