Forum Discussion

CraigMaloney's avatar
CraigMaloney
Community Member
2 days ago
Solved

Working with States and Layers!

I have a single slide which shows 5 cards and the learner can select any card and click submit. This shows the next layer where the card they have selected is displayed and there are 5 more cards to select. This process repeats until they have 3 cards selected. On the final layer a set of results will display based on the 3 cards that have been selected. This works perfectly when the learner selects one card only and moves through the interaction. My issue is when the learner selects a card, changes their mind and selects another and then moves on, for some reason I am unable to get the new selection to display on the layer even though I have states changing the card back to normal when another card is selected. I have tried button sets but this didn't work so I manually set up all the triggers but this is still not working. Anyone have any help/suggestions on how to get this to work?

Thanks

  • The cards are stacked. If more than 1 card is triggered to change from Hidden to Normal, only the card at the top will be visible. 

    • You can see this happen if you separate the stacked cards, preview the slide, select a card, change your selection, and then click submit.

     

    I suggest you simplify the entire slide. (Perhaps start from scratch on a blank card. There's no need to use a graded-question slide for this.)

    Delete all the extra off-slide cards. 

    Delete all the triggers that change a card to Selected when it's clicked and change it to Normal when the user clicks outside the card. Those aren't needed. Objects with a Selected state automatically switch to Selected when clicked. And, if you put the cards into a button set, the program will only allow the user to select one (like the button in a Multiple Choice question). Here's more info:

     

    On the layer, add triggers with conditions to control which card shows. For example, a trigger would change the Limited Card on the layer to Normal when the timeline of the layer starts with the condition that the Limited Card on the base = Selected. 

    There's info about conditions here: Storyline 360: Working with Triggers | Articulate - Community 

    I would also use shapes filled with pictures for the cards instead of pictures. Then enter the card text directly into the shapes. That's more accessible for the user, and it's easier for you to edit/update. 

    And this would simplify the programming even more. Don't have all the cards repeated on the layer and then change one to Normal. Instead, put the cards into custom states of a rectangle where the cards go. Then change to the appropriate state using the same triggers with conditions described above. The beauty of that approach is that you would only need to change the rectangle back to Normal to reset the interaction (instead of changing all of the cards back to Hidden). 

     

3 Replies

  • The cards are stacked. If more than 1 card is triggered to change from Hidden to Normal, only the card at the top will be visible. 

    • You can see this happen if you separate the stacked cards, preview the slide, select a card, change your selection, and then click submit.

     

    I suggest you simplify the entire slide. (Perhaps start from scratch on a blank card. There's no need to use a graded-question slide for this.)

    Delete all the extra off-slide cards. 

    Delete all the triggers that change a card to Selected when it's clicked and change it to Normal when the user clicks outside the card. Those aren't needed. Objects with a Selected state automatically switch to Selected when clicked. And, if you put the cards into a button set, the program will only allow the user to select one (like the button in a Multiple Choice question). Here's more info:

     

    On the layer, add triggers with conditions to control which card shows. For example, a trigger would change the Limited Card on the layer to Normal when the timeline of the layer starts with the condition that the Limited Card on the base = Selected. 

    There's info about conditions here: Storyline 360: Working with Triggers | Articulate - Community 

    I would also use shapes filled with pictures for the cards instead of pictures. Then enter the card text directly into the shapes. That's more accessible for the user, and it's easier for you to edit/update. 

    And this would simplify the programming even more. Don't have all the cards repeated on the layer and then change one to Normal. Instead, put the cards into custom states of a rectangle where the cards go. Then change to the appropriate state using the same triggers with conditions described above. The beauty of that approach is that you would only need to change the rectangle back to Normal to reset the interaction (instead of changing all of the cards back to Hidden). 

     

    • CraigMaloney's avatar
      CraigMaloney
      Community Member

      Thank you for this advise. I followed it exactly and, though this worked for the base layer and 1st layer, once I moved onto the second and third layers I did need to have the duplicate items on the base as you cannot have a trigger use objects on other layers but I think I have now got it all sorted. Thanks again!

      • JudyNollet's avatar
        JudyNollet
        Super Hero

        You're welcome! Pay it forward when you can. 😊

        By the way, instead of using duplicate cards on the base, you could use variables to control what shows as the chosen card on additional layers. 

        For example, create a text variable called AISolution. Add a trigger to each of the AI-Solution cards that adjusts the variable. For example, the first card could set the variable to "1-AIDriven" when the user clicks that card. Then, on the next layer, the trigger to show the AI-driven card as chosen would run with the condition that the variable = "1-AIDriven."

        It’s worth the effort to learn about variables, because they provide the real power in Storyline. Here’s more information: The Value of Variables | Articulate - Community