Questions tagged [drag-n-drop]
a method of direct manipulation where a user moves an item via a pointing device to "grab and drag" an item to a desired location, then "dropping" the item to specify an action to perform.
149
questions
1
vote
1
answer
1k
views
Uploading and categorizing files thereafter - What is the best way to upload these files?
We are building a feature where users can upload their files.
Idea (A):
Because multiple files can be uploaded by the user, one idea was to use a drop zone. The user is able to select a Category even ...
CommunityBot
- 1
2
votes
2
answers
219
views
Is dragging the mouse with a button pressed not controversial at all?
Not about drag'n'drop specifically, but all kinds of interactions requiring a mouse-button to be pressed while moving the mouse, or dragging while keeping the finger pressed to a touchscreen. ...
CommunityBot
- 1
1
vote
2
answers
299
views
Connecting items in from webshop A to B
In the current project I'm working on we need to connect items in different webshops together. These items are the same but they have different article numbers and different descriptions so the ...
CommunityBot
- 1
1
vote
1
answer
67
views
Global vs contextual file dropzones
Our application provides a global dropzone for convenient uploads into a media library - you drag a file, and an overlay for the entire page tells you that you can drop it anytime.
However, on certain ...
CommunityBot
- 1
1
vote
1
answer
137
views
I need a way for the user to select 4 boxes and arrange them in order
In my example I was thinking as the user clicks on a box the checkmark will be selected and there will a border displayed. After selecting the 4 selections they can drag them in order from left to ...
- 1,324
3
votes
2
answers
2k
views
Interface for selecting multiple items out of thousands, w/ categories
I'm trying to build an interface for filtering lots of data for the sake of searching. I need to present a VERY large collection of names, make it easy for the user to select all the names they need (...
4
votes
6
answers
1k
views
Drag and drop in one axis (reorder) - which cursor?
I was wondering which hover cursor is the best choice for dragging elements in one axis only, for example in reordering elements among listing.
cursor: move; It has four arrows, so it's misleading, ...
- 101
2
votes
1
answer
298
views
How do you make it obvious that the entire page is a drop zone?
We're building a feature where our users can upload files to their dashboards.
In addition to being able to view their files, I would like the users to be able to drag and drop files onto the page (...
- 68.6k
3
votes
2
answers
549
views
Best approach to having a sort, select and set of action buttons on a table row
Okay so I have a bit of an odd table to achieve and I'm unsure on the the best UI/UX approach to go with.
I have a small table of files, usually at most there would be about 10 files, one of the ...
CommunityBot
- 1
1
vote
1
answer
193
views
Expandable, nested graph editor
I have an application that allows users to create and edit graphs. The interface is a simple drag & drop UI that allows creation/deletion of nodes and edges. Nodes contain some internal ...
CommunityBot
- 1
0
votes
1
answer
576
views
User's expected behavior when uploading files before submitting
Problem:
I have a form that has a couple fields, but also asks for the user to upload files. Potentially, the user might upload multiple files, so we are saving them (kinda like saving drafts), but ...
- 1,404
1
vote
1
answer
266
views
Draggable widget - how to indicate draggability
I have a popup Javascript widget with an icon that is embedded into the right-hand corner of my site (by default.) The user can drag and drop the widget icon to another corner of the site if they wish,...
- 2,663
57
votes
10
answers
13k
views
How to visualize the possibility of drag'n'drop?
My web application contains a list of elements, which can be sorted by drag'n'drop. How should this feature be visually represented to users?
- 111
1
vote
3
answers
136
views
What feedback to give to users about why drag & drop does not work here?
I've been struggling to find good examples of this online, basically, the issue I'm trying to solve is that I want to provide feedback to users on why they're unable to rearrange the order of their ...
- 461
1
vote
1
answer
128
views
Should user simply be able to upload a PDF?
I'm working on an application where a user can submit an important document that contains information we need from them. The information contains details such as - event name, event location, duration,...
- 176
64
votes
8
answers
36k
views
Best UI pattern for letting a user assign items to groups
Problem: the user has a list of about 5-20 uncategorised items and needs to categorize them into 2-4 groups. The tricky part is that the same item can be placed into more than one group (this is an ...
- 111
2
votes
2
answers
791
views
Sorting VS Row Rearrange
I have a watchlist containing a list of stocks, and one of the popular usages of such a list is rearranging the rows (dragging and dropping selected rows to a favorite user position). Now, let's add a ...
- 27.5k
4
votes
2
answers
128
views
Communicate that an object in the toolbar cannot be added to the document a second time
I'm working on a toolbar containing objects that can be dragged into documents. You can also click on these objects to add them to the document. Some of these objects have restrictions and can be ...
- 322
4
votes
4
answers
722
views
Is there a good alternative to zebra stripes when rows use drag-and-drop reordering?
This answer gives pretty good evidence that in a table with multiple columns, zebra stripes are the most effective way to make it easy to see which rows are which in the table. Sometimes in tables, we ...
0
votes
1
answer
351
views
Drag and drop lists - multiple items with same priority
Initially, I had the following requirements:
There are 2 lists with items. The user needs to be able to move the items from one list into the other.
Each item needs to have a priority.
I've ...
- 27.5k
0
votes
2
answers
2k
views
Best UI pattern to allow the user to assign 1 level nested items to two groups
My issue is something similar to this one - Best UI pattern for letting a user assign items to groups
I am looking for a good UI design for mapping items between 2 groups (only one-to-one mapping). ...
CommunityBot
- 1
2
votes
1
answer
549
views
The best way to select multiple rows in a table and be able to reorder the selected rows [closed]
I am designing a dashboard where the user can select rows in a table and reorder/resequence the selected rows before clicking on the print button, What could be the best possible solution?
- 191
7
votes
2
answers
6k
views
"Click-and-drop" alternative to drag-and-drop, for accessibility (and maybe mobile-web)
I have observed some people fumble with a mouse. They seem unable to synchronize clicking the buttons and sliding the mouse consistently, to where they drag things when they only meant to click on ...
- 1
1
vote
3
answers
919
views
Adding extra information to a file that's being uploaded via dropzone
We're redesigning a file upload experience. The use case is to add supporting documentation to a support ticket. The user selects a file, indicates the document type, and then clicks Upload. Once ...
- 704
3
votes
1
answer
66
views
Horizontal slides editor - How improve its navigation?
I'm building an editor to create a structure of a page based on a full-screen vertical and horizontal slider.
A site is composed for vertical sections.
Each of those can have 0 or a limited number ...
- 552
1
vote
2
answers
452
views
Is it best practice to place an editable data table in a modal/popup?
I am curious if this is already established as best practice but so far I haven't seen any standards on this.
Let me know your thoughts.
Scenario is:
We are trying to go with either V1 or V2 inside ...
CommunityBot
- 1
34
votes
7
answers
24k
views
How to make it obvious that you can drag things that you normally can't?
My interface allows users to move things that usually have fixed positions in other applications, such as text boxes. What can I do to make it obvious to the user that they can move certain objects?
...
- 101
3
votes
3
answers
220
views
How to make this interface work when there are too many objects?
My situation is this: I have an administrative app for a school. A teacher can see a list of her classes, and their students, and you can drag a player from one class to another:
This works really ...
- 2,676
0
votes
2
answers
477
views
Best UX for loading several files and rename them
I have this screen where the user uploads up to 10 files, each one of them needs to be renamed to describe what's its content (fixed descriptions), I already rename the files as they are loaded, but ...
- 4,521
0
votes
1
answer
168
views
Trello-like UI with extra actions
Users are charmed by the easiness of Trello's way to move cards from one list to another to express actions. The question is, not everything can be expressed by changing column card belongs to. What ...
21
votes
8
answers
4k
views
Why is the drag area usually limited to the "title bar"?
Take a simple dialog window:
The user will expect that the titlebar can be used to drag the window through the screen. But why is it limited to just this bar?
Why is it uncommon that windows can ...
- 2,602
113
votes
6
answers
16k
views
What do the 3 close horizontal bars (not hamburger menu) represent and what is the origin of the design?
For some reason, those 3 horizontal bars centered in this Jabber client application is something I associate with something you can drag down, but I can't remember at all why I associate 3 bars with ...
CommunityBot
- 1
2
votes
1
answer
97
views
What would be the best way to organize a form development tool that has questions that can optionally be grouped by categories and subcategories?
I am building a form design tool for some clients to use when filling out some surveys.
The form can be populated with questions which map to varying form elements (Text, Select, Checkboxes, etc) - ...
- 398
12
votes
6
answers
787
views
What are the common idioms for the drop portion of a drag and drop operation?
I'm only concerned here with the other half of a D%D operation, the drop. What are the common idioms to communicate to a user they can drop? And which are the "best" and in what situations?
In ...
- 3,320
1
vote
2
answers
149
views
Which one is better for drag sign [closed]
I have checked some websites and found these two signs as drag symbol:
Which one is better?
- 19.8k
1
vote
1
answer
230
views
What is the technical name for the "Tap to translate" button from GoogleTranslate app?
When copying some text on Android, Google Translate displays a floating button on the side of the screen (top / right) that can be tapped to translate or just dragged up and down to not be obstructive....
CommunityBot
- 1
2
votes
3
answers
270
views
What is correct user expectation regarding drag and move?
I have the following note taking app - https://wenote.jstock.co
I have some question, regarding user expectation regarding drag and move.
Say, you have the following card position.
[1] [2]
[3] [4]
...
- 5,391
0
votes
1
answer
70
views
Editor functionality
We have an editor that allows you to build a static page.
On the left sidebar of the editor are buttons that allow you to change the colors, text, add images, etc. On the right is a preview of the ...
- 1,375
3
votes
4
answers
1k
views
Drag and drop reordering with large items
I'm trying to implement a drag-and-drop functionality to reorder items.
The items are of varying size (height), and in some extreme cases taller than the screen.
The simple method shown below wouldn'...
7
votes
7
answers
4k
views
Do people still use drag and drop?
Is drag and drop (for say photo uploads) a good idea? Aren't users frustrated by all the steps you have to take? Do most people even know how to do it?
Open a window
Browse to your files
Ensure ...
CommunityBot
- 1
5
votes
1
answer
825
views
How to show the user has "grabbed" an element?
I'm working on a mobile drag and drop feature, where users can rearrange the order of list items by dragging and dropping them in a new place in the list.
So far the flow is as follows: the user ...
- 543
5
votes
2
answers
366
views
What are the rules concerning drag-and-drop functionality?
I have an app with drag-and-drop functionality, and I'd like to make it conform to some sort of rule so as to make it as intuitive for my audience as possible. The iOS Human Interface Guidelines ...
- 9,044
5
votes
2
answers
579
views
Drag & Drop feature for customizing UI on modern web applications
Many web applications that allow you to design website have drag & drop features that allow you to rearrange the layout as most of the components are modular. There are also many web applications ...
- 21.4k
3
votes
1
answer
4k
views
Accessibility for a Draggable, Droppable and Sortable component
This is a component that I'm trying to make accessible:
As I understand, the ARIA Authoring Practices guidelines for drag and drop is basically:
Tab to move through the list of items
Space to select ...
1
vote
1
answer
506
views
What's Apple's term for horizontal "swipeable bar"?
I'm looking for the term of the UI element Apple is using pretty often lately. On iPads you can see them on the top of windows to symbolize that the user can drag this. On the iPhone X it replaced the ...
- 2,814
0
votes
2
answers
18k
views
Drag image here, drop image here, or drag and drop image here? [closed]
Are there any objective reasons to choose one of the below options?
I don't know whether to go with drag image here, drop image here, or drag and drop image here?
0
votes
1
answer
3k
views
Best practice for draggable, sortable with paging records
What will be best design practice for having items thumbnail with option as drag gable, sort able with paging records(considering more than 1000+ records)?
Below is just my current implementation.
...
CommunityBot
- 1
1
vote
2
answers
3k
views
Drag and drop vs file picker
This is part of the on-boarding process, where we encourage people to either create a new project or upload a specific file type to create project.
While I was designing I thought about three ...
- 281
28
votes
3
answers
10k
views
When to use grab vs move cursor?
I am making an app with a drag and drop UI. I plan on changing the cursor when hovering over the draggable elements.
What's the difference between the move and grab cursors?
Can they be used ...
CommunityBot
- 1
3
votes
2
answers
8k
views
What is the best icon to show that something can be dragged and reordered?
I am using jquery UI sortable to allow rows in an html table to be sortable. I want to use an icon for a handle and I am trying to figure out what is the best image / icon that would best illustrate ...
