This demo was developed for the Articulate e-Learning Heroes weekly challenge #271 Using True/False Variables in e-Learning which indicated that variables can be tricky if you’ve never used them.
I am very familiar with true/false variables as they have a wide application in e-Learning course design and development. However, toggle variables, whilst a relatively easy concept to understand, take a bit more effort to develop.
Applying these concepts to an interactive e-Learning demo is not too difficult – but you’ll need to know how to work with object states, triggers and variables [in Storyline 360].
Because I wanted to utilise the concept of turning a light on and off, I felt I needed to make the learning interface quite dark – it took me some time to settle on this background, and then to source characters to use that suited this dark, somewhat dreary design. So, thanks to the Articulate Content Library 360, I found Antonio and Brandon…
I had been inspired by something I saw from another designer who had made their characters a little more ‘cartoon-like’ (heads a bit larger than normal) and I thought this might work well with this design.
If you work with PowerPoint, you can insert characters from the Articulate Content Library 360 group in the Articulate tab directly onto a PowerPoint slide using exactly the same method as you do in Storyline 360. I know this because I spend a lot of time working in PowerPoint. In fact, you can access a whole range of things and use them in PowerPoint using the Articulate add-in, which I understand leverages off Articulate Presenter.
All of the assets I used in this design were developed in PowerPoint, including working with the character head size, the silhouettes, light switch and the light (removing a white background and making the light darker for the ‘Off’ state. For the characters, I did also use PowerPoint’s ‘Artistic Effect’ to make them a little more cartoon like.
The functionality of the switches and light beams was easily developed in Storyline 360 using states, triggers and true/false variables.
The toggle variable is the key one here – you need to change the Variable setting in the Trigger Wizard from “= Set” to “Toggle”. I think this has changed recently in Storyline 360 as I couldn’t find any updated documentation on this.
For the character reveal I used separate slide layers and for the character choice I used true/false variables.
The few examples I saw when looking for inspiration were of things like a Xmas tree, turning the lights on and off – which may have limited application in a learning environment!
Just how you would apply the toggle variable in an e-Learning course setting is up to your imagination. In the right context I think this could be engaging, although a bit gimmicky – but I think my final design is quite effective and illustrates how you can use true/false variables to choose a character, and to turn a light on and off!
Click on the image at the top of the page to view the interactive version of this demo.