Rosenverse
Design Systems To-Go: Reimagining Developer Handoff, and Introducing App Builder (Part 2)

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: Reimagining Developer Handoff, and Introducing App Builder (Part 2)

Gold
Friday, October 1, 2021 • DesignOps Summit 2021
Share the love for this talk
Design Systems To-Go: Reimagining Developer Handoff, and Introducing App Builder (Part 2)
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

  • White-label design systems like Indigo.Design enable easy branding customization with minimal time and effort.

  • The integrated design-to-development pipeline outputs real coded web components (HTML, TypeScript, CSS) instead of static specs.

  • Ab Builder provides a cloud-based collaborative workspace where designers and developers operate on identical visual and functional components.

  • Dynamic data binding in components supports real data from JSON or CMS sources, improving prototype realism and development readiness.

  • Compared to tools like Adobe XD or Zeplin, this solution drastically reduces developer rework by providing pre-built, accessible, and extensible components.

  • Layouts are translated from absolute positioning in design tools to web-based row and flex layouts for accurate responsive rendering.

  • The tool supports multiple design platforms including Sketch, Adobe XD, and soon Figma with plugins to enable smooth importing and exporting.

  • Developers get fully functional components with accessibility, localization, keyboard navigation, and UI behavior built in from the start.

  • Enterprise-ready components like data grids come with advanced features such as filtering, sorting, and grouping embedded out-of-the-box.

  • Design changes pushed to the library notify projects, allowing synchronized updates across multiple products with minimal manual effort.

Notable Quotes

"Changing branding and the look and feel should be possible with very quick and easy interactions, not taking another 10 weeks to customize."

"The components you design in Sketch or XD come with matching coded components in the app builder, so what you design is what you get in code."

"Our approach eliminates the need for developers to inspect design specs to recreate styling and layouts from scratch."

"You get real coded components, not just HTML snippets or style attributes, meaning developers can drag, drop, and extend with hooks already in place."

"The biggest gain is about getting value out sooner, with an 80 percent efficiency improvement from design to running app."

"All our components can be data bound so the developer can point to any data source like CMS or JSON to populate UI elements naturally."

"We translate absolute positioning from design tools into web-based layouts using row and flex concepts familiar to developers."

"The Ab Builder is a collaborative workspace where designers and developers have synchronized component libraries and themes."

"Our tool is not partial to Sketch — we support Adobe XD and will soon support Figma, enabling flexible integration in design workflows."

"A mature design system needs both UI kits and matching developer component libraries; we provide both out of the box."

Ask the Rosenbot
Kevin M. Hoffman
Theme 2: Enterprise Team Journey
2019 • Enterprise Experience 2019
Gold
Lisa Spitz
Building Trust Through Equitable Research Practices
2022 • Civic Design 2022
Gold
Liz Ebengo
The Burden on Children: The Cost of Insufficient Post-Conflict Services and Pathways Forward
2024 • Advancing Service Design 2024
Gold
Verónica Urzúa
The B-side of the Research Impact
2021 • Advancing Research 2021
Gold
Uday Gajendar
Theme One Intro
2023 • Enterprise UX 2023
Gold
Bria Alexander
Opening Remarks
2022 • Civic Design 2022
Gold
Bria Alexander
Opening Remarks
2022 • Civic Design 2022
Gold
Sofía Delsordo
Public Policy for Jalisco's Designers to Make Design Matter
2021 • Civic Design 2021
Gold
Louis Rosenfeld
Opening Remarks
2022 • Civic Design 2022
Gold
Ignacio Martinez
Fair and Effective Designer Evaluation
2024 • DesignOps Summit 2024
Gold
Greg Nudelman
Designing Conversational Interfaces
2019 • Enterprise Community
Natalie Dunbar
DesignOps and Content Strategy: Envisioning the Future Together
2021 • DesignOps Summit 2021
Gold
Saara Kamppari-Miller
Theme Three Intro
2023 • DesignOps Summit 2023
Gold
Kristin Skinner
Opening Keynote: Org Design for Design Orgs
2017 • DesignOps Summit 2017
Gold
Nathan Shedroff
How Will Design be Taught When the Schools Shut Down?
2026 • Rosenfeld Community
Theresa Neil
Just Build Me a Dashboard!
2019 • Enterprise Community

More Videos

Surya Vanka

"Embedding process knowledge directly into work surfaces helps teams unpack and collaborate effectively."

Surya Vanka

Unleashing Swarm Creativity to Solve Enterprise Challenges

June 10, 2021

Patrick Boehler

"Most people joined us with tactical asks but the conversations became strategic."

Patrick Boehler Madison Karas

The service shift: transforming media organizations to create real value through design

November 19, 2025

Andreas Huebner

"Research and design together tell a continuous story that guides what problems we tackle and how we solve them."

Andreas Huebner Amy Takata Craig Brookes

What Is It Like To Be Part of The UX Team at Compass?

March 11, 2021

Patrizia Bertini

"Leaders spend a lot of time on operational work, which does not allow design strategy to mature."

Patrizia Bertini Alexandra Mengoni León

Pushing DesignOps’ Influence into New Global Markets

September 9, 2022

Phil Gilbert

"We could create a sustainable culture of design and use it as our leading edge weapon of transformation."

Phil Gilbert

A Consistent Culture of Design

May 14, 2015

Yulya Besplemennova

"AI behaves like an alien intern because it’s not capable of making sense of some things easy for us."

Yulya Besplemennova

[Demo] Stress-testing GenAI in user research synthesis

June 4, 2024

Sarah Rink

"Don’t do remote contextual inquiry just because you can; you lose so much context."

Sarah Rink

Remote User Research: Dos and Don'ts from the Virtual Field

June 11, 2020

Mujtaba Hameed

"When clients join us in the field and experience research deeply, they often become advocates who come back for more."

Mujtaba Hameed

The new horizon of ethnography: using AI to unlock the full potential of in-person research

March 11, 2026

Sheryl Cababa

"Involving stakeholders with lived experience empowers design and enriches domain knowledge."

Sheryl Cababa

Living in the Clouds: Adopting a Systems Thinking Mindset

June 6, 2023