Goal

To enhance the current user experience for users when performing file uploads.

Problem

Our file upload component is outdated and does not provide ample information for users while uploading files.

Strategy

Redesign the file upload component.

Current File Upload component

Our current file upload component looks outdated. Users also have no confirmation when a file is uploaded.

Users will be able to access admin privileges via admin icon located at the bottom of the main navigation. Clicking on the admin icon opens up a list of admin privileges. This makes the main navigation cleaner.

The purposed new design for file upload component

The purposed new design for file upload component

This is how the component looks in active state - when a file is being upload

This is how the component looks in active state - when a file is being upload

This is how the component looks when a file has finished uploading

This is how the component looks when a file has finished uploading

This is how the component looks in hover state

This is how the component looks in hover state

Users can also hover on the file for a quick preview or download. This function does not exist on our current platform.

Users can also hover on the file for a quick preview or download. This function does not exist on our current platform.