Changing state of buttons after section is completed.

May 29, 2012

Ken Cortnik
By Ken Cortnik

I have a menu slide with six different topics (buttons). What I would like to happen is when the user clicks on a button, it would link them to a topic and when they complete that topic it would then link them back to the menu page, change the state of that button to visited.

I have created a true/false variable and set it to false and then have placed a trigger on the last page of the section to change it to true.

I then created a trigger on the menu page to change the button from Normal to Visited when the variable is changed to True. 

However, when I preview it, the button changes to Visited state when I click on it, prior to going to the section and is back to Normal state when returned to the Menu.

Any thoughts?

Thanks

44 Replies
Gerry Wasiluk
almost 11 years ago05/29/12 at 11:41 am (UTC)

Thanks!  I've done this quite a few times and here is what I did.

Rather then use the stock visited state, I added my own state to each of the menu buttons.  I called the new state "Completed." I usually gave the button a checkmark to show the completion of a topic.

Then I delete the stock visited state for each button as it's no longer needed.

For each of the sections, I have True-False variables, initially false, to denote that I had completed a section.  The last page of each section set its corresponding variable to true.

Be sure to set this variable to true BEFORE you leave the last page of a section, BEFORE your trigger to move to a slide or scene.

Then I added Slide Triggers for each of the buttons setting them to the "Completed" state when the Timeline started if the corresponding variable was true.

Jonathan Workman
almost 11 years ago05/29/12 at 12:25 pm (UTC)

Gerry- Just curious as to why you choose to use variables rather than Change State trigger in the above example.  Is there a design/ functionality reason that makes this better or do you just enjoy working with variables?  Here's how I typically handle this issue (minus your checkmarks for completion, which are a good idea):

I have learned a lot from your posts and am always looking to improve my Storyline skills!

Phil Mayor
almost 11 years ago05/29/12 at 1:20 pm (UTC)

Visited always fire when pressed, so like Gerry I always use a completed state, and use T/F variables to track this.  I believe this is best as it is the best way to check slides have been viewed instead of using a visited state.

I believe the visited state is best to use only within a slide.  My rule of thumb is, if you are tracking on a slide use the visited state, if you are leaving and returning to a slide use a variable, and a custom state.

This is a lot more flexible and I believe a more elegant design than using the visited state.

In short, what Gerry said

Gerry Wasiluk
almost 11 years ago05/29/12 at 2:05 pm (UTC)

Hey, Jonathan!

What Brother Phil said.    He's my guru on variables, along with Steve Flowers.  Great folks!

One more thing, since Storyline does not yet have a debugger, you can always put references to your variables on your slides to see if things are working right.  Not a true debugger but at least it helps.

I could do things on one slide sometimes and just change object states but that often gets too complicated for me--and very, very complicated slides can often slow the app down (at least they did early in the beta so I've shied away, whenever possible from complicated slides--it also lets me keep things straight and coherent by keeping things simple).

I like to have menu slides where learners can view the main content in whatever order they want.  Some of the branched paths from the menu are one slide long (and usually have many layers on them)--while other paths are many, many slides. 

Because of this, as Phil's rule of thumb, variables are really the only way to go.  So I want to be sure that folks do not get credit for completing a path until they have viewed everything or have done something else.

Joe Deegan
over 10 years ago08/02/12 at 11:51 am (UTC)

I must be missing something because I'm having trouble getting this to work following Gerry's instructions.  I have a menu slide where I want the button object to change to completed after a quiz slide is completed.  Here's the steps I followed, notice any issues?

  1. Created a new "Completed" state and removed "Visited"
  2. Created variable "True/False" variable set to False.
  3. Created an "Object Trigger" so that the variable is changed to True when the user clicks the "Submit" button.
  4. Created a slide trigger on the menu slide so that the button changes to the new "Completed" state when the variable changes to true.

I also tested with a Reference as Gerry suggested and as suggested in this tutorial and the reference showed that the variable is working correctly but the state is still not changing when I preview.  I also made sure the triggers were set to happen before the slide changes thinking that might be the problem but still a no go.  Your help is greatly appreciated.

PS - I attached the story file for troubleshooting. Let me know if you need any other info.

Phil Mayor
over 10 years ago08/02/12 at 12:17 pm (UTC)

Hi Joe, sorry not got time to look at your file today, here is a demo I did a while ago, you need to make sure it is a slide level trigger that changes the state to completed.

Also you need to ensure your varibale change trigger is before the jump to trigger or else it never fires

here is a screenr I did as well

Steve Flowers
over 10 years ago09/17/12 at 5:14 pm (UTC)

Howdy, ID - 

You can use the same concept to show a layer. But it might be more manageable to set your checkmark's initial state to hidden and use the trigger to show the Normal state when it meets the right conditions. That way you can manage all of your checkmarks on the base layer. Make things easier to align and distribute.

Al Rose
over 9 years ago09/27/13 at 9:38 am (UTC)

Thank you all so much to Phil Mayor's post on how the change color of the items in a drop down menu after the user has selected it and it has jumped to the slide assoicated with that choice of the drop down menu. I had a 12 item drop down menu to design and it works perfectly.

Thanks to Mike Taylor for turning me on to this post by Phil. Both have contributed to my design. The Storyline community is just wonderful.

Thanks again to all.

Alexander Kimball
over 7 years ago10/08/15 at 9:46 pm (UTC)

Alright, so this is getting a little maddening. I've attached my file here for a brave soul to look at.

Here's what is up:

I'm wanting the tabs on the right to turn gray (switch to "complete" status) and stay that way as people complete the training. Its setup this way as people may complete the sections out of order should they please.

I've set up a completed variable for each section and I have triggers to change the completed variable to "true" when this happens. Any reason why the buttons wouldn't stay grayed out as one navigates around?

Michael Hinze
over 7 years ago10/08/15 at 11:07 pm (UTC)

See attached a revised file where I fixed the tab for section 1. You need to change the triggers that set the state of the tabs to completed from 'When variable changes' to 'When timeline starts'. The 'When variable changes' option only applies to the slide where the change actually happens, that's why your tabs do currently not change on subsequent slides. Have a look, hope that makes sense.

Alexander Kimball
over 7 years ago10/09/15 at 1:48 pm (UTC)

Thank you so much Michael. I knew I was missing something. I remember them saying this earlier in the thread too. I can't believe I missed it. Well, I've only been using this application for 3 weeks, so I'm getting used to it.

This community is amazing. I owe everything I've come up with so far to all the great information I've received through the community.

Funny thing is, I expected such a great quick response as I posted this first query on here.

Thanks again,

Kyle

Sign In to Reply