Instructional Designer

Nesting Menu example with forward and backward buttons

Following on from my Nesting menu example from before, I have been asked to add forward and backward buttons to the interface. At first glance, this looked like it would be a challenge, as I was concerned about how the variables would interact with each other. On the second glance, I realized that I could just use the exact same variables I had already made.

On Menu 1 option- the forward and back buttons are located on the base slide. In this way, the functionality of the text states is not impaired.

To do this, we add in the buttons and arrows that we want to use. Then, we are going to add 1 to m1count when the user clicks the forward icon, and subtract 1 when they click the backwards icon. We add in the functionality that says to change state of the text box when m1count = a certain value. For example, change text box to state variables when m1count=1. We do this for each state/value we have in our textbox. In my example, because the character changes as well, I set each variable true when m1count matches the number. For example, set variables true when m1count=1. (I also have to set all the others false when m1count=1) set locking=false when m1count=1. This changes the text and the character in my example.

In order to make this work, we must reset the count of m1count when we get back to the beginning so that we don’t end up with counts higher than we have programmed for. If we reset the count at 0/3 (when we get back to the beginning, we never actually get to 3, and therefore we would mess up our activity buttons. In order to get around this, we reset the count at 1, when we get to the variables menu. This makes sure that we we get our 3 count to unlock our menu items (below).

Finally, we have to set the activity button to hidden at the start of the timeline on this slide, and then make it normal once m1count reaches the desired number. In this case, we had to think through it. In the pull out menu, we set activity to be normal when m1count=3, so we do the same here.

Here too, we have an activity button that displays only when all the prereq’s have been visited.
On Menu 2, the activity button is on the base slide, but the forward and backward buttons are on each layer.

On Menu 2 – where we add in our forward and backward buttons to each layer, the movement is a little easier. Since the buttons live on each layer, we just tell the buttons to show the next layer when it’s clicked (forward button) or the previous layer when clicked (backwards button).

On each layer, we add 1 to that variable’s count (add 1 to varcount2 when user clicks forward button). We do not have to subtract any of these, or worry about resetting our count value.

We already have functionality (we built it in our menu tutorial) that says to add 1 to m2count only when the locking2count = 1 and so forth, so we do not need to worry about that here.

Finally, all we need to do is hide the activity button on slide load, and then reveal it once m2count =3 (or our desired number).

Hope this helps explain! Feel free to download the example and work through it yourself!