Forum Discussion
PRIMER: Take advantage of built-in states
Many problems posted in the Forum are related to triggers that do what’s already done automatically by the built-in states (Normal, Hover, Down, Visited, Selected, Disabled).
This Review 360 project demonstrates how the built-in states work: https://360.articulate.com/review/content/eaccc037-929b-43b5-b636-5333181a9c70/review
Overview of built-in states
- When you insert a button, it will have the Normal, Hover, Down, Visited, and Disabled
- When you add multiple-choice or multiple-response question, the response buttons will have the Normal, Hover, Down, Selected, and Disabled
- You can add built-in states to any text box, shape, or image.
- There are also states with automatic functions available for draggable objects in a drag-and-drop interaction. These include Drag Over, Drop Correct, and Drop Incorrect.
How the basic built-in states work
- When an item has a Hover state, that state will automatically display when the user’s mouse is over the item. The Hover state will go away when the user’s mouse is no longer over the item.
- When an item has a Visited state, that state will automatically display when the user clicks the item.
- When an item has a Selected state, the first click automatically changes the state to Selected. The next click changes it back to Normal. And repeated clicking toggles between the two states.
- When multiple items with the Selected state are in a button set, clicking one of those items will change it to Selected and will automatically change the other items in the set to Normal. (Here’s more information: Storyline 360: Working with Button Sets | Articulate - Community)
- When multiple items with Selected and Visited states are in a button set, clicking an item will change it to Selected. Any item that has not been clicked will remain Normal. Any item that was previously clicked will change to Visited.
- When an item is Disabled, it will no longer be clickable. In other words, triggers that are set to run when the item is clicked will not run when the item is in the Disabled
- Hidden is a unique state. It doesn’t show in the States panel—and you should not create a state called Hidden. Instead, when an item is put into the Hidden state, Storyline automatically hides it.
How the drag-and-drop built-in states work
- An object being dragged will change to its Drag Over state whenever any part of the object intersects with any of the drop targets.
- An object will change to its Drop Correct state when it is dropped onto the correct target.
- An object will change to its Drop Incorrect state when it is dropped onto the incorrect target.
Triggers that duplicate the built-in actions often cause problems. Instead, save time—and troubleshooting—by taking advantage of what the built-in states do automatically.
Bonus tip: You don’t need a trigger to change an item to a given state when the timeline starts. Instead, set the Initial state dropdown list to the desired state.
- SamHillSuper Hero
Great post. Leveraging the states saves so much time on building triggers. I've seen many authors add complex triggers for something a button set would do.
The default states, such as selected, are also better for accessibility as they are identified by screen readers.
- JudyNolletSuper Hero
Exactly!
I've seen enough Forum questions where the answer was "Delete those unnecessary triggers that duplicate built-in functionality" that I decided I wanted a post to direct folks to, instead of re-writing the info. 😁
(I created many of my TIPS posts for the same reason. Linking to them makes it easier to answer the questions that are asked repeatedly in the Forum.)
- JudyNolletSuper Hero
Here's some additional info that one of the staff posted about built-in states:
"The built-in states by design are treated as a layer on top of the normal state, which means if an object from the normal state is not completely covered when a built-in state is shown, the object will be visible in the built-in layer."
- JudyNolletSuper Hero
I've updated my Review project that demonstrates built-in states to show how states "layer" on each other. Here's an overview.
On the "Combining States" slide, a rounded rectangle has the following states: Normal, Hover, Selected, and Visited. There is an extra rectangle inserted directly into each shape. This screenshot shows the States panel for the rounded rectangle:
This screenshot shows a Preview of the object after it has been clicked and while the mouse is still over it:
To see this in action, go to the "Combining States" slide in my Review project about built-in states: Primer: Using Built-In States | Review 360