Video Demo: Articulate Storyline – Convert to Freeform: Emphasizing the Need to Double-Click

I was developing some neat emulations for one of my clients last week, when the client requested that I include an additional ‘feedback’ of sort to emphasize that the user must double-click if they merely single click during the emulation. Now, this wasn’t feedback-persay, so I didn’t include it in the feedback options, but I did struggle a bit getting the hotspot interaction to behave the way I needed it to, so I decided to do a little demo to explain how I had worked through this issue in Articulate Storyline.

To do this, I converted a screen to freeform (hotspot), and set up the feedback options to branch to the correct response and set the submission to behave on double-click. Initially, I had messed around with it by providing the correct hotspot and then putting a trigger on the base layer over the incorrect option, but then that would only show the prompt if the user selected the incorrect option – something that might not happen as often with 2 options versus 20 (as in the software). So to get the interaction to behave the way I wanted, I set up two hotspots in the convert to freeform editor: 1 large hotspot encompassing the entire screen, and 1 smaller hotspot encompassing the correct response. Then, I ensured the correct response was selected and saved.

When I returned to the development screen, I added a layer with some text “YOU MUST DOUBLE-CLICK!” and created a trigger on the base layer to display this new layer if the user clicks anywhere in Hotspot 1 (which in the convert to freeform editor was the incorrect hotspot which encompassed the entire screen).

On preview, we see that the screen now behaves the way I need it to. Single-clicking anywhere brings up the double-click layer prompt, double-clicking the incorrect option (in this case, Oliver, the dog) produces no response (in the software simulation, this brought up some feedback, but for simplicity, I didn’t include any feedback), and then double-clicking the correct option (in this case, Milo, the cat) takes the user to the correct slide.

Did my explanation confuse the heck out of you? Watch the demo, below!