Designing Interactive Coloring Books for E-Learning #190

Online Coloring Books in E-Learning #190: Challenge | Recap

Interactive coloring books may not be your go to interaction for most e-learning projects, but they are a fun way to get learners to interact with the screen. They're also a fantastic way for course designers to sharpen their course-building skills by working with multiple triggers, states, and variables. Let's look at a few examples to get a better idea of how these interactions work.

Changing Colors with Click Events

Using click events to change object colors is probably the easiest and most intuitive approach because it simulates what users would expect to do in the real world. Choose a color and then select the part of the illustration you want to color. And here's a fun example to help get you started.

View project | Download | Dan Graham | Website | @EzLearnin

Changing Colors with Drag-and-Drop

In this example, click events are combined with drag over events to change objects' colors. The way this works is really cool. First, you click one of the tree ornaments to select it and then you drag the eyedropper tool over the color swatches to change the color. I like this example because it shows another way to create these types of interactions.

View project | Learn more & download | Paul Alders

Changing Colors with Dials

Here's an example of where multiple dials are used to change the color of a graphic. Now this one's a little different because there’s only on graphic that's being changed. The three dials are used to simulate the mixing of color values that are then applied to the object.

View project | Learn more | Jackie Van Nice

Basic Drawing Book

Here's another example I found when I was putting together this challenge. Even though it's a simple example, I'm really glad I found it because it's ideal for anyone who's just getting started with this type of interaction.

View project | Learn more & download | Chibuikem Nwani

Challenge of the Week

This week, your challenge is to share an interactive coloring book or similar activity that lets users customize the colors in one or more on-slide graphics.

Keep in mind that this type of activity can be designed with either basic states or variables. You’re welcome to use one or both techniques in your example.

If you’re just getting started with Storyline, Studio, or another tool, you can keep things simple by using basic shapes for your demo.

Last Week’s Challenge:

Whether you’re intending on coloring inside, or outside, the lines this week, you should make some time to check out last week’s animated menu challenge. This was one of our biggest challenge weeks for examples and downloads.

Circular Menu Navigation in E-Learning #189: Challenge | Recap

Wishing you a colorful week, E-Learning Heroes!

New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.