TELic: A blog about Technology Enhanced Learning

Articulation 5: what’s the score?

If you’ve been following these posts from the start, you may remember that “The aim was to inform (hairdressers) about environmental issues and encourage them to adopt sustainable business practices that used less energy and water and created less waste.”

In the second post I described how learners could ‘like’ ideas they encountered and to see the savings that the idea could achieve:

My idea was to translate the costs and savings for each topic into a standard format that would give the energy, water and money savings each year if adopted by a small four-seat salon. As learners worked their way through the training, a running total could therefore be kept of the savings from all the ideas where they clicked the Like button, so they could easily see the amount saved and scale that up for their own salon if required. I suspected that although the energy and water savings would be seen as a good thing, it would be the substantial money savings that would really gain their attention.

This example shows how this process works in practice. Suppose a learner has just started exploring the virtual salon and finds the Hair Drying area:

This slideshow requires JavaScript.

These slides show some of my core design decisions:

• using a photo of the researcher, Denise Baden, as the human face
•  to introduce each area of the training.
• using photos and short texts for each idea that minimise the risk of tl;dr, which is always an issue with online training.
• using fresh, bright colours – especially the ‘green for Go’ Like button;
• only showing the savings when the learners have clicked the Like button, so I hoped they would be curious. Of course the more ideas they liked, the more impressive their total savings on the EcoPro slide, reinforcing the idea that lots of small savings add up to a very significant impact.
• I didn’t think many learners would want to see the calculations, but we needed to include them to show we hadn’t just plucked the figures out of thin air.
• although the environmental savings are energy (kWh) and water (000’s of litres), I needed to translate those into specific financial savings. Hair salons are businesses, so any investments in energy-saving technologies need to see a good return.
• some benefits, such as reductions in water pollution or giving good advice to customers, are difficult to express financially, so I used a ‘Good Deeds’ measure to identify and reward these.

The EcoPro slide used four variables; ENERGY, WATER, ENVIRONMENT and MONEY. These were updated when a learner clicked the Like button for the first time; I didn’t want multiple clicks to artificially inflate the EcoPro totals. So for example the Lighting slide’s Like button had four triggers, two of which were conditional on the Like button’s state:

Add 3645.00 to ENERGY
  When the user clicks
  If LikeButton's state is not equal to Visited

Add 510.00 to MONEY
  When the user clicks
  If LikeButton's state is not equal to Visited

Change state of LikeButton to Visited
  When the user clicks

Show layer Savings
  When the user clicks

It was easy to show the value of the variables on the EcoPro slide; all that was needed was to include the variable name in the text e.g. %ENERGY%.

During its first six months the resource was hosted on SCORM Cloud and data was collected from around 600 learners. This was analysed by Denise’s research project to identify which ideas were liked the most.

Hunting the Big Ideas

Part of the brief was to introduce learners to five sustainability concepts, which I called the Big Ideas; Climate Change, Carbon Footprint, One Planet Living, Sustainability and Water Scarcity. I decided to make this a treasure hunt; learners needed to collect (view) them all by finding five icons scattered throughout the areas and ideas. When they had visited seven areas they could view a list of direct links to all areas and Big Ideas – see Avoiding frustration in a previous post.

Note purple Big Idea icon

In the final post about this project, I’ll cover the playful aspects I included to try and make this training something that the learners would enjoy and recommend to colleagues.

Next: Articulation 6: playful learning

Articulation 4: trigger happy

In my previous post about the Sustainable Hairdressing project, I talked about the 40 triggers used to ensure that the salon panorama slide showed which areas had been already visited. But there were still a few more to add to provide a smoother user experience.

Providing guidance to the learners

The first was a trigger that showed a layer with instructions the first time a user visited the salon panorama – i.e. if the variable how2pan is True. I initially included an OK button to hide the instructions layer and set the variable to False, but feedback from test users made me simplify that by replacing it with a transparent rectangle covering the whole slide. This meant that the layer was hidden and the variable set to False wherever the user clicked – for example if they try to drag the slider while the instructions were visible. The same technique was used on a few other slides to display ‘just in time’ guidance the first time they were visited. Note the ? button at the lower left of the screen that re-displays this slide’s help if needed.

Users can click anywhere on this slide to hide the instructions

Avoiding frustration towards the end of the training

We didn’t want our learners to become frustrated when hunting for the last few areas, so I used the locs variable, which counts the numbers of areas visited, to make two changes when it reached 7.

1. The first was to change the state of a button called locHints from its initial Hidden state to Normal. Hidden buttons cannot be clicked and do not change the mouse cursor when rolled-over. When clicked, the button displays a slide with direct links to all areas, using button states to clearly indicate those that have already been visited.
2. The second was to display a layer with instructions, telling users they could click the locHints button to “see a list of location short-cuts”. An OK button is used to hide this layer.

Direct links to the three areas that still need to be viewed.

It’s probably worth emphasising how much this project relied on three core Storyline features:

1. Button States – where I changed the text colour and icon to show areas that had already been visited.
2. Variables – keeping track of which area and ideas had been visited, as well as some running totals such as energy savings.
3. Triggers – and especially conditional triggers that only took effect if one or more conditions were met, such as visiting an area for the first time.

Rewarding learners when they complete

Finally, when learners have visited all of the locations and the locs variable equals 10, a layer is displayed congratulating them and providing guidance on finishing the learning.

Learners see this when they have completed the training.

This splash screen is an example of how I tried to make the training more playful and motivational, from the ‘gift’ of fresh flowers to the language (10/10 and the big tick) and the key take-home message that “what is good for the environment is also good for your business”.

In the next post I’ll look at the other ways in which I used playful elements and gamification to try and make this training a fun and engaging experience for our learners.

Next: Articulation 5: what’s the score?