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."

Ask the Rosenbot
Verónica Urzúa
The B-side of the Research Impact
2021 • Advancing Research 2021
Gold
Sara Asche Anderson
Not Your Ordinary Re-Brand: Design's Path to Driving Customer Obsession at Best Buy
2024 • Enterprise Experience 2020
Gold
Sofia Quintero
The Product Philosophy Behind EnjoyHQ
2021 • Advancing Research 2021
Gold
Jemma Ahmed
Redefining the research toolkit: Expanding methodologies for a changing world
2025 • Advancing Research 2025
Gold
Steve Sanderson
Discussion
2015 • Enterprise UX 2015
Gold
Nathan Shedroff
Redefining Value: Bridging the Innovation Culture Divide
2015 • Enterprise UX 2015
Gold
Nalini Kotamraju
Research After UX
2024 • Advancing Research 2024
Gold
Bob Baxley
Theme 4: Intro
2024 • Enterprise Experience 2020
Gold
Josh Clark
Sentient Design, AI, and the Radically Adaptive Experience (1st of 3 seminars)
2025 • Rosenfeld Community
Jennifer Strickland
Fireside Chat: How Design Addresses a World on Fire
2022 • Civic Design Community
Prayag Narula
Dialing for Research: How to Reach the Unreachable
2022 • Advancing Research 2022
Gold
Farid Sabitov
Automatization for Large Enterprise Teams
2024 • DesignOps Summit 2020
Gold
Ovetta Sampson
Turning UX Passion into Real Product Influence
2023 • Enterprise UX 2023
Gold
Lisa Spitz
Building Trust Through Equitable Research Practices
2022 • Civic Design 2022
Gold
Joshua Graves
We Need To Talk: Addressing Unmet Expectations (Part 2 of 3)
2025 • Rosenfeld Community
Giff Constable
Financial fluency for product leaders: AMA with Giff Constable
2024 • Rosenfeld Community

More Videos

Billy Carlson

"I want your sketching to be really high level—I want you to explore concepts, not refine content."

Billy Carlson

Tips to Utilize Wireframes to Tell an Effective Product Story

June 6, 2023

Alexis Lucio

"Accessibility is innovation and this statement could potentially be some unchecked ableism."

Alexis Lucio

Scaling Accessibility Through Design Systems

June 9, 2022

Sara Conklin

"Many UXers do feel stuck and care about climate, but they’re really not sure how to contribute professionally."

Sara Conklin

A UXer’s 12-Month Journey from Climate Concern to Climate Credibility

June 26, 2025

Prayag Narula

"Design research—they need each other. They are much, much better together."

Prayag Narula

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

June 10, 2022

Ryan Rumsey

"We have to remix familiar tools and frameworks so people in the organization recognize and trust them."

Ryan Rumsey

Business Influence Without Losing Your Soul

January 14, 2021

Theresa Marwah

"If participants want us to delete a video, we’re going to delete their video, even if legally we don’t have to."

Theresa Marwah

How Atlassian is Operationalizing Respect in Research

February 27, 2020

Christian Crumlish

"If you want to improve the product team’s understanding, frame UX value in terms of their language and goals, not just UX jargon."

Christian Crumlish

AMA with Christian Crumlish, author of Product Management for UX People

March 24, 2022

Jemma Ahmed

"We need to create an army of design thinkers across the organization who can make better decisions on what to build and how to build it."

Jemma Ahmed

Theme 2 Intro

January 8, 2024

Suzan Bednarz

"It’s important to distill accessibility guidelines into simple terms so designers understand why changes matter."

Suzan Bednarz Hilary Sunderland

AccessibilityOps for All

January 8, 2024