eLearning Course

An eLearning course with bad color schemes can have you screaming for mercy the moment the first slide rears its ugly head. Some novice designers, it seems, are stuck in the creative mindset of a mid-90s website, back when a cacophony of garish neon hues was still acceptable because the internet was still such a new thing. But these days, there really is no excuse for assaulting an innocent eLearner’s retinas with such pain-inducing color combos.

Enter Adobe Color (formerly called Kuler). Adobe Color is an extremely useful online resource for making any and all color scheme decisions. Each color scheme consists of five specific colors, which may all be tweaked to fit your needs.

For those using Illustrator, Photoshop, or InDesign, color swatches from Adobe Color can be directly imported into your project for easy access. But that doesn’t mean you’re out of luck if you don’t use other Adobe products, because each color swatch is shown with the appropriate RGB and HEX codes needed to replicate them in other interfaces.

If you are new to the world of color theory (which colors go well with each other), you may want to try one of the preset color rules to find a group of colors you like.

The standard color rules that you can choose from are analogous, monochromatic, triad, complementary, compound, shades, and custom. Let’s learn more about these rules.

Analogous

An analogous color scheme consists of colors that sit close together on the color wheel, which is perfect when you want a color scheme that has a “hotter” or “cooler” feel.

analogous

If you don’t like the specific color scheme that pops up when you choose a color rule, simply drag a circular color selector to a color you want. The rest of the selectors will move with it.

Monochromatic

This is a color scheme that is made up of a single hue, but in different values (how black or white the color is), and saturations (how vivid or undiluted the color is).

monochrome

Triad

Triad color schemes are compiled from three hues that lie at equidistant angles from one another on the color wheel. Since Adobe Color produces 5-color schemes, a couple variations on saturation and value are added.

Triad

Complementary

When two colors are complementary, it means they are on opposite sides of the color wheel. Much like the triad, three other variations are added to give us five colors. Complementary color schemes are great for creating contrast, as the colors make each other pop.

complementary

Compound

Compound is similar to complementary in that two colors are at opposite ends of the wheel, but here some other colors (adjacent to the base complementary colors) are added to keep the contrast, but add a little more variety.

Compound

Shades

Shades is easy to confuse with Monochromatic, but the key difference here is that, whereas Monochromatic is a single hue with variations in saturation and value, a Shades color scheme consists a single hue with variations of value only. Notice how all the color selectors are piled onto one point, yet we have five distinct colors.

shades

Custom

The final rule is the “Custom” setting, which takes the training wheels off and allows you to manually select each color with the circular color selectors or by changing the RGB and HEX values at the bottom of the screen.

custom

Explore

To see the color schemes that other people have created, Color has a powerful search function, linked to a database of heaps of color schemes to choose from. Simply type a word that evokes certain colors to mind, and choose from a library of many different schemes, each of which can be tweaked if you aren’t crazy about all five colors.

Explore button

explore mint

explore pastel

punk rock explore

Create from image

Finally, a truly amazing feature of Adobe Color is the “Create From Image” function. This is extra handy if you are trying to design a course to complement a specific image.

If you wanted to design a course around this furry little friend, all you have to do is click on the “Create From Image” button, a little camera icon in the top right of the home screen.

dog sample         from image button

Once there, upload the image in question and Color will generate several color schemes from colors found in your image. It’s that easy.

dog colors

 

Have any color scheme tips you would like to share with us? Comment below.

 

 

Pin It on Pinterest