Forum Discussion

SonyaMcLamb's avatar
SonyaMcLamb
Community Member
2 years ago

Adding Layers to Words in a Body of Text

Hi all,

I am hoping someone can give me some ideas for how to best expand upon groups of words contained within a paragrah of text in Storyline 360. What I am envisioning is being able to highlight 3 different sentences within the same paragraph, make that "highlight" clickable, and once clicked, a layer (a new text box) will pop up that provides additional information/explanation about the hightlighted sentence. In addition, I will need to require the learner clicks on each set of highlighted words before moving ahead in the course so I would like to be able to make it clear when a section has been clicked on. Originally I was thinking about highlighting each group of words with a different colored highlight and then once a "color" was clicked on to reveal the layer of additional information, the highlight would be removed (i.e. the sentence would become black/dark gray text once clicked to indicate to the learner that section has been marked as complete). But...I am fairly new to eLearning development in general and not exactly sure how to best accomplish what I'm trying to do. Any help or suggestions would be greatly appreciated!

  • I would cover the sentence with a box filled with color. When clicked, it would turn to Visited state, which would contain the additional information. When the learner is finished, they click and it turns to Hidden state.

    Construction details:

    1. Start with the shape, fill it with highlight color, and set the transparency property to the value that looks best to you. 

    2. Edit the states of the shape, copy the Normal state and call it Visited. Visited state has its own built-in trigger to change to the Visited state when clicked, so you don't need to worry about.

    3. Close states editing, then build the additional information text box as you want. I envision an "X" (or something similar) on the text box for the learner to indicate they are ready to advance. Create the "X" either as part of the textbox or as a separate object. You have more ease and flexibility in positioning it if it is a separate object. Attach two triggers to the "X". The first is "Change state of [shape1] to Hidden (you don't have to create this state, it's built-in) when user clicks [shape]", and the second is "Jump to [slide name] when user clicks [shape] if the state of [shape1] is Hidden AND state of [shape2] is Hidden, and state of [shape3] is Hidden"

    4. Select the textbox and "X" and copy them.

    5. Edit the states of the shape (again). Select the Visited shape, and paste the box and "X" . Position them where you want them in relation to the color.