Dropbox + Atlassian
Dropbox formed a partnership with Atlassian to make it easier to manage projects involving many files. One of our highest priorities was to help people get value from Dropbox files attached in project management tool Trello. I led the design of bringing Dropbox file thumbnails and previews into Trello.
Role: Designer
Team: Walid Omar, Ximena Ampuera, Drew Haven, Mukund Tiberwala, Angela Gorden
Press: Make project coordination easier with our new Trello integration
Helping project coordinators identify and track files
Coordinators, e.g. product managers, producers, and people overseeing work, tend to be more active in Trello, where they have a clear overview of their projects.
From research, we learned they care about a few key things:
“I want to feel confident that I’m accessing the right file.”
“I want to discuss and coordinate file changes with my team.”
Supporting file thumbnails and previews
However, from Trello…
It was hard to identify Dropbox files because there’s no thumbnail image
It was hard to see information about file changes at a glance
It was hard to stay oriented because file previews open in separate tabs
Before
I designed a new Dropbox section that appears in the Trello card when someone attaches a file. Now people can easily…
Identify files from thumbnail images
See information about file changes
Preview files without leaving Trello
After
Designing thumbnails as components
Because files are a core part of Dropbox, I designed the thumbnails as components that can be used across third party tools—not just in Trello. I contained Dropbox information inside of the tile and placed third-party metadata outside.
Improving folder attachments
Sometimes people will attach a Dropbox folder to a project task. To keep a consistent Dropbox identity in third party tools, it was important to unify the design of file and folder components.
I chose to update an existing folder component. In addition to making visual changes, I wanted to…
Make file actions more discoverable
Clarify information about file changes
Make the design responsive-friendly
Let people collapse the component to save space
Before
After
Putting it all together
