Reimagining organization and decluttering on the Figma dashboard
SKILLS
Product Design, Feature Development
TOOLBOX
Figma · Branding · User Research · Product Design
TIMELINE
3 days (take home assignment)
Background
For the Kleiner Perkins Design Fellowship Program, I was given the opportunity to redesign a feature for one of their portfolio companies. I decided to explore a problem space I personally was frustrated with on Figma (a truly ambitious task to pursue as a designer). Since I started my design journey on Figma, as it was extremely accessible as the first browser-interface design tool, I thought it would be a full circle moment to think about a problem I personally faced on the software.
How can we revolutionize productivity and streamline your workflow on the Figma dashboard through organization and decluttering?
Problem
The current design of Figma's dashboard lacks intuitive organization and presents cluttered information, leading to user frustration and hindering the ability to efficiently manage and find design projects. A redesign of the Figma dashboard is necessary to improve usability, streamline workflows, and enhance user satisfaction.
What are the tasks that the users are trying to accomplish?
Currently, Figma's users aren't solely designers, there's a lot of collaborate work to make the design process more streamlined across teams.
feature development and thinking
what are the tasks that the users are trying to accomplish?
currently, figma's users aren't solely designers, there's a lot of collaborate work to make the design process more streamlined across teams.
most users use figma for cross team collaboration, having coworkers from multiple departments (from user research, to design, to engineering hand off) working on a single project. this can include:
- having multiple figma files each with its own purpose
- having one figma file with different pages that have its own purpose
ex 1. Having multiple files for different uses and using the 'shared emails' to collaborate across teams
ex 2. Having 1 centralized Figma file where the work is divided by content type w/ Pages
figma's users are currently using the tool for cross team collaboration for handoff and ease of use for design and prototyping
however..
organization is a huge problem that users encounter when they're trying to accomplish what they want to do with using figma
"I have multiple project as I am sure everyone else does. Is there a way to create folders and organize projects ? "
my current figma dashboard
what are the truths that the users currently do?
i divided our main users into two groups, the teams that have multiple files for one project, and the teams that have one file with multiple pages
ex 1. Having multiple files for different uses and using the 'shared emails' to collaborate across teams
- if the file is not in a figma "Project" that is already shared, users have to share the file through email address or link accessed
- ex. research: user stories, user flow, epics, etc.
- ex. design: low fidelity prototype, high fidelity prototype, etc.
users in this category may either do the following to better organize their files and/or to find their file:
Create a Team (which only allows three files on the free plan) and add team members through email once.
this disregards stand-alone designers
create a New Project to "make sharing easier
this idea is similar to having folders, nested inside a Team, which becomes problematic when you don't need a team to have folders.
use the search bar option to search for key words
as this searches all files in your figma account, it becomes difficult to find the specific file in a specific project or domain that the user is looking for
currently, users open the figma app and it leads to the most recent files that are open. the main dashboard is currently not only ineffective but not reaching its full potential for users to reach the file they want to with the least amount of conscious effort.
current figma dashboard sorted under Drafts
current figma dashboard sorted under Recent(ly opened)
there is a sorting and filtering system for the current dashboard, which adds a lot of unnecessary extra steps to find a file we're looking for
how do you reduce the amount of steps to get there without conscious effort?
reimagining the figma dashboard
design opportunities
basic organizing files under categories
the Project feature figma currently has is similar to folders, which help with organizing files. However, they are nested within Teams which is difficult to work to find files as a stand alone user
→ a "tagging" feature along with what figma currently has with Project/folders to add additional context to what the file holds, as well as folders to organize files within
tagging feature
example folder containing 8 files, with the blurb "for joycejiang.space" and including "ux" and "ui" tags
personalized dashboard: choose what you want featured or "pinned"
users often have a hard time viewing the files that they want since the figma dashboard automatically shows "Recently opened" files, and you have to sort/filter or search to find the file.
→ a featured section up to the user's discretion on what figma files or folders they want "pinned", up to three sizes that they can customize
tagging feature
personalized message on the dashboard using figma's cursor design
tags and folders on sidebar
thinking of both of our stand alone figma users and those on a a multi-person team, the dashboard should be configured for both audiences, as well as those categorized above with those having multiple files, or one files.
→ thus, figma will be organized by your tags, folders, and team workspaces. within the workspace, are the same features with tags and folders
prototyping!
reflection
overall, this project was extremely interesting to walk through the different questions i had laid out for feature development
- what are the tasks that the users are trying to accomplish?
- what are the truths that the users currently do?
- how do you reduce the amount of steps to get there without conscious effort?
this allowed me to separate my design process into three different steps, instead of immediately jumping to a solution that is more visual and dream-oriented, rather than designing a feature that a user wants that will solve their pain points.
for the user interface and visual design aspect, i had a lot of fun with figma's design system and aligning my components to match their design system. i added the recognizable figma cursor with a welcome message to make the software seem more personable to the user.
for the future and when i have more time to come back and work on this project, i would love to further create prototyping links to see how the dashboard will act in service of team workspaces, and the featured "pinned" option for team workspaces. i would also work to do user testing.