Rosenverse

Bridging Design and Code: AI-Powered Design System Integration

Gold
Thursday, September 11, 2025 • DesignOps Summit 2025
Share the love for this talk
Bridging Design and Code: AI-Powered Design System Integration
Speakers: Ryan Matthew and Alex Kurchev
Link:

Summary

What if your design system could move from Figma to production-ready code—without heavy technical lift? In this session, we’ll share how AI can interpret design system content in Figma, transform it into coded components, and export it to Storybook for developers to use. Explore an evolving approach to streamlining workflows, closing the design–dev gap, and unlocking new ways for teams to collaborate at scale.

Key Insights

  • Structured, token-first Figma design systems are critical for successful AI-driven code generation.

  • Using Figma REST API with MCP server enables two-way sync between design files and code repositories.

  • Generative AI can create fully documented, accessible React components integrated with Storybook directly from Figma.

  • Designers with minimal coding experience can leverage AI tools to produce production-ready UI components.

  • AI reduces manual developer work and accelerates design system delivery from weeks to minutes.

  • Maintaining a single source of truth in design and code prevents UI inconsistencies across multiple developer teams.

  • MCP server acts as a universal adapter allowing AI models to interpret Figma design intent and properties.

  • Accessibility features are best annotated in Figma and automatically incorporated by AI in generated components.

  • The approach is platform and code agnostic; AI can generate components for various frameworks beyond React.

  • Governance and version control via GitHub ensure transparency and maintainability of AI-generated design system code.

Notable Quotes

"Figma files are no longer just a collection of visual elements; designers actively shape product features now."

"If the designer or developer can see the intent of the visual element, AI can see it also."

"Maintaining large-scale design systems is a real challenge that AI tools are starting to solve."

"It took me just a little bit amount of time to get into that and actually make a proper component from Figma."

"We are creating the repository of a design system that is highly customizable and ready for developers to start product development."

"AI-generated components maintain end-to-end system quality while developers focus on functionality."

"The style component was developed in two minutes rather than taking a few days to create and document."

"Annotate in Figma dev mode lets you provide accessibility details that AI models will implement automatically."

"This is not just a shift of different tools; it’s the way we build products now."

"Using AI to tighten the gap between design and engineering is essential to know how to use in our work right now."

Ask the Rosenbot
Jessamyn Edwards
Surviving Your UX Career in Enterprise Design
2021 • Enterprise Community
Lais de Almeida
Designing Data Services
2024 • Advancing Service Design 2024
Gold
Ellie Krysl
Planned Right. Managed Right. Designed Right.
2023 • Enterprise UX 2023
Gold
Jake Burghardt
Stop wasting research: Create new value with insight summaries
2025 • Rosenfeld Community
Nick Cochran
Growing in Enterprise Design through Making Connections
2019 • Enterprise Community
Dan Hill
Strategic design, slowdown, and the infrastructures of everyday life
2022 • Enterprise Community
Prayag Narula
Empowering Designers to do Good Research
2022 • Advancing Research 2022
Gold
Shan Shen
Translating UX Terms into Business Contexts
2023 • Design in Product 2023
Gold
Craig Villamor
Design Systems for Ethical Design
2023 • Enterprise Community
Bria Alexander
Opening Remarks
2021 • Design at Scale 2021
Gold
Jaskiran Kang
Why Community is Key to Professionalizing Design
2022 • Civic Design Community
Joerg Beringer
Scaling User Research with AI: Continuous Discovery of User Needs in Minutes
2025 • DesignOps Summit 2025
Gold
Jack Moffett
SAFe or Sorry?
2019 • Enterprise Community
Bria Alexander
Opening Remarks
2023 • Advancing Research 2023
Gold
Louis Rosenfeld
Welcome / Housekeeping
2023 • Enterprise UX 2023
Gold
Mariesa Lenz
What Beekeeping Taught me about Product Teams
2025 • Rosenfeld Community

More Videos

Rebecca Gimenez

"If you ask our partners what we do, they might say I’m not totally sure, but I know that we need it."

Rebecca Gimenez

Work in Progress: Service Design at Airbnb

December 3, 2024

Lada Gorlenko

"The digital frontline workers in retail became critical almost overnight during the pandemic."

Lada Gorlenko

Theme 2 Intro

June 9, 2022

Brigette Metzler

"Maintaining a research repository often requires 100% manual participation from researchers, which can be hard to enforce."

Brigette Metzler Dana Chrisfield

Research Repositories: A global project by the ResearchOps Community

August 27, 2020

"Delight forums helped us share stories and build a shared vernacular but didn’t lead to significant change by themselves."

Discussion

June 9, 2017

Sarah Brooks

"Designing a service is really designing a new relationship between government and people, who come with enormous baggage."

Sarah Brooks Jennifer Pahlka

Fireside chat with Sarah Brooks and Jen Pahlka

October 21, 2021

Lisa Spitz

"We constantly analyze our recruitment data and note that we still struggle to reach Hispanic or Latino origin individuals, older adults, and lower-income participants."

Lisa Spitz Nikki Brand

Building Trust Through Equitable Research Practices

November 18, 2022

Theresa Neil

"Designers almost always partner with clinicians who are the domain experts in healthcare projects."

Theresa Neil

Designing for Wellness: Specializing in Healthcare

May 22, 2024

Maverick Chan

"We have to show clients the hundreds of sketches and iterations behind the AI-generated outputs."

Maverick Chan Claire Lin

From Doodle to Demo: AI as Our Storytelling Partner

October 23, 2025

Alla Weinberg

"If there isn’t safety and connection, you get a culture of transaction and silence that kills innovation."

Alla Weinberg

Design Teams Need Psychological Safety: Here’s How to Create It

September 8, 2022