Need to build an interaction with variables and hover states

Hello!

I have an interaction (see the video attached) that I need to replicate in Storyline and I'm looking for some help. I need to:

1. Show an image when a user hovers over an icon.

2. After that, I need Storyline to show a hidden image that displays when a user clicks over where they just hovered. I know that I can use a T/F variable, but when I attempted to build this, nothing worked but the hover state.

Is someone well-versed with conditional statements that can help me? I can't share my file so I made a quick video.

Thanks!

4 Replies
Marissa Carterud

Thanks Christie and Walt - I appreciate the help...I never thought to build each with layers and to show the individual layers. That's genius! 

I'm going to work on this and see if that works for what my client wants. The script called for T/F variables and hovers, but if in the end, it's the same then I think they'll be ok how I build it.

Marissa

Marissa Carterud

Ok, I played with this slide a bit, and built the layers and hovers using Walt's .story file as a guide, but I have a problem. The functionality needs to be flexible enough so that users can click the blue rectangle>then see the layer>when they click the blue rectangle again, see the previous image. At the same time, they need to have access to the other icons on the other layers, so building this way may take longer than expected...

Here's what my client wants (in their own words): 

Each Preview has both a Portrait and a Landscape view. When the user clicks on a particular Preview, they’ll see the Landscape view that corresponds to that button first. If they click the same button again, they’ll see the corresponding Landscape view. Use a series of hotspots and True/False variables on each preview icon to allow the user to toggle through them, and switch the screenshots in the ‘DevicePreviewImages’ as the user clicks. The images in the ‘DevicePreviewPopupLabels’ folder are pop-ups that appear when the user hovers over a preview icon, the pop-ups describe what sort of device that preview icon correlates to. They should appear when the user hovers on a preview icon

So I guess I'm back to variables and hovers again? Just wondering how someone would approach this?

Thanks, Marissa