User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I am designing a function where the user is able to drag items from one list and drop them in two others. I was wondering which direction is indicated for that action. In the first case, the list with items that I want to associate with the two other lists by dragging from left to right, and in the second case from right to left.
Any ideas? Thanx!
The positioning of drag source elements and drop targets largely depend on the culture. In countries that read left to right put the source elements on the left since that is where they will look first.
For your specific use case I would try and do it without using drag and drop as this interaction is hard to get right on every device and harder for users to discover without instruction.
As user's horizontal attention leans left it might be a good idea to arrange the items, that obviously should get attention first, on the left.
It's not entirely clear from your description and comments if the two dropping zones represent parts of a workflow. But assuming an item usually gets dragged to "edit" first before it later moves to "view" then a left-to-right alignment should be preferred. Both to keep the dragging ways short and also because timelines are usually represented left-to-right. According to this discussion this even seems to be the case for languages that are predominantly written from right to left.
I personally feel drag and drop interfaces can cause a considerable amount of friction. Have you considered a list of available choices with visibility toggles for edit and view mode? Could easily translate to smaller touch interfaces whereas drag and drop will not.
Maybe something along these lines?
I agree with the reading-left-to-right angle. But what about the hand movement to drag and drop items? As a right handed person, I would like to drag from right to left, that's the more natural movement. A not so very skilled tennis player prefers to play forehand and not backhand...
Just my two cents.
How many targets(lists) do you expect your users to have? If this number will never have to scale in big numbers you can create a drag short list.
As soon as the users starts a drag show the list icons or names and instead of the user dragging the item all the way to the list he can drop them next to the item itself.
Consider Fitts's Law. The farther someone has to drag an item the more prone the action is to error, and if the user has to traverse another drop zone, there is a high likelihood of the user dropping the item into the wrong zone.
Do many of your users use a laptop? Then that multiplies the likelihood of this error because they do not have the precision of a mouse.
If this pattern is implemented, you will need to provide a way for people to easily remove an item from a drop zone, because this corrective action will be needed frequently.
