help with Drap and Drop interaction

Apr 18, 2016

I am trying to create a drag and drop interaction where the user can hover over options to see the different answers and then once they decide which they think is correct I what them to drag that choice to it's correct position, the one where they were shown when they hovered over the choice. I can't get this interaction to work can anyone help? When I create this interaction both the answer option and the drag correct stay visible and drag together, I am not sure when I am doing wrong. 

 

 

18 Replies
Melissa Lucas

I was able to use the suggestion Walt gave me my issue now is I can't figure out the correct triggers to keep the choices at the bottom of the screen visible once the user picks on of them. Ideally it would be great if they could drag one of the options and if they want to try another they can drag one of the others as many times as they like. Right now it kind of works if you select the first answer then one of the others but you can only do that once and then the choice at the bottom don't show up anymore. I attached my file as well. Any help would be greatly appreciated.

Leslie McKerchie

Hi Melissa!

Sounds like you are hoping for a design outside of what a Drag and Drop can do. You have single items available as Drag Items, so they would not still exist if you already moved the item. You can no longer see the dropped items for the square and circle because of the states and they do not have a 'drop correct' target. Should they be pointing to the Rectangular Hotspot too? 

If I'm misunderstanding, just let me know.

Melissa Lucas

I want to make it work so that if you pick the square and drag it to where it shows you to place it and then decide you don't think that is the correct answer and pick the circle and drag that to where it shows you, the square returns to it's starting point. So you could drag and drop all the shapes as many times as you want before you pick and submit you final answer. 

Melissa Lucas

Ok I got the basic interaction to work as I was hoping My problem now is that the user has to place the white line in a specific spot for the question to be correct. I attached my storyline and a screenshot of what the placement should be for the question to be correct. Is this possible or Am I trying to do something that won't work in storyline?

Leslie McKerchie

Hi Melissa!

Thanks for sharing your file and allowing us to take a look.

By your statement above, I was assuming that it was only working if the user placed the line in a specific spot, but I get the impression after looking at the file that the user does not have to place in a certain spot.

Your hotspot is set up to be basically the entire slide, so it's working as you set it up. If you drop the line anywhere in that box, it will register as correct.

If you wish for this to be handled differently, I would advise reducing the size of your hotspot.

 

Ashley Terwilliger-Pollard

Hi Melissa,

I'm not sure I understand your latest question - the user should be able to see all the drag items, and then based on the size of your hotspot they can drop it anywhere. Since the line is the only one that has a drop target associated with it - that is the only one that will be scored correctly - but again they can drop it seemingly anywhere on the slide? 

Melissa Lucas

When I reduce the size of the hotspot I can no long allow the user to drop any of the choices anywhere on the screen, I would like them to be able to pick one of the choices and place it anywhere they think is correct and not know if it is correct until they hit the submit button. Maybe I need to change the state of the shapes? Right now the shape will only change if it's dragged over the hotspot. I attached my file with the smaller hotspot I am not sure how else to explain what I am trying to do. 

Ashley Terwilliger-Pollard

Hi Melissa,

Ok - so there are two ways you could handle this. 

One, you could disable the option you've set up in the Drag and Drop options to "return item to start point if dropped outside the correct drop target" or even "any drop target" as then the user could drag and drop anywhere they please.

Two, you could set the option to return to start point if dropped outside "any drop target" and then make additional drop targets (that don't have matching drag items and are therefore decoys) and place them all over the slide where you think a user may drag items too. 

That way your correct drop location can be smaller and still match the correct drag item. 

Walt Hamilton

Melissa,

Take a look at this. Slide 1 works, but if you change your mind, you have to drag the shape back to the red rectangle.

Slide 2 almost works the way you want. Moving the shapes back is the problem. I got them to move with motion paths, but if the user doesn't drag them, they still register as dropped on the hotspot, and you can't get a right answer. so I changed it to a pick one, and now they move back. The problem now is that since it is not a drag and drop, you can't control where they go when dropped. You could solve that by creating a bunch of smaller hotspots and covering the yard and house with them. then the shapes would stay pretty close to where they are dropped. The drawback would be that you would have to update the triggers to include all the hotspots.

Slide 3 is the original.

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