This is an open space for collaborating on a file upload pattern. To join in the conversation please add a comment below.
File uploads helps users to select and upload files.
Use file upload when a user is required to upload one or more files from their device to a specific location. Only ask users to upload files when it’s critical to the delivery of your service.
- Use help text to highlight any input restrictions to the users upfront, for example format or size.
- Clearly communicate if a user can upload multiple files
- Allow multiple file formats as not everyone has access to the same software
- Be considerate of asking for large files, as some users may have limited band width or data
- Let users know exactly what errors happened during an upload process so they can fix them.
- Select files - Users click an action button that opens a file explorer to select files to upload.
- Drag and drop - Users drag and drop selected files directly into a drop zone area to upload.
File uploads should:
- Clearly communicate the status of the file being uploaded
- Ensure robust validation messages are provided in the event of errors