Highlighting Options?
Apr 10, 2024
By
Scott Moran
I have built a test question using a schematic image. I have put boxes around informational choices that the end-user can choose from. There are roughly five correct boxes and eight total boxes highlighting specific text on the schematic image. Is there a way to have those selected boxes stay highlighted so the end-user knows which boxes they have already chosen? The current setup doesn't have that feature but some end-users would like to be able to see what options they have already selected so they don't reselect them and fail the test.
6 Replies
It sounds like you have this set up as a Pick One (aka multiple choice) question. That type of question only allows one option to be in the Selected state at a time.
If you use a Pick Many (aka multiple response) question, the user will be able to select more than one option. Items that have already been clicked once will remain in the Selected state when other options are Selected. And re-clicking a Selected option will toggle it back to Normal.
I have it set up to allow multiple options to be selected. The problem is that it is a schematic drawing and I have boxes around specific options on the image that they have to choose from. I am trying to have each box that the user selects show that it was selected, highlighted in some way. That way the user doesn't reselect the box causing the issue you stated above. I am not sure how to do that? They would need to choose five out of the eight boxes on the image to get the question correct. Currently, once the user selects a box there is nothing that tells them they already selected that box. I can have the box pulse when clicked on, but it doesn't stay pulsing to indicate that it has already been chosen. There is my dilemma, how do I make each selection stay highlighted so the user knows what which options they have already selected.
Thank You for your assistance!
Edit the Selected state so it's obviously different from the Normal state. For example, change the color of the box outline and/or add a strong glow effect.
Another good option would be to put a checkmark into the Selected state. That could be done by entering the text symbol directly in the shape, and adjusting the font size and the margins as desired. Or insert a checkmark icon.
For more info: Add & Edit States in Storyline 360 - E-Learning Heroes (articulate.com)
Had a coworker who had figured it out on a prior project. Change the state for the selected feature to show a color box or change of color fill and then make it transparent so the user can still see what they selected. Once that is done set a trigger to change the state from normal to selected where the colored fill or line resided and that allows a person to select a box and it stays highlighted so they can see which options they have chosen. Simple fix and I had an idea that was what had to be done, just couldn't put the pieces together. Thanks again for your assistance in completing this project.
Do not use a trigger to change to the Selected state. That could actually cause problems, because it duplicates a built-in action.
When an object has a Normal state and a Selected state, the first click will automatically change it to Selected. The next click will change it back to Normal. And so on, subsequent clicks will toggle between those states.
Here's more info about built-in states: https://community.articulate.com/discussions/articulate-storyline/primer-take-advantage-of-built-in-states
Thanks for that advice, I will make that adjustment.