December 8, 2021
Drag and Drop with precise placement
December 8, 2021
Drag and Drop with precise placement
My name is Andreas Becker. I have a degree in Geology, but for the last 15 years worked for different Payment Service Providers as Customer Servivce Representative, Trainer, and for the last 7 years as Instructional Designer and Course Developer.I'm German, but live and work in Poland.
Guide 8 posts
Followers: 4 people

This is in relation to this forum post:

where the poster asks for a way to assure that a D&D interaction only registers success, when the correct drag source is dropped on some exact spot over the correct drop target (as opposed to anywhere over the correct drop target).

The problem is that for registering success on a D&D interaction it is sufficient when the correct drag source and the correct drop target just overlap in some way (by down to 1 pixel actually), which means it’s not particularly picky where exactly one drops the object.

It does however only register success if the correct drag source is dropped anywhere over the correct drop target, but at the same time not anywhere over any other incorrect drop target. By cleverly placing transparent incorrect drop targets on the stage, one can limit the position that would register success to a much better defined spot.

Check out the Cp 2019 project file attached here:


This is a demo based on the use case discussed in the forum post mentioned. It would only register success if the light-blue color roller is placed directly across the one already visible on the stage. That is if the light-blue roller touches the little green square (drop target OkDrop – defined as correct), but does not protrude into the red-shaded area (any of the drop targets NoDrop1 through 4). It seems to be vital that the correct drop target is placed below the incorrect ones in the stacking order on the timeline.

You can play with the size of the drop targets to make the interaction more or less picky or allowing as to what position of the light-blue drag source would be acceptable for being evaluated as correct. You’d probably don’t want to be too strict here, or else people will get incorrect results even though they grasped the concept, just because they are a pixel or two off when dropping the roller.

Of course you’d have both correct and incorrect drop targets set to be fully transparent in the real thing.

Add Comment