Design systems

My timeline of design system work at Asana

I've worked on Asana's design system in two different phases. Below is an illustration of my timeline and beyond that the story of how that has evolved over time. You'll see my oldest work and my latest work!

Part 1: Getting the plane off the ground

My role

I was the founding designer for Asana's first design system. The initial team was an engineer counterpart, Dean and my design manager.

Background

While working on the design system at Eventbrite, a former colleague (newly at Asana) invited me to meet the team and learn more about the work they were doing. That conversation quickly turned into an opportunity, and before long I found myself at Asana, diving deep into their existing design work to help kickstart their design system efforts.

Getting a baseline

I started by getting to know key designers and engineers to understand their pains, hopes and worries for what a new design system at Asana could look like.

Corner stone: Documentation and code examples

It was immediately clear that we needed a dedicated destination for both design documentation and engineering code examples. While some versions of these existed before I joined, I jumped in to rethink and redesign them to better meet the needs of our internal teams.

Early on, we debated whether two separate sites were necessary and whether documentation should reflect an ideal future state or the sometimes messy reality of what was live.

Ultimately, we landed on a pair of sister sites that deep-linked to each other and surfaced relevant snippets contextually. This allowed us to maintain focus for each audience while creating a cohesive, cross-functional experience.

Base grids

I felt fortunate to start from the ground up with this system, though at times it felt more like lifting up a house to slide the foundation under it after the fact.

For years, Asana had relied on a mix of 4px and 5px spacing units, which led to a noticeably off-rhythm layout, especially across features built in isolation. One of the foundational changes was to unify the entire system around a consistent 4px spacing and sizing scale. It was a small shift with a big impact: it brought harmony to the interface and made cross-surface alignment far more manageable.

Colors

At the time, our color system was relatively simple compared to what it would become. Still, there were foundational issues to address, particularly with our mid-range grays many of which didn’t meet AA accessibility standards.

My initial focus was on correcting these and establishing a more compliant baseline. This early work laid the groundwork for broader accessibility improvements that would continue over the years.

Buttons

Our button system had grown inconsistent, with varying sizes, colors, and usage patterns across different product areas. This lack of cohesion made the UI feel fragmented and often failed to meet contrast and accessibility standards. Additionally, without clear guidance on hierarchy or usage, we ended up with too many “primary” buttons competing for attention, making it harder for users to navigate screens intuitively.

Modals

Modals were inconsistent, and height behavior followed a loose, unsystematic logic. This work introduced a more structured approach, anchored to our sizing scale, that allowed modal dimensions to scale elegantly. It ensured we could support current use cases while making space for more complex workflows in the future.

Keeping ourselves accountable

At the end of each half, we would send out brief surveys to designers and engineers to understand better how we were doing as a team towards our agreed upon goals and surface any areas where we could be doing better. This was a great way to continiously improve our processes and offerings

Part 2: Soaring to new heights

Asana Design system in 2025

Early in 2025, Asana went through a major re-org. The design system team inherited more people as a result (myself included).

While the team did a great job maturing and growing into the organization since I left he team in 2021, they faced a few challenges at this point:

  • Overindexing on consistency and documentation

  • They were locked into a slow rhythm of working.

  • There was a lack of innovation or curiosity on how to evolve the system

It was becoming more clear to me that the team needed to evolve and meet the demands of the business by focusing on larger experiential gaps that other teams were not focusing on.

As of right now I'm working with a PM to make the case for a sister team within Design system to go tackle bigger opportunities within the company.

Layouts WIP

How to pave the way for multi-product use. From a world where Asana feels rigid to a world where Asana feels nimble and flexible to different ways of working.

Headers WIP

Equal parts design vision and provocative prototyping to speed up internal process.

Creation WIP

Adding friction for better understanding. Educating the user on our objects and the options they have.

Conclusion

I’m very proud of the work I contributed across both web and mobile design systems(mobile is a story for another day) and even more proud of the culture and people who carried each initiative forward. This work was essential. it reduced decision fatigue, eliminated unnecessary debates, and made space for teams to focus on solving real user problems. While there was always some tension around how prescriptive a design system should be, my goal was always clear: to enable teams and help them move faster with confidence.