Rosenverse

This video is only accessible to Gold members. Log in or register for a free Gold Trial Account to watch.

Log in Register

Most conference talks are accessible to Gold members, while community videos are generally available to all logged-in members.

Meet Spectrum, Adobe’s Design System

Gold
Wednesday, June 9, 2021 • Design at Scale 2021
Share the love for this talk
Meet Spectrum, Adobe’s Design System
Speakers: PJ Buddhari and Nate Baldwin
Link:

Summary

We built Adobe’s design language, Spectrum, to work on a huge and varied product ecosystem. Adobe’s offering includes dozens of connected desktop, web, and mobile experiences with millions of worldwide users. Some of our products are brand new and some have been in the market for decades. Hear from two of Spectrum’s designers as they give an overview of the design system and answer your questions about building and scaling a design system!

Key Insights

  • Spectrum supports over 130 Adobe products across three business units and multiple platforms, requiring a highly scalable and flexible design system.

  • The design team does not implement components directly; implementation is handled by separate engineering teams, necessitating strong cross-team collaboration.

  • Spectrum evolved from occasional quarterly versions to individual component versioning, improving change tracking and prioritization by implementation teams.

  • A transparent design checklist tracks component quality and health with open issues linked to Jira tickets to prioritize fixes and improvements.

  • Spectrum Contributions is a sister site hosting 110+ work-in-progress components, increasing visibility and community feedback outside the core team.

  • A design token repository serves as a single source of truth for all component attributes like color and sizing, ensuring consistency and ease of updates.

  • Nate Baldwin highlights naming as the hardest ongoing challenge due to multiple platforms and diverse teams; content strategist Jess Satel assists in establishing a clear terminology.

  • Spectrum balances consistency and respect for platform-specific UI conventions by either skinning native components or documenting deviations explicitly.

  • Accessibility and color theming are managed by defining target contrast ratios first, then generating compliant colors via the custom tool Leonardo.

  • The Spectrum team fosters community via multiple engagement channels including Spectrum Guild quarterly meetings, town halls, office hours, and Slack, improving documentation and prioritization.

Notable Quotes

"Our team does not actually build the components consumed by product teams. Implementation teams report to their respective engineering and product orgs."

"We moved from versioning the entire system quarterly to individually versioning components, so changes are easier to track and prioritize."

"Naming things — components, properties, parts — is the hardest thing and it never stops. Thankfully, we have Jess Satel, our amazing content strategist."

"We try to keep things as consistent as possible in terms of the API but document where platforms need to deviate to be good citizens of their environment."

"Instead of choosing colors then checking contrast, we flipped the process and started by defining contrast ratio targets and then generating colors to meet them."

"We capture component design decisions and health transparently with checklists; unchecked items correspond to open tickets for prioritization."

"We have weekly meetings with implementation teams to design APIs, discuss progress, and address issues to ensure alignment."

"Spectrum Contributions site gives visibility to work-in-progress components, making users more vocal with feedback that we can capture and raise."

"Our UI kits are generated through JavaScript based on tokens, meaning less manual work, fewer errors, and consistent updates across themes and platforms."

"Spectrum is about empowering collaboration across products, disciplines, and clouds — not just providing tools but supporting people using the system."

Ask the Rosenbot
Russell Blair
Killing the blank page
2024 • Designing with AI 2024
Gold
Saara Kamppari-Miller
Theme Three Intro
2022 • DesignOps Summit 2022
Gold
Farid Sabitov
Automatization for Large Enterprise Teams
2024 • DesignOps Summit 2020
Gold
Taiye Akin-Akinyosoye
Amplifying voices and enhancing user research through group interviews
2025 • Advancing Research 2025
Gold
Landon Barnes
Are My Research Findings Actually Meaningful?
2022 • Advancing Research 2022
Gold
Meaghan Waters
Lack of Product Thinking will Doom Your Legacy Modernization
2021 • Design at Scale 2021
Gold
Uday Gajendar
Day 2 Welcome
2024 • Designing with AI 2024
Gold
Jeff Gothelf
The Intersection of Lean and Design
2019 • Enterprise Community
Tricia Wang
SCALE: Discussion
2018 • Enterprise Experience 2018
Gold
William Newton
How to Lead With Data, and Without Data
2023 • Enterprise UX 2023
Gold
Rachel Posman
A Closer Look at Team Ops and Product Ops (Two Sides of the DesignOps Coin)
2020 • DesignOps Community
Lena Shenkarenko
Collaborative Wireframing for Creating Team Alignment and Shipping Better Products
2020 • DesignOps Summit 2020
Gold
Sheryl Cababa
Living in the Clouds: Adopting a Systems Thinking Mindset
2023 • Enterprise UX 2023
Gold
Sam Proulx
Mobile Accessibility: Why Moving Accessibility Beyond the Desktop is Critical in a Mobile-first World
2022 • Civic Design 2022
Gold
Noreen Whysel
Short Take #4: UX/Product Lessons from Your Industry Peers
2022 • Design in Product 2022
Gold
Kristin Skinner
8 Types of Measures in Design Operations
2020 • DesignOps Community

More Videos

John Cutler

"If you need to cross a dangerous river, you don’t paddle straight into it; you use the opposing force of the river to move forward."

John Cutler

Oxbows, Rivers, and Estuaries: How to navigate the currents of change (without burning out)

December 3, 2024

Darian Davis

"We’re all capable of creating and perpetuating toxic work relationships."

Darian Davis

Lessons from a Toxic Work Relationship

January 8, 2024

Dave Gray

"You don’t have to sit through two hours a day; we’ll spend about 15 minutes on setup then you’ll pair up and do the exercise."

Dave Gray

Group Activity: Making Sense of DesignOps

November 7, 2017

John Cutler

"You wanna capture all the mess, but you cannot operate in the mess. Leave a path back to the mess so details and signals remain available."

John Cutler

The Alignment Trap

November 29, 2023

Abby Covert

"Diagramming is kindness we give to ourselves and others to get our bearings on things we’re stuck on."

Abby Covert

Stuck? Diagrams Help

October 27, 2022

Mark Interrante

"Making issues visible, sharing models, and iterating versions of workflows helps uncover blockages and solutions."

Mark Interrante

Collaboration Flows in Product Development

June 9, 2017

Devon Powers

"Afrofuturism shows us the future must reckon with the past and center difference and diversity."

Devon Powers

Imagining Better Futures

March 9, 2022

Prayag Narula

"The best teams I know are a quarter ahead of the product roadmap, seeking out impactful strategic research projects themselves."

Prayag Narula

How to Empower Your Designers to Do Good Research – And Why You Want To

June 10, 2022

Peter Van Dijck

"Your short term memory is the context window; too big, and the model has trouble accessing everything."

Peter Van Dijck

Hands on AI #3: Claude Code for UX people

October 22, 2025