Optical Illusion (Drag and Drop)

May 08, 2012

We added a few more templates to the Storyline downloads including the optical illusion interaction. 

Demo

Tutorial

Source

CHALLENGE: A cool addition to this interaction would be a "hint" button to give learners a quick preview of the final cube. How would you do that?

11 Replies
Carla Stewart

Lovely demo! I'm just now finding time to play with Storyline. I love how easy it is to show and hide graphics. I thought a hint button could be used to reveal another layer with the graphic.

I couldn't find a solution for hiding the graphic. Close button? How can I fade the graphic out after a few seconds?

Rebecca Fleisch Cordeiro

Hi Carla, David, and Everyone,

I was playing around with different ideas. None of them are finished,  but here they are, along with questions.

This one:

OpticalIllusion_rfc_with_hint

Carla, my ideas was similar to yours. I placed the hint button on a new (hint) layer. To get it to fade after a few seconds, you can set entrance and exit animations and set the "time" on the timeline. Here's a screenshot:

And here's my example. What I don't like is that the hint can only be displayed once. I'd like it to be displayable repeatedly, or ideally, I'd  like to be able to set the number of times the Learner can display it. Anyone?

Two more ideas, next posts.

Rebecca Fleisch Cordeiro

So, I also wondered about putting the hint into a lightbox (Opticalillusion_rfc_with_ltbox.story. See attached. Couple things I would like to change:

  • I don't like having the "x" AND the click here to close button, and I actually prefer the button. But I don't know how to remove the X.
  • I'd also like to be able to set a time for the lightbox to display.

I suspect both are possible, but I haven't had enough time to investigate all that SL can do.

Back in a sec!

Rebecca Fleisch Cordeiro

My 3rd attempt was to have a character pop in and talk to the Learner, pointing out where an incorrectly placed circle should go.
OpticalIllusion__rfc_charcter_hints

A few things I'd like to change and learn

  • It would have been faster to create if I knew how to set up a  trigger with "show layer Hint when  circle 1 is NOT dropped on oval 1". Since I didn't know how to do this, I had to set it up to "show layer Hint when circle 1 IS dropped on 2, 3, 4,5,6, 7, 8. I'd  LOVE to know how to do it the easy way (yes, I did duplicates and copies once the initial thing was set up, but STILL!)
  • If the Learner isn't paying close attention as their dragging the circles over, they lose track of which one needs to be repositioned. And since they can all move at any time, it could get confusing. So, I'd want to set up some sort of scenario, like :
        -- don't allow placed circles to be moved when conditions meet such and so

    or better maybe
    __ change the color of the circles as/after they're placed

I DID  try to set up a state where the circle changed to selected after the user placed it, but it only worked if the user pressed the spacebar after placing. The spacebar is a condition I've set up with the hint. So it wasn't working right and I took it out. Anyone?

TX, ALL.

Rebecca Fleisch Cordeiro

I swear I posted this earlier. So if it's here twice, you know why!

John, TX for your additions to my hints story. It was a great challenge for me to determine how you did this, since I'm new to Storyline variables. But I got there, looking "under the hood" to see what you'd done, and then recreating it on my own.

But, I need help. My hint button still only gives a hint 1 time. Clearly I'm missing something, but after looking and looking at your story and mine, I'm not seeing it. Can you...or anyone...tell me what' wrong here?

TIA!

John U

Rebecca,

The Hint button does allow up to five hints, but the subsequent ones after the first will not show up if you click Hint before the Hint layer timeline ends.  You have the Hint object set for 1.5 seconds and the layer to close at 5 seconds.  Drag the layer end point to the Hint object end point and all should work.

John

Rebecca Fleisch Cordeiro

OM goodness! That's a really "fine" detail. Although its logical, I see why, as a newbie, I missed it. I should've sent this along before I spent an hour making comparisons. Thank you so so much! It works! And, I understand why it didn't.

I plan to send a tweet along about the great help from this community. Do you have a twitter account that I can @reference?

David Anderson

Rebecca Fleisch Cordeiro said:

My 3rd attempt was to have a character pop in and talk to the Learner, pointing out where an incorrectly placed circle should go.
OpticalIllusion__rfc_charcter_hints


How cool, Becky. I really liked the idea of using a guide to point out (literally!) the correct choices. What a neat idea for adding hints.

This discussion is closed. You can start a new discussion or contact Articulate Support.