Dom Christie

The Awkwardness of Drag and Drop File Uploads

Steps for drag and drop file upload:

  1. Switch from web browser to file browser e.g. Finder or Windows Explorer
  2. Navigate to files
  3. Arrange windows so that files can be dragged to web browser (resize/move/switch windows to ensure droppable area is visible)
  4. Drag and drop files to droppable area

Compared with uploading via basic input[type=file]:

  1. Open file browser from web browser
  2. Navigate to files
  3. Choose files to upload

Related: User experience trends and the problem with stealing bad ideas.