Asana project settings

Make project settings consistent across pages,
Make permissions settings easily discoverable.

Asana project settings — case study hero

Project Context

FY25 Roadmap

Sharing & Permission team

My Role

Product Designer

(UX + PM)

Methodologies

Data science reports

Product specification

Wireframes

Prototype

Usability Research

Overview

Project settings on different pages in Asana are currently scattered, making it hard for non-expert users to find them. This results in users being frustrated and confused, which can lead to less work being put in Asana.

We believe that simplifying settings on project, portfolio, goals, and dashboard pages into an intuitive framework will make our users happier and increase usage of Asana.

Before and after: scattered project settings consolidated into one intuitive framework

Problem statement

Problem exploration — project settings context 1
Problem exploration — project settings context 2
Problem exploration — project settings context 3

Design Goals

The new settings framework should be:

Scalable For New Settings

Able to accommodate new settings as features expand

Clarity & Consistency

Consistent framework of control settings across work graph objects

Predictability

Place relevant settings to be proximate to each other

Final design

Preserve the familiar entry points for each setting. Ensure that each modal serves a distinct function.

Final design: before and after comparison of consolidated project settings and share modals in Asana

Project action menu

Based on data science reports, I consolidated multiple settings into “Edit project settings”, placed frequently used actions higher and grouped similar actions together.

The proposed menu is less cluttered and easier for users to access desired actions.

Before and after comparison of the consolidated project action menu in Asana

Project settings

A modal with side nav offers scalability for settings, accommodating the expanding needs of enterprise users. Top search bar enables quick access to desired settings.

Before and after: unified project settings modal with sidebar navigation and search

Share settings

Move the permission settings under a clear tab rather than an ambiguous icon.

Before and after: Share dialog with Share, Permissions, and Notifications tabs replacing gear icon and scattered controls

Who are our users?

How do they interact with Asana project today?

Marketing Operator persona: how users interact with Asana project templates and settings

Competitor Overview

I analyzed the user experience of four competitors to understand their settings' frameworks, identifying the strengths, weaknesses, and potential opportunities in their approaches.

Slack: competitor settings UX — screenshots and analysis vs Asana

Define the solutions

To re-organize the currently scattered settings in Asana project, I started with information architecture, re-organized relevant settings to be on the same surface. Then I started very broad concept explorations, from proposing incremental changes to radical innovation.

Solution spectrum: from incremental hubs to radical AI-assisted settings concepts
Tab entry points for project settings, share, and customize in Asana

Pro: Distinct entry points for distinct modals

3 hubs / 3 entry points: Settings sidebar, Share modal, and Customize sidebar focused on main entry points
Entry points for duo hubs / two entry points concept in Asana

Con: Downplay the hierarchy of Share modal

Duo hubs solution: two entry points with focused modals and flows
Entry points for single modal / consolidated settings concept in Asana
Single modal solution: all-in-one settings with shared entry points

Information Architecture

At the end of my solution explorations, the Project icon, Project action menu, Share button, and Customize button continue to serve as the 4 entry points for all settings on the project page. Especially Share and Customize have established a mental model for Asana users and are essential value propositions and upsell features that must remain prominent.

Information architecture: four entry points and settings hierarchy diagrams with pros and cons

2 Directions For Settings Modal

These 2 treatments then went through usability test.

Two directions for project settings: flyout versus modal concepts with pros and cons

Usability Test

Usability tests for 15 users conducted on 8/14/24

I conducted an unmoderated usability test of the high-fidelity prototype with the assistance of the UXR team, involving a randomly selected group of 15 project managers.

Usability test results: participant heatmap for prototype A, B, and C across Customize, Share, and project settings observations

Usability Test Insight #1

Usability insight 1: supplementary figure for project title and project details entry

Users click the project title to change project details because they are less likely to navigate through multiple menu layers to find them.

Usability insight: behaviors around project title versus action menu, and proposed project settings entry from Edit project settings to Project details

Usability Test Insight #2

Usability insight 3: supplementary figure for custom fields and Customize permissions

Don't know where to change permission inside share modal

Participants struggled to find permission settings in the Share modal—many missed the control or used Access settings by mistake. A text-based tab for Permissions improves discoverability versus an ambiguous icon alone.

Usability insight 2: sticky-note feedback, behaviors and implications, and Today versus Proposed Share modal with Share, Permissions, and Notifications tabs

Usability Test Insight #3

Usability insight 3: supplementary figure for custom fields and Customize permissions

Don't know editing custom fields is under 'Customize' button, and can't find where the permission setting for it is at

Many participants tapped fields on the project surface first; the Customize entry point and “workflow & appearance” language in permissions were easy to miss. Clearer labeling and field-adjacent paths reduce confusion between editing fields and managing their permissions.

Usability insight 3: sticky notes, behaviors, implications, and proposed Project settings with Customize and Fields

Takeaways

Navigate my way through constraints

I initially believed I could complete this project within my internship by following the playbook. However, I encountered several unexpected delays and back-and-forths. The playbook is designed to align projects with broader company goals and strategies while incorporating multiple perspectives for a thorough review. Despite this, everyone has their own priorities, and understanding and navigating these has become crucial. Developing the ability to align with my work partners' priorities while motivating them to focus on mine is a skill I want to further refine.

Resources are finite, prioritize and strategize

Resources like engineering hours, time and budget are limited. Even if we're passionate about a feature, the team must prioritize the most critical ones or break it into multiple releases. My project is an improvement to a larger project, but the team lacks the capacity to implement it soon due to other important user stories in the pipeline. Therefore, we always need to prioritize and strategize what and when to implement.

Design is a part of my job, but not all of it

I realized that design is fundamentally a leadership role. It involves working with cross-functional teams to gather interests and push towards the company's goals. While design is a significant part of my job, it is not all of it—collaborating with others is equally important.