When we teach interactive elements in our hands-on Articulate Storyline 360 training, someone will inevitably ask: “How do we keep learners from interacting until the narration ends?” This can be crucial in compliance-based e-Learning, ensuring the learners receive all content and don’t skip ahead. Let’s look at ways we can temporarily lock interactions for this “as heard in training” question.
As you’ll undoubtedly hear us say in training: “There’s always more than one way to accomplish it in Storyline 360.” Today, we’ll discuss three methods for temporarily locking interactions.
Method #1: Hotspot
At Yukon Learning, we frequently prevent interaction by covering items with a hotspot. Hotspots are invisible for the learner, but conveniently visible to us, so they work great for this!
For developers meeting accessibility requirements: Please note that this method does not prevent navigation via keyboard, so you may want to skip ahead to Method #2 below.
First, select Hotspot on the Insert tab and draw it like a shape over the interactive items!
Tip: In the Timeline, double-check that the hotspot is above your interactive objects, so we know it’s covering them.
Lastly, we want the hotspot to leave when the slide ends, so select the hotspot and add an Exit Animation to it from the Animations tab. (Any will do since the hotspot’s invisible. It’s your little secret!)
Method #2: States
Locking and unlocking interactive objects with states is great for accessibility!
With an interactive item selected, open the States panel, then in the “Initial state” drop-down, choose “Disabled.”
Tip: If you’re using Storyline 360 Buttons, the Disabled state will be ready to go! However, if you don’t see the Disabled state in the initial state drop-down, you could choose Edit States first to add the Disabled state to your interactive items or format paint the Disabled state from a Button onto your interactive objects!
Once your interaction is entirely disabled or locked down, to finish this build, we’ll unlock it all again by switching to the Normal state when the narration ends.
Add this trigger for every Disabled object in your interaction: Change the state to Normal when timeline ends on this slide.
Method #3 Layer
Like the hotspot in Method #1 above, we could also use a layer to act as an invisible pane of glass covering the interaction. But like Method #2, we’ll use triggers to activate it.
First, create a layer and then, by right-clicking it or using the gear icon in the Layers pane, turn it into a barrier by enabling the Layer Property: “Prevent the user from clicking on the base layer.”
Finally, we’ll add two triggers on the base slide to cover and uncover the interaction. (Make sure you select “Base Layer” in the Layers pane to create the triggers on the slide, not the layer!)
Create this trigger to cover the interaction: Show layer when the timeline starts on this slide.
Create this trigger to uncover the interaction: Hide layer when the timeline ends on this slide.
See? We aren’t kidding when we say there’s always another way to build it in Storyline 360! Hopefully, when asked if you can slow down your fastest clickers, you’ll be prepared with options…and everyone loves options. Let us know your favorite method in the comments below.
Plus, check out this blog post from The Articulate Trainer to ensure learners explore interactions in sequence!