What is an action?
An action something you want to happen on the screen in response to a learner's behaviour. E.g. When a learner clicks another component (for example an image) on the page, or reaches a certain point in a video, the action will happen.
Input Actions you can choose from are:
- mouse button down
- mouse button up
- hover start
- hover end
Not every component offers every trigger, but all offer 'click'. Components such as video also have actions such as 'video complete', 'video paused', 'video reaches timetamp'... etc.
Output Actions you can choose from are:
- move to previous view
- move to next view
- move to view (then select which view)
- change another component's view (then select component and view)
- move to previous screen
- move to next screen
- move to screen (then select which screen)
Again, some components offer more output options such as video. Examples of additional video output actions are, 'pause media', 'play media', 'skip to media timestamp'... etc.
Adding More Information
If you choose an output action which needs you to add more information (e.g. 'move to screen' will require you to say which screen) then a second drop down box will appear underneath.
If the actions needs you to add even more information, a third and even fourth drop down box will appear containing all your possible choices at this moment.
E.g. This action below is being set up on this image component so that when someone clicks on it, the answer text underneath changes to the 'alternative' view, which displays the desired message.
Why would I use actions?
Actions help you create your own interactive, dynamic content. Rather than being limited to out-of-the-box, linear learning activities, you now have the freedom to design and create your own experiences. With such power, the sky is the limit! You can make any component behave in any specific way you want, in response to your learner.
Some examples of when you might want to add your own actions might be:
- Giving feedback to the learner, tips, hints, answers... etc.
- Taking the learning on a non-linear learning path, taking them back for revision purposes if they are not answering questions correctly
- Allowing a learner to control which section they go to next
- Creating fun activities such as flip cards and quizzes
How do I use actions?
Step 1: Set up your additional views/screens
Actions can be categorised into 3 types -
- actions which help a user navigate (e.g. move to screen)
- actions which impact the component which is currently selected (e.g. change view)
- actions which impact another component on the page (e.g. change another component view)
If you are using an action which affects a view, the first thing you need to do is create your new view(s) for that component. Go to 'Component Settings: Views' to find out how to set up views. Make sure you label your different views so that they make sense in your action editor.
If you are using an action which takes someone to a screen, make sure you have already created your new screen(s) so that they too show up in the action editor labelled with a name that makes sense to you.
Step 2: Add your action
Select the component you wish the learner to interact with. E.g. a button you want them to click, and go to 'actions' then '+ add action' and then name your action.
Step 3: Add your input and output
Next, choose the input and output of your action, e.g. 'click' and 'move component to view', then pick the target component you want to affect and the view you want it to change to.
Step 4: Test your action
Once you have set your action up, go to 'learner view' and 'reset screen state' to go back to the default. Then test your action!
Can I add more than one action to a view?
Yes! Add as many as you like. You might want several things to happen when someone clicks. You might even want to add more than one view to your button (like another layer) and because actions are linked to a particular view, you'll have a whole new blank canvas to work with for the new action.
Just want to do something fast and simple? Take a look at our 'simple' types of components, we've pre-wired some of the actions and views to speed things up for you.