Accordion Interaction

Hi RubaAbudia there were a couple of issues. Firstly, the next button. Rather than grouping elements to make a button, it is best to drop icons into the button state(s). Therefore, when you want to show/hide the button, you show/hide a single element rather than the group of elements that make up the button. I dropped the arrow icon into the Normal state of the button.

The second issue was that the Next button was obscured by the contents of the layers. The Next button was on the base layer, and so when the other layers opened, they would cover the Next button. For this design, a duplicate version of the Next button was required for each layer.

Lastly we use the "Visited" state of the tabs to trigger the Next button Show function. Using the Tabs on the base layer, as each of the layers are open, we set the state of the appropriate Tab to visited.

This trigger is on each layer, e.g. Layer 1 triggers Tab 01, Layer 2 triggers Tab 02 etc.

Then, for each instance of the button, we just need to add a trigger that Shows the Next button when all Tabs on the base layer are Visited, the Next button state should be changed to Normal.