Video Customization in Storyline
Dec 06, 2022
Hello E-Learning Heroes,
I've done some digging through FAQs and Youtube tutorials but still can't find a workaround to get my embedded video to react how I need in Storyline.
I currently have the 'Video Controls' in my content selected as 'Show None' so our Franchise Store learners cannot fast forward through the content. What I would like to happen, if possible, is have the 'Video Controls' flip to 'Dark/Light' and have access to the controls if they need to return to the video.
This'll prevent the learner from having to sit through a whole video if they're searching for a particular spot in the video once returning to the slide.
My first thought was to have a different state for the video but that is currently not an option. I've messed around with Variables as well but continue to have trouble.
Any advice, video examples, documents to point me in the correct direction will be a huge help! Thank you.
- Don
1 Reply
Don, if I'm understanding correctly, you have imported a video, your project is using the Modern player and you're using the latest (or at least fairly recent) version of Storyline 360.
If that's the case, then you have discovered that the video controls only appear when the user hovers their mouse pointer over the video. So the solution is to draw a 99% transparent (no border) rectangle over the video, but change the state of that rectangle to hidden when the user returns to that slide. You can keep track of whether the user has visited the slide before with a simple True/False variable. The variable should be False by default but changed to True when the slide's timeline ends. Hide the rectangle when the timeline starts if your variable's value is True.
One other thing to keep in mind is accessibility and TAB order. A user could tab to the video, which will give it focus, which in turn cause the video controls to appear even if the mouse pointer isn't over it. So remove the video from the tab order. You can place a shape on the screen beneath the video that users could tab to in order to have a screen reader read Alt-text you add that would describe the video activity.