Shape fade out when clicked on

Hi, am hoping someone will know if this is possible and how to do it in Storyline 2.

I have a number of items on a screen and each is hidden by a shape. I'd like to set it so when a user clicks on the shape, it fades out, leaving the item underneath to be viewed. Anyone have an idea how to get that to work?

I was hoping to do it without using Slides, which could get messy with all the items and links back.

Thanks in advance!


8 Replies
Cindy Shaver

Thanks Michael and Wendy, that's awesome!  It's pretty close to what I'm looking for and thanks for the demo Michael.

The only hiccup with that is the shape fades out on its own after the timeline ends (it is set at 5 seconds on your demo Michael). I could increase the timeline to delay that - say 30 seconds.

Rachel Ingram

Hi Cindy! If you're open to using layers, here one way to do it without the shape(s) fading out when the timeline ends:

1.) Create a layer for each shape (and add the shapes to the layers).

2.) In the base layer, add the trigger "Show layer [layer name] when the timeline starts." Add this trigger for each layer.

3.) Set each shape's timeline to .5 seconds and add the exit animation "Fade Out."

4.) In each layer's slide properties, unselect everything except "Hide slide layer when timeline finishes."

5.) To each layer, add the trigger "Action: Pause timeline; Timeline: This Layer; When: Timeline starts; Object: [Name of your layer]." This way, the shape won't fade out as soon as the timeline ends yet!

6.) In each layer, select the shape and add the trigger "Action: Resume timeline; Timeline: This Layer; When: User clicks; Object: [Name of the shape object]."

Example attached. Hope this helps!