When it comes to building Articulate Storyline 360 courses, understanding states is crucial. After all, states are one of the building blocks of Storyline 360! A question that often pops up is when to use Selected versus Visited states. For beginners, these two states can seem pretty similar – you select or click on an object, and it changes appearance. But there’s a key difference! Read on as we explore this “as heard in training” question: “When should I use a Selected versus Visited state in Storyline 360?”
You can think of a Visited state as a permanent marker, while a Selected state is like a highlighter. Let’s demonstrate this with an example.
Selected State
- Shown in our example, we have a gold rectangle in its Normal state.
- When you select it, it changes to a Selected state (which, in this example, changes the rectangle to the color blue).
- Selecting the rectangle again brings it back to its Normal state of gold.
Think of the Selected state like a toggle or a radio button on a quiz question. It’s a choice the learner can make, but the learner can also unmake that decision by selecting the object again.
Visited State
Now, let’s go back to the gold rectangle example, but this time, we’ll use a Visited state.
- Selecting the rectangle changes it to the Visited state (which is gray).
- But selecting the rectangle again has no effect. The rectangle stays in its Visited state.
Unlike a Selected state, a Visited state is permanent unless you use a trigger to change it back.
So … When Do I Use a Selected State?
Use Selected states when you want learners to actively interact and potentially change their choices. For example, let’s say you’re teaching employees at a fast-food restaurant about the different ingredients on a sandwich. You’d list all the ingredients on the slide with Normal and Selected states, and learners can select the ones they think belong on the sandwich. If they make a mistake, a Selected state lets them easily correct themselves by selecting the ingredient again to return it to its Normal state.
Selected states can also be part of button sets. A button set is when there are many items that have Selected states, but only one can be selected at a time. It basically forces the objects to work like radio buttons, so when you select one, all the others are automatically de-selected.
When Do I Use a Visited State?
Use a Visited state when you want to show that something has been viewed or interacted with. For example, imagine a slide listing all the sandwiches at a fast-food restaurant. Learners select each sandwich to learn more about it. A Visited state for each sandwich would indicate which ones they’ve already explored.
Visited states can be extremely helpful for creating conditional navigation restrictions, such as requiring learners to interact with all the objects on a slide before they can proceed. For example, you can set your Next button to only work if all the objects have been ‘visited,’ otherwise, you can display an error message.
Can I Use Both States at the Same Time?
You may be wondering what happens if an object has both a Selected state and a Visited state. Remember, once something has been visited, it’s not going back to the Normal state without a trigger.
Using our gold rectangle example, the object would first transition to a Selected state of blue when clicked, and then to a Visited state of gray with subsequent clicks. In fact, both the Visited and Selected states are enabled at the same time, but visually, only one of them can appear.
Let’s explore another example of using both Selected and Visited states together.
Using Selected and Visited States Together
In this example, we have a slide with a hand diagram and four labeled parts. Learners can interact with the diagram by selecting each label to learn more. Let’s review how this slide is set up.
- Each label has three states: Normal, Selected, and Visited.
- These labels are grouped as a button set, so only one can be selected at a time.
- Once a label is selected, it changes to a Selected state.
- Then, when the learner selects another label, the previous label is changed to a Visited state and the new label becomes ‘Selected.’
Because the label that’s currently selected is technically both Selected and Visited, we can use conditional navigation to ensure all labels are visited before moving to the next slide.
Want to review this slide in action? Go ahead and select the Play button on the video below.
We hope this has given you some ideas about when and where you’ll use Selected versus Visited states! If you have other ways you use these states, let us know! We’d love to hear from you!
Interested in Learning More?
Check out the following resources from Articulate, The Articulate Trainer blog, and our YouTube channel for more on this topic:
Can I Create an Animated “Selected” State?
Everything You Need to Know About States in Storyline 360
Storyline 360: Adding and Editing States
Storyline 360: Definition of Built-In States
Storyline 360: Working with Button Sets
What’s the Difference Between Selected and Visited States in Articulate Storyline 360? (Video)
Until next time … happy Articulating!
~ Elizabeth
Clearest explanation I’ve seen.
Thanks Elizabeth!
Thanks, Shane and hope you are doing awesome!
Thank you for this information. It is very helpful.
So glad it was helpful, Marla!
Thanks for this insightful post!
I wonder, have you noticed any challenges when using Visited States for complex navigation? What solutions have you found effective?
I am new to Storyline 360, and based on the tutorials I have watched so far, I understand the basics but have not had the chance to implement them yet. I have heard that clear visual indicators and consistent state definitions are key. Also, using custom triggers seems helpful to manage states efficiently.
I would love to hear your thoughts and any tips you might have for a beginner like me!
Hi Mariam!
That depends what you mean by complex navigation. A visited state will automatically appear once a user has selected/clicked on that object. If you want the state to return to normal when the user revisits the slide, you can use the slide properties to control revisit behavior. If you select “reset to initial state” in the slide properties, the slide will restart from the beginning of its timeline, and interactive objects will return to their initial states.
Sometimes we use visited states as a condition for the learner, so that they cannot proceed until all of the items on a slide have reached a visited state. But then if they were to return to the slide, we don’t want them to have to select all of the items again. In that case, we would use a true/false variable to control the navigation, rather than the states.
If you have a specific use case, this would be a great question for the Articulate E-Learning Heroes Community!
This post by The Articulate Trainer provides an excellent breakdown of when to use the Selected versus Visited states in Articulate Storyline 360. It simplifies the difference between the two, making it easier for instructional designers to decide when to use each state in their e-learning projects. The clear examples and visuals are especially helpful for beginners, and the post also provides practical tips for using both states together to enhance interactivity and navigation. It’s a valuable resource for anyone looking to improve their Storyline course designs!
Thanks for the feedback, Maryum!
Thank you. This answer one question but brought up another: When the Visited state is active, how can I disable the Hover state from showing, other than putting a shape over the button with a high transparency?
Hi Gil and great question! We’ve recorded a quick PEEK video to show you a simple way to do this: https://360.articulate.com/review/content/db51554b-c50b-401b-a787-5ae5d17a87e7/review. Enjoy and hope this helps!