One of my favorite hidden gems in Storyline 2 is an obscure feature called Recolor Art. It allows you to alter the color of an object within Storyline-not affecting the original art, but merely "recoloring" it within the project.
In my workflow as an Instructional Designer, I create my own artwork in Adobe Illustrator and export as transparent PNGs. This works out nicely, but there are times when I need to create rollovers from icons or buttons. I want to avoid returning to Illustrator to create separate versions. Enter "Recolor Art."
In the image below there are a few examples of icons you might use in your eLearning project. I'll demonstrate how to use Storyline's Recolor Art feature to alter the Hover state, creating a rollover.

To begin, select your artwork (remember, transparent PNGs work best) and open the States panel by selecting the word "States" at the bottom of the Storyline window.

Click Edit States, click New State, choose Hover from the drop-down menu, and then click Add.

You've created the Hover state; now you'll alter the appearance. With the Hover state still open, select the object on your slide. Then right-click and choose Format Picture.

Choose Picture from the menu at the left and then click the arrow next to Preset.

You'll find a number of options for recoloring your art, and you'll see the categories listed above the icons. No Recolor means you see your original image. Color Modes and Dark Variations are the ones that give the best result, for me. Experiment with Brightness, Contrast, and Transparency for different effects.
These are limiting however, so if you want more, go to Blend.
Choose a Color from the Blend section and apply a Blend Mode. These behave just like Photoshop Blend Modes and give you a variety of effects based on the color you choose.

If you don't like what you've done, you can click Reset Picture, or use Storyline's Undo command.
When you're done with Recolor, click Close. Lastly, and most importantly, click Done Editing States in the States panel to save the changes.
Here are examples of before (left) and after (right) applying the Recolor feature to an icon. It can always be removed later, and edited as needed. Any way you cut it, it's a real timesaver!


***
Looking for training on Articulate Storyline? Check out our live, online instructor-led Storyline classes.
Hi Sally. Excellent tips! Thanks for sharing.
It's a pitty though that you can not add other colors under the 'Color 'Modes option.
Posted by: Marcel van Lierop | February 12, 2015 at 05:30 PM
Thanks for the compliment, Marcel. I admit it's limiting but if you play with the Blend option and choose custom colors, you do have more options.
Posted by: Sally Cox | February 23, 2015 at 01:11 AM