Redesign the Dropbox dashboard to increase the visibility of different file types
Users can’t easily identify the types of files that they have saved
Clarify redundancies from the current dashboard design and give users a clear view of all available file types
Understand ➡️ Define ➡️ Ideate ➡️ Test ➡️ Prototype
•Desktop dashboard displays both ‘Suggested for you’ and ‘Recent’ files which feels redundant
•File type of ‘Recent’ files is identified by the extension and a small icon
•There’s no way to organize or view by file type
To kick off, I conducted a brief competitive analysis to learn about what the dashboards of other file hosting services look like. I chose to analyze Google Drive, Box, and iCloud Drive, and focused on researching how they identify different file types.
All three file management products display file types on the user dashboard in a similar way. They rely on the file extension of individual documents as well as small icons to identify file types. None offer users the ability to view or organize files by file type on the dashboard. Dropbox could differentiate their dashboard design from the competitors by offering users a view of their files organized by type.
The time constraints of this challenge prevented me from doing extensive user research. To make sure I wasn’t flying blind and operating on assumptions, I conducted a brief interview with a current Dropbox user to learn about their experience with the product. Based on the information I learned, I created a simple persona to define who the user might be and to provide a reference point for later design decisions.
•As a new or returning user, I want to view the types of files that I have saved
•As a new or returning user, I want to quickly find all of my files of a certain type
I sketched four variations of a redesigned Dropbox dashboard. With each iteration, my goal was to remove redundancies from the current dashboard design and give users a clear view of all available file types. The ‘Suggested for you’ section or the ‘Recent’ section on each was replaced with a section called ‘All Files.’ The files are then either displayed in folders grouped by file type or they are able to be filtered by selecting a file type from the list next to the ‘All Files’ title.
Next I turned to Figma to create digital wireframes. I created two wireframes of the dashboard - one with the ‘All Files’ section replacing ‘Recent’ on the bottom third of the screen, the other with ‘All Files’ being displayed prominently as the first section on the top of the screen. All other elements of the current dashboard including the main navigation menu and CTAs remained unchanged.
I created and distributed a preference test of the two wireframes. Time constraints limited the responses I was able to collect, but 3 out of 4 participants preferred version 2. Taking the users’ preferences into account, I created a high-fidelity mockup of the dashboard.
At the start of this challenge, I wasn’t sure how much I would be able to accomplish and I was worried about running out of time. In the end, I was surprised that I was able to get so much done in just one day. This challenge helped me see the importance of breaking a larger problem down into smaller steps. By being methodical but flexible with the design process, a lot can be accomplished in a short amount of time.
