Rosenverse
Meet Spectrum, Adobe’s Design System

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
Tricia Wang
SCALE: Discussion
2018 • Enterprise Experience 2018
Gold
Bria Alexander
Day 3 Welcome
2024 • DesignOps Summit 2024
Gold
Bria Alexander
Opening Remarks
2021 • DesignOps Summit 2021
Gold
Louis Rosenfeld
GenAI for UXers: A Rosenbot Demo and Discussion
2025 • Designing with AI 2025
Gold
David Cronin
The GE Design System and Thoughts about Craft at Scale
2015 • Enterprise UX 2015
Gold
Cheryl Platz
Collaborative Creativity through Improv
2018 • DesignOps Summit 2018
Gold
Miles Orkin
Creativity and Culture
2018 • DesignOps Summit 2018
Gold
Jen Crim
Culture, DIBS & Recruiting
2021 • Design at Scale 2021
Gold
George Abraham
Design Systems To-Go: Reimagining Developer Handoff, and Introducing App Builder (Part 2)
2021 • DesignOps Summit 2021
Gold
Patrizia Bertini
The (r)evolution of designOps: It’s Time to Think (really) BIG
2025 • DesignOps Summit 2025
Gold
Jacqui Frey
Setting the Table for Dynamic Change
2019 • DesignOps Summit 2019
Gold
Luca Rager
Empowering Gaming at Scale: How Xbox Builds Powerful, Automated, and Distributed Design Systems with Sketch
2021 • DesignOps Summit 2021
Gold
John Taschek
Making People the X-Factor in the Enterprise
2018 • Enterprise Experience 2018
Gold
Noel Lamb
Cultivating Business Partnerships to Grow Research Ops
2022 • Advancing Research Community
Sam Proulx
Accessibility: An Opportunity to Innovate
2022 • Design at Scale 2022
Gold
Sarah Brooks
Fireside chat with Sarah Brooks and Jen Pahlka
2021 • Civic Design Community

More Videos

Shipra Kayan

"VOC wasn’t a replacement for user research, but an enhancer that captured nuggets researchers might miss during discovery."

Shipra Kayan

How we Built a VoC (Voice of the Customer) Practice at Upwork from the Ground Up

September 30, 2021

Peter Morville

"Most categories are fuzzy; there’s no clear boundary between what’s in or out."

Peter Morville

The Architecture of Understanding

May 13, 2015

Renee Reid

"I was able to connect the dots a lot for the UX team because I had those relationships from customer success."

Renee Reid

Becoming a ResearchH.E.R (Highly Enterprise Ready)

June 3, 2019

Dane DeSutter

"Gestures serve as a window into the embodied mind by replaying prior embodied experiences when we communicate."

Dane DeSutter

Keeping the Body in Mind: What Gestures and Embodied Actions Tell You That Users May Not

March 26, 2024

Sam Proulx

"Accessibility is a journey and a conversation—thanks for starting yours by being here today."

Sam Proulx

Online Shopping: Designing an Accessible Experience

October 3, 2023

Andrew Custage

"Balance UX and CX—making the site work technically is not enough if the content or experience isn’t meaningful."

Andrew Custage Michael Mallett

The Digital Journey: Research on Consumer Frustration and Loyalty

March 29, 2023

Shelby Switzer

"It’s okay to be goofy and have fun—creating space for awkwardness and playfulness helps engagement."

Shelby Switzer

Making Space for Community Knowledge-sharing in a Distributed World

December 10, 2021

Llewyn Paine

"Volume is a losing game because we cannot outcompete full AI automation for sheer speed and quantity of insights."

Llewyn Paine

Coexisting with AI: A practical guide for researchers to navigate tools, ethics, and integration

March 11, 2025

Robin Beers

"A metaphor is like a flashlight—it shines on some things and keeps others in the dark."

Robin Beers

Navigating organizational systems: Rethinking researcher’s role in driving change

March 13, 2025