Is there a way to lock or hide the Next button on the player until after all elements on the screen have been selected? I'm finding that learners are missing some items on the screen.
Set the state of the Next button as disabled/hidden.
Add triggers (true/false) to every element you want user to click before continuing. Then finally add a trigger to change the button state if all the true/false conditions are done.
Thank you for your reply. I'm using the Next button on the default player but can't see how to change the state of the Next button when selecting the trigger Action "Change state of" - Next button is not in the drop down list. Or am I missing something really obvious.
Do I need to create my own navigation buttons to make this work as per your example?
Unfortunately, you can't apply any states to the default player controls so you can't apply a visual to the 'Next' button to indicate that it has been disabled.
However, you can 'disable' it using the method Joanna has described or you can simplify the process by using the selected or visited states of your on-screen elements as conditions.
Your trigger on the 'Next' button should look something like this:
Action: Jump to slide
Slide: next slide
When: User clicks
Object: Next Button
On condition: Shape A AND Shape B AND Shape C etc. are equal to Selected
Thank you both for helping. It's working using the Selected state. Just one more question ... do you have to use 'Selected' or could you get the same result using any of the states, e.g. Visited or Hover?
Yes, you can use either the visited states or the hover states to control when the 'Next' button becomes unlocked.
You would use the visited states in the same way as the selected states, which will only need one trigger but with multiple conditions.
If you wanted to use the hover states, you will need to create multiple triggers that adjust multiple variables (one for each item) when the mouse is hovered over the respective item as the item will be returned to its normal state when the mouse leaves it.
Attached is an example of how you can use the hover states - I hope it helps
It would be soooooo nice if there were a way to change the state of the player's NEXT button, because it could be very frustrating for users to click on it and not get feedback about why it's not working. Maybe if everyone submits that as a feature request, it'll happen with an upcoming release.
In the meantime, when I add conditions to NEXT to ensure someone clicks the on-screen items first, I also add a trigger to NEXT that activates when conditions aren't met (e.g., the buttons are NOT in the visited state). That trigger lightboxes a slide that tells the user they have to complete the on-screen instructions before going to the next slide. So at least they know why NEXT isn't working. For best usability, you should also ensure that the visited states are different from the non-visited, so it's easy for the user to see what they've clicked. For standard buttons, I often use the circle icon for the Normal state, and the checkmark-in-a-circle icon for visited. That makes it obvious that someone is checking off what they need to visit before going to the next slide.
10 Replies
Hi Felicity
yes, it's possible of course
Set the state of the Next button as disabled/hidden.
Add triggers (true/false) to every element you want user to click before continuing. Then finally add a trigger to change the button state if all the true/false conditions are done.
Have a look at the example in the attachment :)
Thank you for your reply. I'm using the Next button on the default player but can't see how to change the state of the Next button when selecting the trigger Action "Change state of" - Next button is not in the drop down list. Or am I missing something really obvious.
Do I need to create my own navigation buttons to make this work as per your example?
thanks again
You can control the default button too
See the changed example.
Hi Felicity,
Unfortunately, you can't apply any states to the default player controls so you can't apply a visual to the 'Next' button to indicate that it has been disabled.
However, you can 'disable' it using the method Joanna has described or you can simplify the process by using the selected or visited states of your on-screen elements as conditions.
Your trigger on the 'Next' button should look something like this:
Action: Jump to slide
Slide: next slide
When: User clicks
Object: Next Button
On condition: Shape A AND Shape B AND Shape C etc. are equal to Selected
Thank you both for helping. It's working using the Selected state. Just one more question ... do you have to use 'Selected' or could you get the same result using any of the states, e.g. Visited or Hover?
Hi Felicity,
Yes, you can use either the visited states or the hover states to control when the 'Next' button becomes unlocked.
You would use the visited states in the same way as the selected states, which will only need one trigger but with multiple conditions.
If you wanted to use the hover states, you will need to create multiple triggers that adjust multiple variables (one for each item) when the mouse is hovered over the respective item as the item will be returned to its normal state when the mouse leaves it.
Attached is an example of how you can use the hover states - I hope it helps
That's great and thanks for your quick reply, much appreciated.
It would be soooooo nice if there were a way to change the state of the player's NEXT button, because it could be very frustrating for users to click on it and not get feedback about why it's not working. Maybe if everyone submits that as a feature request, it'll happen with an upcoming release.
In the meantime, when I add conditions to NEXT to ensure someone clicks the on-screen items first, I also add a trigger to NEXT that activates when conditions aren't met (e.g., the buttons are NOT in the visited state). That trigger lightboxes a slide that tells the user they have to complete the on-screen instructions before going to the next slide. So at least they know why NEXT isn't working. For best usability, you should also ensure that the visited states are different from the non-visited, so it's easy for the user to see what they've clicked. For standard buttons, I often use the circle icon for the Normal state, and the checkmark-in-a-circle icon for visited. That makes it obvious that someone is checking off what they need to visit before going to the next slide.
Hey Joanna, I'm not able to download or open your .story files.
Hi Diane! For some reason that seems to happen with some older posts. I'm re-attaching here for you.
This discussion is closed. You can start a new discussion or contact Articulate Support.