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 occasions, our users would like to be able to drop files directly to form - e.g. to upload an image and link it to a blog post.

While the idea of stacked or otherwise combined dropzones on one page seems a bit wild, I was wondering if there are already some solutions to this problem. What would be the alternatives?

Initially, I was thinking of two solutions that could be easily possible:

What we have currently:

When there is no contextual dropzone

Idea 1:

Combination of both global and contextual dropzones

Idea 2:

Disabling Global dropzone when there is a form with file uploads

  • 1
    a very interesting problem, but I think the short answer is NO for your first "global" option. Second option requires a bit more info. eg: why would users be in this page to upload images and how would they link it to a blog post by drag and drop? Also, why the sidebar, are there more forms?
    – Devin
    Jul 5, 2023 at 19:53
  • 1
    @Devin In fact, the system is a CMS full of data to be filled in. So there is one media library you can upload to at any time, but then you'll also create a bunch of objects - blog posts, categories, products, slideshows etc. Those objects are not predefined, and users can create their own. That's why one image from the library may be used in multiple types of forms. And because of that, a path is not predefined - some users will start by uploading all media in one go and then attaching them to objects, but some prefer to start writing, e.g. blog posts, straight ahead and upload as they go. Jul 6, 2023 at 21:11
  • 1
    > how would they link it to a blog post by drag and drop? @Devin There is an option in each image field to attach a file from the media library. This opens a separate modal that allows you to pick one of the previously uploaded files. Jul 6, 2023 at 21:12

1 Answer 1


I think there are some standard practices for file attachments or uploads, and it really depends on the frequency and context that they are used in the application.

What you have outlined there is a strategy to design one pattern for all use cases, which you need to weigh up against creating design patterns for different contexts.

A good example for you to reference would be job application platforms and forms, where there is no standard for this, but the way you attach documents depends on the way the application form is laid out. When they require many fields and need to process it automatically, then specific file upload or attachment fields are allocated. But when there are only one or two fields and it is processed manually, you'll find just a single drop zone without specific context (e.g. attach any documents to support your application here).

This site is temporarily in read-only mode and not accepting new answers.

Not the answer you're looking for? Browse other questions tagged .