Forum Discussion
Add a progress bar to the Storyline Player.
Following along another tutorial, I was able to figure out how to add a dynamic progress bar to the Storyline course player. No more having to adjust your slide designs to make room for a progress bar nor do you have to mock it up to make it look like it's on the player. This progress bar is actually placed in the course player next to the course title.
If you can't don't have access to youtube, you can read the tutorial on my blog.
Hi Jerson!
Thanks for taking the time to share this with the community! I'm sure other authors will find these steps very useful!
Have a great rest of your week!
Great. Thank you, Jerson.
This is great - but I can't get the progress bar to advance through the question slides - any ideas?
I figured it out! I'd added the triggers to the wrong master slide!
Awesome.
HI Jerson! This works well when on the Base Layer of the Master Slide, but is not working when I add to a Slide Layer. I have to add to the Slide Master Slide Layer because I want this bar to appear in my Screen Recording Scenes. Since the recording/images are baked in to the background, putting it on the Base Layer means it will not show up. Any suggestions?
Hi Stephanie, this is meant to go on the course player, not the slide area. There is another tutorial done by another group that shows how you can add it to the slide area. I think I mention them in my video.
Great solution, thank you so much for sharing!
I have a similar problem as Stephanie, though: Is it somehow possible to include layers in the percentage calculation?
Example:
I have a project with 10 slides. Slide 1 has only the base layer, slide 2 has 10 sub layers that are processed one after the other. Both slides equal 10 percent on the progress bar, although slide 2 makes up a much larger proportion of the overall training. How could this be avoided? Do I need to converted all my layers into individual slides, then hide them in the TOC and choose the project.progress variable instead of menu.progress?In order to do this you'll have to create your own calculations for the progress variable percentage. Calculate your total slides+layers, then you'll have to track the slides and layers viewed using other variables. Then you'll have to divide the slides and layers viewed by the total and make that equal the progress variable percentage.
Another option is to set the progress variable on each slide and layer by the using a trigger. Instead of setting it to equal the project.progress or menu.progress, you can just set it 10 (10%), 20 (20%), etc. The issue with this is that when they go backwards in the course it might set the progress bar back again unless you add conditional statements.
I have tried to add a variable that increments with every slide/layer change. However, dividing this value by the total number of slides/layers and then matching the result with project.progress hasn't worked for me (yet).
Another question: Is it possible to place the progress bar in the title row of the TOC panel? Next to the menu or notes links?
Hi Jerson,
Thanks for this. I'm a novice, just started using articulate storyline. Quick clarification kindly, which code is being copied into the javascript?
Thanks,
Edna
