Recolouring Artwork

To recolour the oval, click Recolor, More Variations then choose the colour.

My white, hand-drawn oval quickly becomes this lovely shade of greenbriar firemist, to match its topic.

I often recolour photographs in Storyline to achieve a consistent look-and-feel throughout an eLearning module. Yesterday, I was playing with this idea while creating some new hand-drawn assets— a circle, an oval, a rounded rectangle — for my current project.

I’m pretty particular about colour. My eLearning products generally follow a strict colour scheme derived (often in color.adobe.com) from a client logo, a user interface or other image or specification. I always create a “theme” in Storyline so those colours are persistent and always available.

If you just need circles and squares, you can create those right in Storyline and colour them as you like. But maybe you have a special series of hand-drawn assets your client likes. Hand-drawn assets lend a fun informality to your learning. In this post, I describe a quick way to recolour those assets anywhere in Storyline.

There isn’t a really good reason for doing this except it’s fun and if you use hand-drawn assets you don’t have to recreate those assets for each new colour scheme.

First, draw your assets. Make them big and make them white.

A 5pt white circle and oval in Illustrator.

Draw a white circle and a white oval in your favourite graphics program.

My eLearning modules are usually 1024 x 576, so a circle that’s 600 x 300 is big enough so I’ll never have to make it bigger; smaller is OK, but bigger reduces the quality of the asset. I use the circle and oval to highlight key features or draw attention to something. And white because white ‘recolours’ better. I use Illustrator to create my hand-drawn assets; use whatever graphics software you have available. (Or download these.)

Once you’ve drawn your assets, export them or save them as a .PNG file to maintain their transparency.

Insert them into your Storyline project when you need them. (Ctrl + J = insert image.) If your background is white, you won’t see them. Recolour the circle/oval/etc. using Storyline’s image formatting. Don’t forget”More Variations”.

To recolour the oval, click Recolor, More Variations then choose the colour.

My white, hand-drawn oval quickly becomes this lovely shade of greenbriar firemist, to match its topic.

And just like that, your hand-drawn asset takes on a colour from your custom Storyline theme.

In my current project, I’m using Camtasia to create videos and Storyline to manage the Table of Contents, the video playback and to produce a quiz. There are several modules with several sections and I like using these assets in Storyline and in Camtasia to make each piece feel more cohesive and connected to the next.

My topics in this module (below) are colour-coded. With white assets, I can recolour my circles and ovals to match the colour-coded sections within a module.

The white hand-drawn assets can quickly be recoloured.

The white hand-drawn assets can quickly be recoloured.

Tom Kuhlman did a great post a while ago about hand-drawn graphics. I’d love to know if anyone else uses this idea for their eLearning. Let me know in the comments. Maybe I’m the only one who is this crazy about colour!

Here’s my set of white hand-drawn assets you can use in your projects. (There are only 11 so don’t get super-excited.) j

Leave a Reply

Basic HTML is allowed. Your email address will not be published.

Subscribe to this comment feed via RSS