Recently I wrote two parts of a three-part series on how you can take a piece of content and turn it into a variety of interactivity types. For example, I turned this blah PowerPoint deck on ‘how to sell …”

View Before Slides

... into a fun, interactive drag-and-drop (Transform Boring Content into a Fun Drag-and-Drop) as well as a hover-and-reveal interaction (Here’s How I Transformed This Static E-Learning Content).

I’m pleased to present the third and final part of this series: the click-and-reveal. Let me explain a few of the tricks I used to turn plain text content into this polished-looking interaction.

View After Slides

Chunk Content with Layers

In our “before” example, all of the content is laid out on two slides, making for a lot of text per slide. The first thing I did was use Articulate Storyline’s layers to create a layer for each step in the selling process. Then, I chunked out the content so each layer displayed the info for just one step. This way, the learners can click through the steps one at a time and consume the content at their own pace, instead of being overwhelmed with lengthy paragraphs.

Incorporate Fun Character Poses

In addition to creating a layer for each step in the process, I added in a different character pose for each step. I tried to associate the pose of the character to match the step in the process, and I think it adds a fun, personal element to the content.

Use Animations

Another simple technique for presenting content in a more smooth and sophisticated fashion is to use simple animations on your objects. Having a text heading fly in, and then timing your text and on-slide content to appear in a certain order, can have a huge impact on how learners take in and retain the information that you’re presenting to them.

A few other things I’d like to call out about this interaction: you’ll notice I’ve eliminated the default gray Storyline player completely to give my course a seamless look. I’ve also applied a dark background color. Here’s an article that explains how to create an invisible player.

Another trick I used to create this click-and-reveal is the button set. I applied a button set to the numbered circles that display the layers with the content. With the button set in place, it means that only one circle at a time can show the selected state. If you don’t currently use button sets, they are a MUST and a huge time-saver, so do yourself a favor and learn more about them here: A Great Storyline Timesaver: Button Sets.

If you enjoy this numbered Storyline 2 click-and-reveal interaction, you'll be pleased to know a free, downloadable version is also available. 

Questions or feedback? Please leave a comment below. And follow us on Twitter and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning.

18 Comments
Nicole Legault

Hi Leslie! Are you on the latest update of Studio? Because I've definitely created tabs interactions in Powerpoint, where I used Actions/Hyperlinks to create the links between slides, and it always works fine for me when I publish with Presenter. Here's a few examples of some PPT tabs interactions I've published through Presenter, that work fine. - https://community.articulate.com/download/ppt-template-tabs - https://community.articulate.com/download/powerpoint-fun-colorful-tabs-template - https://community.articulate.com/download/powerpoint-tabs-template-3 And there are many more available in the Powerpoint section of the Downloads hub: https://community.articulate.com/downloads/templates/powerpoint If you're on the latest version of Presenter and you're still experiencing ... Expand

Nicole Legault