What is a good and elegant way to show user that he can use drag and drop, but when the folder is not empty?

It's not a problem for empty folder. I can use the whole area outlined by dash line. But when it contains some folders/files in it. It's quite tricky.

Thank you in advance.

1 Answer 1


I think one question that comes to mind is: if there is already a file in the folder, how did it get in there? If it was placed there by your user, he should already be aware that there is a way to drag and drop files, as he will have seen the dashed lined area that you described.

If that isn't the case, you could go with a small text note either inside the droppable area or above it. You could even place the whole dashed line under the existing elements, given that there is still space left. Undoubtedly you'd have to make some sort of visual signification.

Another thing you could do is placing an upload button (which you should have either way to give your users a possibility to upload files the usual/classic way) somewhere in your GUI which will trigger a modal dialog containing the dashed lines with a note that you could either drag and drop files there or hit a "Browse…" button that will trigger the default process by the browser. That way you can establish your drag and drop functionality in a more context oriented way, without having to fill up space in your GUI.

  • This is a completely new UI, before that users have been using upload button. And this needs mostly for old users. About the line around of free space, it is a good idea. Thank you.
    – Ju-v
    Commented Mar 18, 2016 at 23:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.