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.

Design Systems To-Go: Introducing a Starter Design System, and Indigo.Design Overview (Part 1)
Gold
Thursday, September 30, 2021 • DesignOps Summit 2021
Share the love for this talk
Design Systems To-Go: Introducing a Starter Design System, and Indigo.Design Overview (Part 1)
Speakers: George Abraham and Stefan Ivanov
Link:

Summary

A Design system is not only about standardizing the UI or accelerating design. In the big picture, it can streamline collaboration between design and development. With this goal in mind, an effective Design system is available to both designers and developers in a format that is native to each discipline. However, getting to this point takes time. But what if we can skip ahead with a starter Design system containing both design and coded components that are ready for use? Join our activity sessions to see how you can transform your pixel-perfect designs into pixel-perfect code for modern web applications with Indigo.Design. We will also revisit the typical developer handoff by introducing a re-imagined workflow that minimizes rework. In the end, this approach can free up our focus to run Design-Ops better and deliver value sooner. ? Part 1 (Thursday): Introducing a starter Design system, and Indigo.Design overview Part 2 (Friday): Reimagining developer handoff, and introducing App builder Part 3 (Friday): Indigo.Design overview and exploring the developer workflow

Key Insights

  • Building and maintaining a custom design system often requires a dedicated team and significant overhead, which can be a deal breaker for small teams or agencies.

  • Many organizations end up with a Frankenstein design by mixing elements from various popular design systems without cohesion.

  • Indigo.Design offers a white-label, customizable starter design system aiming to fit diverse niches and verticals.

  • Matching design and developer toolkits in native formats (Sketch, XD, Figma, Angular) creates smoother workflows and reduces handoff friction.

  • The Indigo.Design plugin allows real-time theme customization, generating entire color palettes and typography schemes from base inputs.

  • The system automatically converts absolute design layouts into responsive flex layouts during handoff to save designers and developers time.

  • Cloud-based prototyping enables pixel-perfect sharing, stakeholder feedback, and integrated usability testing with video recording.

  • Open-source style hooks and fully accessible source code empower developers to localize and customize UI for different regions and languages.

  • A major goal is to eliminate wasteful debates over pixel-level differences by automating fidelity in design-to-code translation.

  • Indigo.Design does not seek to replace existing tools like Zeplin or InVision but to complement design and developer toolchains with integrated capabilities.

Notable Quotes

"Design systems has always been a beginning, like a seed, and design ops basically serves as the nurture."

"For a design system to be effective, it should be available to both designers and developers as a matching set and in a format that is native to each discipline."

"Sometimes different teams use different tools, so you may need a design system for Sketch for one team but then for XD for another."

"You end up with something which I call Franken design because it’s kind of a mix and match of many different things, but it’s anything but a real design system."

"We try to provide a lot more patterns because for newbie designers or product owners, patterns help them put together flows quickly."

"With the Indigo.Design plugin, you can profoundly change how the whole design system looks by just tweaking primary or secondary colors."

"Once you use Indigo.Design in Sketch or XD, you’re just a few clicks away from having a running Angular app based on our developer toolkit."

"Our handoff process turns absolute layout into a flex layout structure, so you get responsiveness out of the box without copying screens for each size."

"Final versions often do not look exactly like the original design, so we want to invest our time in process improvement, not arguing over pixels."

"You want designers to use the UI kit like any other UI kit, and developers to modify the code they’re familiar with, all matched perfectly."

Dr. Jamika D. Burge
Bridge Building across Research Disciplines
2021 • Advancing Research Community
Sabrina Mach
How to Design Your Design Operating Model
2021 • DesignOps Summit 2021
Gold
Bria Alexander
Opening Remarks
2023 • DesignOps Summit 2023
Gold
Scott Stephens
The Next Generation in DesignOps Toolsets
2022 • DesignOps Community
Shipra Kayan
How we Built a VoC (Voice of the Customer) Practice at Upwork from the Ground Up
2021 • DesignOps Summit 2021
Gold
Alexia Cohen
Increasing Health Equity and Improving the Service Experience for Under-Served Latine Communities in Arizona
2024 • Advancing Service Design 2024
Gold
Max Gadney
Assessing UX jobs for impact in climate
2024 • Climate UX Interest Group
Alfred Kahn
A Seat at the Table: Making Your Team a Strategic Partner
2023 • Design in Product 2023
Gold
Bria Alexander
Day 2 Welcome
2024 • DesignOps Summit 2024
Gold
Ari Zelmanow
Dark Side of Democratization
2023 • Advancing Research Community
Sarah Barrett
AI in Real Life: Using LLMs to Turbocharge Microsoft Learn
2025 • Rosenfeld Community
Adam Cutler
People + Places + Practices = Outcomes
2016 • Enterprise UX 2016
Gold
Mackenzie Cockram
Integrating Qualitative and Quantitative Research from Discovery to Live
2022 • QuantQual Interest Group
Jamie Beck Alexander
How can you find your role in climate?
2024 • Climate UX Interest Group
Fatimah Richmond
The Future of ReOps as a Strategic Function: A Roadmap for Getting There
2024 • Advancing Research 2024
Gold
Bria Alexander
Opening Remarks Day 2
2024 • Advancing Research 2024
Gold

More Videos

Jon Fukuda

"We don’t need a north star, we need a constellation that allows us to see the full picture."

Jon Fukuda Ellie Krysl

Design Planning and Management Support

October 3, 2023

Saara Kamppari-Miller

"When we don’t have the people modeling we need, we have to make it ourselves to lift the fog."

Saara Kamppari-Miller

Cartography for Design Communities

September 10, 2025

Kevin Bethune

"Gatekeepers expect compliance, whereas servant leaders want to make the vision smarter with the team."

Kevin Bethune

Reimagining Design: Unlocking Strategic Innovation

June 8, 2022

Daniel Orbach

"Create a feedback loop, keep it simple, empower designers to own their ways of working, and have patience for results."

Daniel Orbach

Zero to One: Co-Creating Operating Models with your Team

September 23, 2024

Marc Fonteijn

"We encourage one-to-one video calls to build rapport and feel comfortable reaching out for advice."

Marc Fonteijn Ru Butler

Increase your confidence, influence, and impact (through a Professional Community)

December 3, 2024

Clara Kliman-Silver

"It can be really hard to tell what is AI and what isn’t, and your average user may not know the difference."

Clara Kliman-Silver

UX Futures: The Role of Artificial Intelligence in Design

June 7, 2023

Robin Beers

"Synthesis is a researcher’s superpower, not just analysis or breaking things down."

Robin Beers Nalini Kotamraju Andy Warr

Panel: Excellence in Communicating Insights

March 26, 2024

Ana Maria Montero Barrantes

"Puppetry lets you communicate like, I don’t like what you said, how come you said that to me."

Ana Maria Montero Barrantes Aditi Dhar Michelle Kaplan Nate Osborne Matt Laurence

The Authentic UX Talent Show

January 8, 2024

Kristen Honey

"I got my PhD so I could get a seat at the table."

Kristen Honey

"Let’s Talk About Data and Crisis”: Public Digital Service Delivery = Open Data + Human Centered Design

November 18, 2021