

Build an AI Design System
Your design system is built for humans. The moment you hand it to an AI agent, it starts inventing buttons, guessing at spacing, and hallucinating variants you never built. That's because it can't answer the most important questions it's silently asking: should I use this component, which variant, what goes inside it, what rules must I obey, and what should I never do. In this live session, we'll be building from an existing design system in Figma. First we'll learn how to encode components as structured metadata an AI can actually query. Then we'll build one real component together using Figma MCP, Claude Code, and Storybook so you can see exactly what this looks like in practice. We'll close with live Q&A so you can bring your own design system challenges to the table.
🎯 What you'll learn:
Why your design system doesn't speak your AI's language
The three pillars every agentic component needs (props, relationships, tokens)
Why anti-patterns matter as much as patterns
Why semantic naming beats technical naming for AI agents
How to create your own agentic design system from an existing design system in Figma.
How to build your first agentic component with Figma MCP + Claude Code + Storybook
👥 Who this is for:
Heads of design
Senior product designers
You'll get the most out of this if you've already spent some time in Claude Code.
📅 Event details:
🗓️ May 14
🕐 1:30 PM to 2:30 PM ET
🎟️ Free, subject to approval