top of page

Color Effects Learning

Color Wheel

Adobe’s Color Wheel (formerly Kuler) allows you to create your own color palette or explore popular palette’s created by others. It even gives you the option to save your color palettes and directly upload them as swatches to your other Creative Cloud programs.

Adapted from: Stephanie Ivec Color Theory for eLearning  Apr 17,2018  eLearning brothers

color wheel.jpg

Image from: The Psychology of Color: How Do Colors Influence Learning? Mar 07, 2019 Shiftelearning

Monochrome: It’s all the same to me

Uses:

Monochrome schemes look clean and seamless and can create a strong connection to a single idea or brand identity on your slide.

Downside and How to Fix it:

When only working with one color, the most obvious problem can be that there simply isn’t enough contrast to draw interest and the design can get boring fast. Pure black or white can be paired with the main color to bring emphasis where needed.

Opposite

Uses:

Because of the opposition, this scheme creates a highly contrasted and vivid effect that is awesome for an energetic presentation. eLearning designers will often use the main color for the background of a slide and use the opposite color to highlight certain areas such as clickable elements or important messages.

Downside and How to Fix it:

These combinations can sometimes be a little too loud and jarring for some designs. To mitigate this, try combining colors that are a tint or shade of the original colors.

Near-Complementary Colors:

Another way to keep much of the same vibrant contrast but without things getting garish or overly dissonant is to choose near complementary colors. These are colors that are not quite opposite each other, but instead are a color that is next to the opposite. For example, instead of pairing red and green you can pair red and blue, or green and orange. Think about those examples and you’ll likely be able to envision many things that use those color combinations.

Analogous colors

Analogous colors are kind of like when the boy and girl next door get together. They are colors that live alongside each other, so there is some contrast but not the kind of extreme difference that comes with colors living on opposite sides of the country.

Uses:

Because of their similarities these colors look so balanced and evenly matched they’re not just a boy and girl next door, they’re also the football captain and head cheerleader dancing at prom. They blend well and have all the same friends and can totally hang out on a page and look positively seamless.

To use this scheme properly, choose a dominant color such as red, a supporting color like red-orange and a third like red-violet who will act as the quirky sidekick who provides short, well-timed jokes or accents.

Downside and How to Fix it:

Analogous color schemes have a similar problem to monochrome schemes in that they can get boring because there is too much similarity. To break this up, choose colors that aren’t TOO similar. The more tiers and complexity your color wheel has, the more chance you have of picking colors that are a little too close to each other, so it’s often best to pick from a more basic 12 step wheel. You can also use a fourth analogous color, creating more of a difference between the first and last choices. White and black accents can also be used.

Triadic colors

More specifically, in a 12 step color wheel, this means three colors that are 120 degrees apart from each other, their points forming an equilateral triangle.

Uses:

This uniform distance creates a balance of harmony and contrast that is best used by choosing a dominant color and utilizing the other two as accents. Even using pale or tinted versions of these schemes will still provide quite a bit of visual interest.

Downside and How to Fix it:

There really isn’t much of a downside to a triadic color scheme though you still need to make sure that your colors aren’t competing with each other in an unappealing way. If you want a softer look to your overall design, using less saturated colors is the way to go.

How to Use Color in eLearning

Thanks to the fact that the human brain has the power to convert color into emotions and moods.

 

Have an idea of the mood you're trying to achieve beforehand
Always have a clear idea of the mood or feelings you are trying to convey through the use of color in eLearning. This will allow you to prevent creating a mood that goes against what you are trying to achieve.

For instance, if your goal is to create an eLearning course that helps to make a dull subject matter fun and engaging, then you may want to choose red or orange.

​

Don't go overboard when utilizing color in eLearning
Stick with just two or three colors throughout the eLearning course, as any more than that will make the overall eLearning design look chaotic and disorganized. It can even prevent the learner from acquiring the information, given that they will feel overwhelmed or distracted by the abundance of colors.

eLearning courses that have featured virtually every color in the rainbow...all in one module. This will only serve to confuse the learners and take away from the value of the eLearning course by making it look cluttered and unprofessional.

​

Never sacrifice legibility for aesthetic design
If at all possible, always prefer the warmer shades of the colors that you chose to use. This will help to increase readability and prevent any contrast issues, especially if you are using a white background. If it's a choice between using a color that you love, even though it doesn't offer enough contrast, or using one that will be more legible for the learners, always go with the latter. Readability should never be sacrificed for visual appeal.

​

Consider your learning audience's background
Different cultures affix different meanings to colors. For example, one culture might believe that red is off-putting, while another might consider it energizing and lucky. So, you'll want to research the background of your audience before deciding upon your ideal colors.

In addition, consider their age, religion, and educational background since these have a direct impact upon their preferences and their interpretations to certain colors.

Also, remember that some learners may be color blind. Therefore, you'll also want to highlight key points by using different font types, underlining them or placing them in boxes.

Adapted from: Christopher Pappas 4 Tips to Use Color in eLearning  Oct 21,2014 eLearning Industry

Common Used Colors in eLearning

Green: Concentration

You probably know this already, just by taking a look at a forest or a field. Low wavelength colors promote restfulness and calm, and they improve efficiency and focus.

Dr. Kate Lee hypothesizes that the green roof provided a ‘restorative experience’ which helped boost the mental resources of the students involved in the study. If true, that’s a major consideration.

If your learners are tired and bored of their compliance material, add in a restorative green screen, a forest scene, or something else for a bit of a break.

Lee believes that just a moment of looking at a green space could provide a moment of revitalization for workers who were struggling to concentrate.

​

E.g.:  Windows Defaulted Desktop Wallpaper

xp-bliss.jpg

Orange: Mood Lifter

Think about the orange sun setting over the horizon. Nice, right? It’s true, orange can be a welcoming and mood-lifting color for learners, which in turn promotes comfort and improves neural functioning.

But this comes at a cost – avoid bolder orange colors if your learners are young and naturally energetic.

This isn’t a good color for those prone to overstimulation as well, for instance if your group of learners have attention deficit hyperactive disorder or another health concern which leads to easy overstimulation. 

So to close out orange as a color, in eLearning courses it can be used to highlight key facts and figures, communicate energy, life, and activity. Orange is a vibrant color that demands attention, giving it an edge as a choice for highlighting. But again, use with caution!

​

E.g.:  Amazon website Add to cart button

amazon add to cart.PNG

Blue: Productivity

Blue is best used for learning situations which are challenging. Blue paper, blue ink, or blue highlighting can be used to help improve reading comprehension too. Blue in general it seems is a relaxing and calming color, but lighter shades will seem more ‘friendly’ while darker ones seem a little more somber. 
Back to the experts, many color psychologists recommend using blue colors, but adding a bit of extra kick with orange, especially for highlighting information (like we mentioned earlier!).

 

So in summary, blue is great for promoting high levels of thought, but too much can create a sense of detachment and coldness.

​

E.g.:  Amazon website Add to cart button

blue 1.png
blue 2.jpg

Adapted from: The Psychology of Color: How Do Colors Influence Learning? Mar 07, 2019 Shiftelearning

bottom of page