Disabling "Next" button until all layers and their respective timelines are complete

Nov 02, 2016

Hi everyone,

I am building a course for a client using Storyline 2. A few slides in the course have multiple items which need to be reviewed entirely before advancing to the next slide. I have set this up in the past using this method, which worked well for the needs of that course: 
https://www.articulate.com/support/storyline/how-to-disable-the-next-button-until-users-finish-interacting-with-a-slide

In the course I'm currently developing, the slides have layers with media on them. As I mentioned, this media must be completely veiwed before moving on to the next slide. 

I am having a hard time figuring out how to "force" the learner to completely view all of the content while retaining the functionality of the next button once certain conditions are met. 

What I am experiencing when I preview the course is that even once both buttons have been visited and the media on both has completed, the next button still does not work and the "incomplete" layer shows. The other issue is that the learner can still click the next button, bringing up the "incomplete" layer while in the middle of veiwing the media on the layers linked to the buttons.

I would use the built-in lightbox feature instead of layers, as the next button cannot be clicked when the lightbox is open, except the lightbox can be closed out at any time and that cannot be changed.

The client also does not want custom navigation buttons, so I am limited to the stock player navigation controls. 

I attached a screenshot to show how I have everything set up. 

The conditions in the attached screenshot are both set to = "true" when the media on that layer completes. 

23 Replies
Leslie McKerchie

Hi Kyle!

Based on that screenshot - it seems like your Slide5_complete variable is not changing, which allows the user to utilize the Next button. Have you verified that the variable is adjusting as expected? You may also want to set the state change of your Next button to be similar to allowing the user to utilize the button as this will prevent a 'broken' button.

Kyle Buckel

Hi Richard,

Thanks for the suggestion! Unfortunately, I don't see how that would make sure the learners go through all of the content or how they would get to the dummy slide, as the next button is not working. Could you elaborate a bit when you have time, maybe I'm missing the point?

Leslie McKerchie

Hi Kyle - you could add a variable reference on screen to display for testing. The other was just an observation, but setting the state change of the Next button from Hidden to Normal to be in-line with 'when' the user can click the Next button - such as when the Slide5_complete variable changes as mentioned above.

Kyle Buckel

Leslie,

Thank you!

I added the reference, and it did not change after both buttons were clicked or after the media was complete on both. I removed the conditions of the media needing to complete from the layers, and the variable changes as soon as both buttons have been clicked, so the issue lies with those conditions. The next button functions as it should with the conditions removed. 

Unfortunately, removing the conditions allows the learner to click the next button and advance to the next slide as soon as they click the second button. It doesn't matter which order they click the buttons in either, I tried it both ways.

I see what you mean about changing the state of the next button to normal when the Slide5_complete variable changes as well. I feel that would also work, if I could just figure out how to get that variable to change while still requiring the media on both layers to be played completely. 

Leslie McKerchie

So your trigger to adjust a variable when the media completed on the layer was what was not working, therefore not adjusting the subsequent variable? Have you tried a more specific variable, like adjusting when timeline reaches x? I'm not sure how you have your layers set up and if you were moving off the layer before the variable could adjust perhaps? Hard to tell when I cannot see the file. 

Kyle Buckel

Correct, both layer complete variables are both switching to true, but the slide5_complete variable is not switching to true.

I can duplicate the slides into a new project and upload the file if that would help? I'll have to remove some of the internal stuff but that shouldn't affect the way the slides work.

Kyle Buckel

Wendy and Leslie,

Thank you so much for the help! That works perfectly. 

In case anyone else runs into this in the future - I was setting up the conditions mentioned above on the base layer, which was causing my issue. Wendy set them up on their respective layers with an "and" condition and it works perfectly. 

Thank you both again for all of the help!

Leslie McKerchie

Hi Masa and welcome to E-Learning Heroes :)

You could set a condition on the Next button state change as well, so that it wouldn't always be hidden when you came back to a slide.

If you have a course that you are working to design, feel free to share your .story file so that we can help you figure out your requirements.

 

Karen Hawkes

Hi all and thanks Wendy for the file,

I have the same issue but instead of using the timeline to change the layers, I want to change to another layer when another button is clicked.

 

Scenario:

- I have 3 buttons ("A, B, C") that goes to their respective 3 layers ("Apple, Ball, Cat"). When you click a layer, you can move to another one, so on and so forth....

- The default player "Next" will only be clickable once all the layers have visited.

 

What I have done:

- show layer "Apple" when user clicks button "A" - created this trigger on all my layers

- show layer "Ball" when user clicks button "B" - created this trigger on all my layers

- show layer "Cat" when user clicks button "C" - created this trigger on all my layers

- on my Base Layer, I have created a variable "X" and assigned to "False"

- on my Base Layer, I have created a trigger: Set "X" to value "True" when the state of all the buttons are Visited

- on my Base Layer, I have created a trigger: Jump to the next slide when user clicks Next if "X" = value True

 

However, the "Next" is not working.

Can someone help please?

Thank you so much

 

 

 

 

Maria Costa-Stienstra

Hi, Karen.

Thank you for reaching out!

I followed your scenario and process described above, and my Next button behaved as expected:

Preview of the scenario where the next button becomes normal after layers are opened

I'm attaching the .story file so you can compare it with yours, but feel free to share what you have so far so we can help you troubleshoot.

I hope this helps!

Leith Bridge

Hi, I have looked at all of the information above along with other threads and I still can't seem to get this to work properly. I have attempted Variables, states and conditions.

I have buttons that go to layers and I need the next button to remain disabled until all layers have been visited.

If someone could please help it would be greatly appreciated. I have attached the base slide with no triggers.

Thanks in advance.

Maria Costa-Stienstra

Hi, Leith.

Thank you for sharing the .story file!

The reason your triggers don't work is that each layer has the same buttons (with their visited states) as the base layer, so the learner never returns to the base layer (therefore, those buttons never change to the visited state). 

Think of the layers as transparent sheets of paper you put on top of a drawing. You can still see the picture below (base layer), but it allows you to draw additional objects without affecting the original. There's no need to repeat the icons and triggers on each layer, as the learner can still click the buttons on the base.

Here are my suggestions:

  • Each layer should only have two objects: the oval and the text. Triggers are not needed on any layer.

Timeline showing objects on the layer

  • On your base layer, create a trigger to change the state of the Next button to Normal when all the Pictures are visited:

Trigger panel - change state of the next button to normal when all the pictures are visited

I'm attaching my suggestions here as an edited .story file.

Let me know if you have additional questions!