Next Slide Trigger Restriction Until All Hotspots Have Been Viewed

Feb 23, 2017

Hi All,

I have an image which i have created hot spots for which trigger a hidden layer to display on the left of the image when clicked. I would like the user to have selected and viewed all layers before being able to click "next" to proceed slides. 

I saw another discussion thread example which I followed (cannot find it now!) to create the attached where using triggers with conditions, the user can only go to the next slide if all the layers have been viewed (used "and" conditions), and a warning pops up if the user clicks the "next" button but not all layers have been visited (used "or"condition).

The issue is, when all the layers have been visited, the "next" button still does not activate to proceed to the next slide, and rather, the warning continues to pop up. I am not sure if I have set up the triggers incorrectly. Any advice/feedback would be appreciated! I am new to Articulate 4 on the 30 day trial!



12 Replies
Judy Nollet

Hi, Sarnia,

Your triggers for adjusting the NEXT button are okay. However, your rectangles don't have a visited state; they only have a normal state. To work the way you want it to, do this on each info layer:

  • Add a Visited state to the rectangle.
  • Add a trigger that changes the rectangle to the Visited state when the layer's timeline starts.

By the way, I think it'd be better to change the state of the NEXT button to Disabled when the timeline starts with the condition that the layers haven't been visited. Use another trigger to change the state of NEXT to Normal when the rectangle (layers) have been visited. And put the instructions about needing to click each item on the base layer, so users know right away they have to do something before they can click NEXT. That'd be less frustrating.

To save yourself from frustrating, I also recommend naming your shapes. It's easier to verify triggers when you see logical names (e.g.,  info-Supervisor instead of than "Rectangle 1").

Oh, and there are other ways to accomplish what you want to do, but this will at least get you started. Good luck!

Walt Hamilton
Judy Nollet

Add a trigger that changes the rectangle to the Visited state when the layer's timeline starts.



Most of Judy's ideas are good, except this one. If your shape has a state named "Visited", it also has built-in triggers that change it to visited state when it is clicked. If you add your own triggers to it to change it to visited state, they will conflict, and cause unpredictable (but seldom desirable) results.

My personal preference is to make the next button invisible until it is active.

1. It saves you all the trouble of having to show the user an explanation of why they can see it, and can click it but it doesn't do anything. Put one instruction on the screen (visit all buttons to advance), make the next visible at the appropriate time, and you're done.

2. When I am the user, my heart fills with hate for the evil programmer if there is something on the screen that I can see that doesn't work. I can live with "You can't advance until you click on everything" much better than trying to guess what I have to do, or even worse being told "Can't do that yet."

Just my $.02

Judy Nollet

Walt makes a good point about the Visited state. In my work, I use it to track clicks on objects. I only made the above suggestion as the quickest way to work with what you already have programmed. If I were starting from scratch to do what you're doing, I'd use circle shapes for each clickable able in the diagram, with Normal, Hover, Selected, and Visited states. In other words, they'd be buttons, and I'd link them into a Button Set. Clicking a circle shape would reveal the corresponding layer. The NEXT button would be disabled until all of the circle shapes were Visited. And the instructions about what to click would be visible at all times.

As you can probably tell, I disagree with Walt about hiding the NEXT button. I think that would be okay IF the player kept the PREV button in its standard position. Unfortunately, though, when NEXT is hidden, PREV moves into its place. That makes it likely that someone who's not paying close attention (i.e., they keep clicking with their mouse over the NEXT position) will suddenly find themselves on a previously viewed slide and get confused. That's why I suggest disabling NEXT until the user meets whatever conditions you set.

Sarnia Vijayakumar

Thank you Judy and Walt for your suggestions. As I am just playing around with pre-existing Powerpoint slides which I had imported, I think it would be best if I try Judy's route and start from scratch to re-design this slide with circle shapes with their various states and disabling the "Next" button.

I would like to keep consistency with the other slides, and thus, I think the best option would be to disable the "next" button rather than make it invisible.

Thanks again!

Julie  Haydon

Good question Dorothy , be interested to hear others take on this. I tend to avoid hotspots and use transparent shapes that way you can have a visited state in order to trigger next buttons when all shapes are showing as visited.

if you must have hover you can use on mouse enter set state of button x to visited I think...


Walt Hamilton

There a numerous ways to handle it, depending on the exact details of what you are showing and how.

If you could attach that slide or a mockup of it, it would help filter the answers you get.

But James speaks for a lot of experienced users when he says use transparent shapes rather than hotspots, unless you absolutely must.

Dorothy H

I figured out a way to accomplish it without using layers at all.  I just created objects and disabled them when the timeline started and then changed the state to normal when the user hovered over the area.  It took awhile, but I've got it functional and that is exciting! 

I'm so grateful for this community and knowledge base.  Thank you all!

This discussion is closed. You can start a new discussion or contact Articulate Support.