I'm using a slider as my progress meter with triggers and variables based on this fantastic share by Carey Glenn in this thread. I love how it works and looks so seemless to the learner. However, it requires that the slides be set to "resume to saved state" because it uses a Visited Flag/radio button to track slides visited and adjust the variables.
That's causing issues because I have slides that advance automatically. If a learner gets out of a scene and goes back in to review, they can't go back to any of the slides that have already advanced. But if I set it to "reset to initial state" the slides can be counted more than once.
Is there any way to make the state of a radio button count only once without setting slides to "resume to saved state" or is there another way to accomplish the progress meter with progress bar?
I've attached one section of my course that hopefully makes what I've explained clear.
This might be a bit overkill for just one quirk, but this takes care of the "resume saved state" issue. You'll need to change some things if you want a progress meter using a slider, but...
I did consider your beautiful method when I was designing. But if I understand correctly, it is limited by 16 slides per chapter - and I will have scenes or chapters that exceed that drastically (simulations).
Because 16x16=256 triggers for some functionality on the masters. 20x20 would have meant 400. It's was just a matter of design and time constraints at that point.
You can, but you will need to create additional shapes, triggers associated with these shapes, change calculations inside the main JS triggers, change triggers that calculate progress shape states, insert additional JS etc.
The demo will give some insight on how it all works. It is possible to update it, but it will take a lot of your time. If you feel you're going to use it on more than one occasion/course then go for it, but if not...
I see there is a trigger to execute JavaScript on the master. I've got 4 progress meters, so I need 4 separate masters. So I'll need 4 sets of variables as well. Can I just alter the script with the new variable names for each master, or will I need to make other changes to it?
I won't be able to use the template, since we have our own menu design and progress meter design, but if I can figure out how to use your concept and js in my design - I'll be in heaven :)
You will save quite a lot of time if you do the opposite. Use the 'toolkit' story as base and change the design of shapes to match your design. That way, triggers and internal logic will be unaffected.
I wanted to separate the design from the logic as much as possible, so they don't interfere.
So in order to make the menu objects changeable, I had to resort to a lot of workarounds so there's no "tampering" of the internal logic. i.e. it's easy to change the look and feel and/or use your own progress meter states, but if you need to change the logic behind it, it'll be veeeery complicated.
My needs are much simpler than your design. I have four meters and percentage trackers on the progress slide to reflect the number of unique visits to a slide in each of the four chapters.
I have 3 types of variables for each chapter (ScreensInChapter, ScreensPercentChapter and ScreensVisitedChapter). The master slide for each chapter includes a radio button that marks the slide as visited, which changes the ScreensVisitedChapter variable to +1. But this is where it has to be set to "resume to saved" because it will keep adding 1 each time the slide is visited otherwise.
I think I understand what you're saying. But am I right that to make your template work for me I'd need to remove/ignore the layers on the menu or would I use one of the layers to display my 4 chapter progress meters?
I'm sorry - I'm not sure I'm grasping how to use your template.
The point of the template as is, is that you can modify one variable ("SlidesPerChapterArray") and the whole table of contents is constructed automatically, and the progress bar for the course just works on its own.
Coming back to your scenario, since you're not viewing the contents of the chapters (i.e. the slides within them), you can ignore the 2nd layer('Slides') and reroute the chapters to the relevant slides manually.
However, since there's no individual progress bar per chapter, you will need to calculate these using Javascript.
A completed/visited slide holds the value of 1, a non visited one is 0. This is all held in one single text variable (256 zeros separated by a space "0 0 0 0 0 0 0 0 0 .... 0") that turns into an array using Javascript, then once the calculations are done, is turned back into a text variable, so Storyline can accept it.
So in this case you will need some (4) number variables to hold the percentage of the completed slides per chapter (say var 'ch1completePct'). This basically translates to : (completedSlideInChapter1/totalSlidesInChapter1)*100 = ch1completePct
But in order to track completedSlideInChapter, we should identify the range first (i.e. where to look for the status of each individual slide). For example for chapter 1 the range is 1 to 16, for chapter 2 it's 17-32 etc. (yours will differ depending on how many slides you want to support per chapter - if it's 20 then the ranges will be 1-20, 21-40 and so on).
totalSlidesInChapter on the other hand is easy to calculate in javascript, as it is already set on "slidesPerChapterArray" (another text variable holding 16 numbers in the form of "5 3 8 5 0 ... 0"), so all we need to do is seek the relevant value. That can be done by the following statement: totalSlidesInChapter1 = slidesPerChapterArray[0]; totalSlidesInChapter2 = slidesPerChapterArray[1]; totalSlidesInChapter3 = slidesPerChapterArray[2]; totalSlidesInChapter4 = slidesPerChapterArray[3];
I really appreciate all your time trying to help me. I'm just not sure I have the knowledge/expertise to grasp your directions and to adapt your template for my use.
14 Replies
Hi Sherrie,
This might be a bit overkill for just one quirk, but this takes care of the "resume saved state" issue. You'll need to change some things if you want a progress meter using a slider, but...
Hope it helps,
Alex
Thanks Alexandros,
I did consider your beautiful method when I was designing. But if I understand correctly, it is limited by 16 slides per chapter - and I will have scenes or chapters that exceed that drastically (simulations).
Am I misunderstanding this? Why 16?
Because 16x16=256 triggers for some functionality on the masters. 20x20 would have meant 400. It's was just a matter of design and time constraints at that point.
OH! So it's a design limitation, not a Storyline limitation? So I could adjust it in my own design? I totally misunderstood that!
Thanks Alexandros - I'll give this a try!
You can, but you will need to create additional shapes, triggers associated with these shapes, change calculations inside the main JS triggers, change triggers that calculate progress shape states, insert additional JS etc.
The demo will give some insight on how it all works. It is possible to update it, but it will take a lot of your time. If you feel you're going to use it on more than one occasion/course then go for it, but if not...
I see there is a trigger to execute JavaScript on the master. I've got 4 progress meters, so I need 4 separate masters. So I'll need 4 sets of variables as well. Can I just alter the script with the new variable names for each master, or will I need to make other changes to it?
Yeah, I'm building the template for a set of courses that will probably exceed 20, so if I can get this part working now, that would be great.
I won't be able to use the template, since we have our own menu design and progress meter design, but if I can figure out how to use your concept and js in my design - I'll be in heaven :)
What are your meters supposed to do exactly?
The one's built in in the story are:
Overall Course progress (pct) - One flat & another rounded one
Chapters Complete
Chapters Remaining
Slides Complete
Slides Remaining
Here's the explanation of the most important variables.
You will save quite a lot of time if you do the opposite. Use the 'toolkit' story as base and change the design of shapes to match your design. That way, triggers and internal logic will be unaffected.
I wanted to separate the design from the logic as much as possible, so they don't interfere.
So in order to make the menu objects changeable, I had to resort to a lot of workarounds so there's no "tampering" of the internal logic. i.e. it's easy to change the look and feel and/or use your own progress meter states, but if you need to change the logic behind it, it'll be veeeery complicated.
My needs are much simpler than your design. I have four meters and percentage trackers on the progress slide to reflect the number of unique visits to a slide in each of the four chapters.
I have 3 types of variables for each chapter (ScreensInChapter, ScreensPercentChapter and ScreensVisitedChapter). The master slide for each chapter includes a radio button that marks the slide as visited, which changes the ScreensVisitedChapter variable to +1. But this is where it has to be set to "resume to saved" because it will keep adding 1 each time the slide is visited otherwise.
I think I understand what you're saying. But am I right that to make your template work for me I'd need to remove/ignore the layers on the menu or would I use one of the layers to display my 4 chapter progress meters?
I'm sorry - I'm not sure I'm grasping how to use your template.
The point of the template as is, is that you can modify one variable ("SlidesPerChapterArray") and the whole table of contents is constructed automatically, and the progress bar for the course just works on its own.
Coming back to your scenario, since you're not viewing the contents of the chapters (i.e. the slides within them), you can ignore the 2nd layer('Slides') and reroute the chapters to the relevant slides manually.
However, since there's no individual progress bar per chapter, you will need to calculate these using Javascript.
A completed/visited slide holds the value of 1, a non visited one is 0. This is all held in one single text variable (256 zeros separated by a space "0 0 0 0 0 0 0 0 0 .... 0") that turns into an array using Javascript, then once the calculations are done, is turned back into a text variable, so Storyline can accept it.
So in this case you will need some (4) number variables to hold the percentage of the completed slides per chapter (say var 'ch1completePct'). This basically translates to : (completedSlideInChapter1/totalSlidesInChapter1)*100 = ch1completePct
But in order to track completedSlideInChapter, we should identify the range first (i.e. where to look for the status of each individual slide). For example for chapter 1 the range is 1 to 16, for chapter 2 it's 17-32 etc. (yours will differ depending on how many slides you want to support per chapter - if it's 20 then the ranges will be 1-20, 21-40 and so on).
totalSlidesInChapter on the other hand is easy to calculate in javascript, as it is already set on "slidesPerChapterArray" (another text variable holding 16 numbers in the form of "5 3 8 5 0 ... 0"), so all we need to do is seek the relevant value. That can be done by the following statement:
totalSlidesInChapter1 = slidesPerChapterArray[0];
totalSlidesInChapter2 = slidesPerChapterArray[1];
totalSlidesInChapter3 = slidesPerChapterArray[2];
totalSlidesInChapter4 = slidesPerChapterArray[3];
See? It's all easy as pie... :P
My head just exploded a little bit LOL
I really appreciate all your time trying to help me. I'm just not sure I have the knowledge/expertise to grasp your directions and to adapt your template for my use.
This discussion is closed. You can start a new discussion or contact Articulate Support.