Hey everyone, I have created a video on how to create a progress bar in Storyline 360 - using only one built-in variable. I'm using the built-in variable Menu.Progress in the slide master.
Prior to recording this I only found solutions where you add triggers on the slides where you want your progress bar to fill up. You needed an extra variable to keep track of your progress and you would also have to put some kind of check in place, so that the progress bar doesn't fill up if you revisit a slide. If you create your progress bar this way, you have to make many adjustments when you add or delete slides in your project.
What I found is that you can use the built-in variable Menu.Progress to get rid of this hassle. I wanted to share this with you because I think it saves a lot of time in production and maintenance of your course.
Hi Diane, sorry, when i posted before, it was with the wrong account, then when i tried to post with the right account, the post got reported. I hope that this third post will now show up. To your first questions: No it's not limited to one scene. It works with multiple scenes. I've attached a file where i split the slides into two scenes. Then i went to: View Tab → Slide Master: Then i clicked on the very first Slide of the slide master and in the trigger panel i changed the conditions of all triggers that are associated to the Progress bar. Because now i want to display the progress in the individual scene that the learner is currently viewing, i changed the conditions from "if "Menu.Progress"..." to "if "MenuSection.Progress" ...". Why did i use MenuSection.Progress and not Scene.Progress? With MenuSection.Progress only slides that are in the menu will be counted. This helps me, when i want to exclude a slide from the count. Then i just delete it from the menu. For example, when i use a menu slide in the beginning, that i don't want to have counted.
Your second question: displaying the progress for each scene individually is a bit tricky, because the built in progress variables work with the currently shown scene/MenuSection. I will try to think of a solution, but it will probably contain a lot more triggers and work, especially if slides are deleted or added later on.
Well i hope, at least i was able to help you with your first question. So please let me know, if my instructions and the attached file were helpful to you. Cheers, Georg
Thanks so much Georg for taking the time to do this. I'll come back to it when I'm a bit more experienced as I can't get that to work at the moment - could be my inexperience with slide masters! I'll bookmark this for future reference :)
I have a question - I have a progress bar that I set for the project.progress but one part is a real-life exercise and in fact you don't click on all the slides which means that if you do well then you only get to 70% completion. The same is true for menu.progress as it works as a percentage. Is there any way around this?
Great question, Katie! I believe you can exclude certain slides by going to the Insert tab, clicking on Slide Number, then Exclude Slides. From there, you can de-select the slides you don't want to include in the count. Here's a screenshot for reference:
I have followed the instructions, but I am not seeing the progress bar on my slides, I would want them to show on all the slides (I assume it should). Also, does the Menu have to be turned on? We don't generally turn on the menu as it tends to be problematic when we post it (we do not have a LMS at this time, we post on the web).
I seem to be getting it to work across multiple scenes ok, but it only seems to work one way. When I move back to previous slides, the progress bar stays in the same position. It looks like I have all the triggers setup correctly (see image). Can you see anything missing?
Hi Chris, with this approach your progress bar will fill up when the learner moves through your slides. But it will not shrink when the learner moves backwards. The variables are just set up that way, which i think is a good thing, because i wouldn't want a learner to loose progress just because of looking something up in previous slides.
You could use a separate slide master assigned to the menu, add your progress bar on that menu page slidemaster, add a custom variable at the end of each section in your SL file to indicate the section is complete then use those variables which then change the state when the timeline starts on this page for the menu. It will only affect the menu progress bar and not the progress bars across the rest of the module/scenes. At least in theory... will need testing.
(edited to add - I didn't see there was already a response to this - sorry! hope you got it resolved)
What if we want the progress bar to show progression in an assessment and we want to have it indicate if each individual answer is correct or incorrect (i.e. blue for correct and red for incorrect; Q1 or 10% blue, then Q2 or the next 10% red, and so on)? I'll add that questions are placed in a question bank in order to randomize them. I'm feeling a bit lost and overwhelmed by this requested solution and am beginning to think there isn't a way to determine individual answers status (i.e. correct/incorrect) that have a relative position - due to the question randomization - is possible. What do you think here?
I have followed the instructions, but I can see the progress bar only on my first slide. I am sure I am missing something important. I have recorded an application and converted them into slides. Can you please help me with this?
Hi Shilpa, the screen recordings on the slides appear in front of the progress bar. The progress bar is actually a part of the slide master, so it will only be visible if there's no content occupying the area where the progress bar is supposed to be. Normally, I would suggest cropping elements that hide the progress bar, but in your case, the screen recordings are integrated into the slide itself.
I attempted resizing your slides without using the "Scale to existing content to fit" option, but unfortunately, it didn't resolve the issue. I'll need to further consider this matter, but it's possible that the step-by-step screen recording and this progress bar may not work well together.
Thank you for the immediate response. Currently, the published file is showing the progress bar for each slide, which is a little distracting. Hence I thought the solution you offered would be perfect for my project.
I want to use a single progress bar for my project, which has one only scene.
i've reviewed your project and noticed two things. Firstly, there are no interactive elements for the learner, meaning they don't have to click or interact with anything. Secondly, I believe it would be beneficial to have the ability to go back in the sequence and review certain parts.
Considering these factors, I would recommend publishing the project as a video in .mp4 format. This way, you would automatically get a progress bar. If the target system doesn't support video playback directly, another option would be to publish the project as a video and then insert that video into a Storyline project. In this case, make sure to enable video controls while disabling any player menus and controls.
Here's a solution for making the progress bar work only on one scene:
Start by duplicating the Slide Master in which you created the progress bar.
In one of the duplicated Slide Masters, either remove the progress bar or move it outside of the slide. Let's refer to this duplicated Slide Master as the "No Progress Bar Master."
Apply the layout of the No Progress Bar Master to all the slides where you don't want to see the progress bar. To do this, right-click on the slide, choose "Apply Layout," and select the same layout that is currently selected but from the No Progress Bar Master.
Ensure that you're using either the variable MenuSection.progress or Scene.progress for your triggers in the Slide Master with the progress bar.
I've attached an example project for your reference. I hope this helps!
I viewed Allison's approach at length yesterday and thought it was great. I was about to implement her solution, when my manager cautioned me on two things: 1. for someone who uses the previous button and reviews sections already completed (which also occurs for the LMS testing/review teams), the variable used shows the progress of that previously viewed section which appears to have progressed backwards. 2. For ADA compliance, we build every course with extensive effort for a user that's using a screen reader. The reader reads the %completion of the previously completed sections if they revisit using the previous button, even if they've already completed sections ahead. This occurred even when one of our top designers used a javascript solution which worked iwonderfully to combat problem 1. above. However, the ADA reader read the percentage pertinent to already visited section. We don't seem to have a dynamic solution which handles these issues, so we opted to use a state change and triggers on a rectangle shape on our course section slides.
53 Replies
This post was removed by the author
This post was removed by a moderator
Hi Diane, sorry, when i posted before, it was with the wrong account, then when i tried to post with the right account, the post got reported. I hope that this third post will now show up. To your first questions: No it's not limited to one scene. It works with multiple scenes. I've attached a file where i split the slides into two scenes. Then i went to: View Tab → Slide Master: Then i clicked on the very first Slide of the slide master and in the trigger panel i changed the conditions of all triggers that are associated to the Progress bar. Because now i want to display the progress in the individual scene that the learner is currently viewing, i changed the conditions from "if "Menu.Progress"..." to "if "MenuSection.Progress" ...". Why did i use MenuSection.Progress and not Scene.Progress? With MenuSection.Progress only slides that are in the menu will be counted. This helps me, when i want to exclude a slide from the count. Then i just delete it from the menu. For example, when i use a menu slide in the beginning, that i don't want to have counted.
Your second question: displaying the progress for each scene individually is a bit tricky, because the built in progress variables work with the currently shown scene/MenuSection. I will try to think of a solution, but it will probably contain a lot more triggers and work, especially if slides are deleted or added later on.
Well i hope, at least i was able to help you with your first question. So please let me know, if my instructions and the attached file were helpful to you. Cheers, Georg
Thanks so much Georg for taking the time to do this. I'll come back to it when I'm a bit more experienced as I can't get that to work at the moment - could be my inexperience with slide masters! I'll bookmark this for future reference :)
I have a question - I have a progress bar that I set for the project.progress but one part is a real-life exercise and in fact you don't click on all the slides which means that if you do well then you only get to 70% completion. The same is true for menu.progress as it works as a percentage. Is there any way around this?
Thank you, I'll have a look :)
Great question, Katie! I believe you can exclude certain slides by going to the Insert tab, clicking on Slide Number, then Exclude Slides. From there, you can de-select the slides you don't want to include in the count. Here's a screenshot for reference:
I hope that helps!
Hey Sarah! thanks for that it works exactly as I want.
This post was removed by the author
I'm happy that helped! 🙂
I have followed the instructions, but I am not seeing the progress bar on my slides, I would want them to show on all the slides (I assume it should). Also, does the Menu have to be turned on? We don't generally turn on the menu as it tends to be problematic when we post it (we do not have a LMS at this time, we post on the web).
Hi Karen, if you’re willing to post your .story file, i could take a look. And no the menu doesn‘t have to be turned on.
I seem to be getting it to work across multiple scenes ok, but it only seems to work one way. When I move back to previous slides, the progress bar stays in the same position. It looks like I have all the triggers setup correctly (see image). Can you see anything missing?
Hi Chris, with this approach your progress bar will fill up when the learner moves through your slides. But it will not shrink when the learner moves backwards. The variables are just set up that way, which i think is a good thing, because i wouldn't want a learner to loose progress just because of looking something up in previous slides.
This solution should work across multiple scenes.
You could use a separate slide master assigned to the menu, add your progress bar on that menu page slidemaster, add a custom variable at the end of each section in your SL file to indicate the section is complete then use those variables which then change the state when the timeline starts on this page for the menu. It will only affect the menu progress bar and not the progress bars across the rest of the module/scenes. At least in theory... will need testing.
(edited to add - I didn't see there was already a response to this - sorry! hope you got it resolved)
Hi Georg,
What if we want the progress bar to show progression in an assessment and we want to have it indicate if each individual answer is correct or incorrect (i.e. blue for correct and red for incorrect; Q1 or 10% blue, then Q2 or the next 10% red, and so on)? I'll add that questions are placed in a question bank in order to randomize them. I'm feeling a bit lost and overwhelmed by this requested solution and am beginning to think there isn't a way to determine individual answers status (i.e. correct/incorrect) that have a relative position - due to the question randomization - is possible. What do you think here?
This post was removed by the author
I have followed the instructions, but I can see the progress bar only on my first slide. I am sure I am missing something important. I have recorded an application and converted them into slides. Can you please help me with this?
Hi Shilpa, the screen recordings on the slides appear in front of the progress bar. The progress bar is actually a part of the slide master, so it will only be visible if there's no content occupying the area where the progress bar is supposed to be. Normally, I would suggest cropping elements that hide the progress bar, but in your case, the screen recordings are integrated into the slide itself.
I attempted resizing your slides without using the "Scale to existing content to fit" option, but unfortunately, it didn't resolve the issue. I'll need to further consider this matter, but it's possible that the step-by-step screen recording and this progress bar may not work well together.
Hi Georg,
Thank you for the immediate response. Currently, the published file is showing the progress bar for each slide, which is a little distracting. Hence I thought the solution you offered would be perfect for my project.
I want to use a single progress bar for my project, which has one only scene.
Hi Shilpa,
i've reviewed your project and noticed two things. Firstly, there are no interactive elements for the learner, meaning they don't have to click or interact with anything. Secondly, I believe it would be beneficial to have the ability to go back in the sequence and review certain parts.
Considering these factors, I would recommend publishing the project as a video in .mp4 format. This way, you would automatically get a progress bar. If the target system doesn't support video playback directly, another option would be to publish the project as a video and then insert that video into a Storyline project. In this case, make sure to enable video controls while disabling any player menus and controls.
Best regards, Georg
Thanks Georg! You have been very helpful.
I have several scenes too. Has anyone figured out a way for it to work only on one scene?
Hi Orv,
Here's a solution for making the progress bar work only on one scene:
Start by duplicating the Slide Master in which you created the progress bar.
In one of the duplicated Slide Masters, either remove the progress bar or move it outside of the slide. Let's refer to this duplicated Slide Master as the "No Progress Bar Master."
Apply the layout of the No Progress Bar Master to all the slides where you don't want to see the progress bar. To do this, right-click on the slide, choose "Apply Layout," and select the same layout that is currently selected but from the No Progress Bar Master.
Ensure that you're using either the variable MenuSection.progress or Scene.progress for your triggers in the Slide Master with the progress bar.
I've attached an example project for your reference. I hope this helps!
Cheers, Georg
I viewed Allison's approach at length yesterday and thought it was great. I was about to implement her solution, when my manager cautioned me on two things: 1. for someone who uses the previous button and reviews sections already completed (which also occurs for the LMS testing/review teams), the variable used shows the progress of that previously viewed section which appears to have progressed backwards. 2. For ADA compliance, we build every course with extensive effort for a user that's using a screen reader. The reader reads the %completion of the previously completed sections if they revisit using the previous button, even if they've already completed sections ahead. This occurred even when one of our top designers used a javascript solution which worked iwonderfully to combat problem 1. above. However, the ADA reader read the percentage pertinent to already visited section. We don't seem to have a dynamic solution which handles these issues, so we opted to use a state change and triggers on a rectangle shape on our course section slides.