Drag and Drop Target Evaluation
Apr 09, 2024
Hi everyone...I am new to Storyline and trying to understand the drag-and-drop behavior. I have a drag-and-drop interaction that I put together, sample in the attached .story file. The interaction works like this:
- Drag a circle into a box.
- If the circle is put in the incorrect box, it snaps back.
- If the circle is put in the correct box, it snaps into place.
- Once all boxes have the correct circle snapped in, the interaction auto-submits and feedback appears.
I thought everything was working well, but in testing I noticed an odd behavior. If a circle is dragged over two boxes, it appears to evaluate against both, and will snap into place on the correct box, even if the circle is primarily over an incorrect box. So in this example, where Drag 3's correct Target is Drop Target 4:
It will snap to Drop Target 4 even though the user's intended target was Drop Target 3.
Is this the intended behavior in Storyline? Is there anyway to limit the evaluation of the drop against only the box the circle is primarily over? I know of two methods:
- I can space the targets out enough that the circle can only be over one. This works, but it can really use up sometimes limited screen space. The extra spacing between boxes doesn't look great either.
- I can create narrow invisible drop targets running through the middle of the boxes, but they still require enough space between them to prevent the circle from overlapping two of them (although not as bad as #1). It also causes the circle to snap to the wrong spot.
2 Replies
In dropping the object on two targets, you allow it to choose. If you were the object, which one would you choose? Seriously, when caught with a dilemma like that, it errs to benefit the learner. I think that is a good thing.
Yes, you have to change the size or spacing of something. Sorry.
I would choose the one the majority of the object is over. I understand your point, but I think that when the learner clearly selected the incorrect option, the result should reflect that choice.
Storyline knows which object that is as well. If I change the Drag Item Options to return if dropped outside "any drop target" instead of "a correct drop target", and drag the circle as shown in my screenshot above, it snaps to the intended box, Drop Target 3.
And it doesn't appear to have anything to do with stack order either. If I do the reverse, dragging Drag 1 over Drop Target 4 and just touching Drop Target 3, it will snap to Drop Target 4 if "any drop target" is selected.
The behavior seems to me to be inconsistent. It also makes developing interactions where the drop targets are necessarily close, like using pieces of a pie chart as targets, more difficult.
Thankfully my client was ok with me redesigning the interactions to spread the targets out so that overlapping two at once was impossible. But it would be great if this behavior with "a correct drop target" was optional.