---

$300^.00 $400^.00 Register for this workshop → 3 × 2h live sessions + Q&A. Nov 23–27.
With all video recordings & slides. Get a ticket.

The Idea Behind It

Most teams add AI by plugging into builders that promise a design system connection, then more plugins, and lately more prompts, skills and markdown files.

Christine does it the other way round: first a shared structure that Figma, code and AI can all read, then the workflows on top. Most importantly, you could take AI out at any time and still have a clean codebase everyone understands and a Figma file that follows it. Your system works with AI, and it holds up without it.

Who Is This For?

• UI, product and design system designers who know Figma well and want their files, and their AI prototypes, to match what developers build.
• Developers and design engineers are welcome too, especially if you want to understand how designers can work with your design system.
• Solid Figma knowledge (components, variants, variables and auto layout) is needed. No coding skills required.

What Will Attendees Learn In This Workshop?

By the end of the course, you’ll have an in-depth understanding of:

• What is happening, why it all feels so confusing, and what you actually need versus what you can safely ignore
• Why design system principles matter more than ever for every team, which ones count, and how AI reads them
• How AI reads your design system: context and documentation, explained in plain words
• MCP in simple terms, and used hands-on
• What an AI-ready design system is, and why it is mostly a well-structured one
• Prototyping with real components instead of generating lookalikes, and the options you have
• A new in-system workflow where code becomes the source of truth, and designers can still design
• Keeping Figma and code in sync, and a new kind of handoff
• The honest gaps: what works today, and what nobody has solved yet
• Real hands-on time: your first steps in a codebase, prototyping, and connecting Figma and code

---

About Christine Vallaure

Christine Vallaure is the founder of moonlearning.io, a learning platform for UI, Figma and Product Building with AI. She’s also the author of theSolo.io, a practical guide to building and growing digital products independently, and a regular speaker at design and tech conferences.

Christine is deeply invested in bridging the gap between design and development, creating content and tools that help both sides work better together with more clarity, curiosity, and collaboration.

With over a decade of experience working with startups, agencies, and global brands across Berlin, Mexico City, and London, Christine now calls Madrid home. As a solo founder and creator, she’s passionate about the growing wave of independent builders who are rethinking how digital products are made, from the tools we use to the way we work.

Time & Schedule

This workshop is split over three sessions, from understanding to prototyping. The workshop sessions will run on the following days:

• Mon, November 23, 9:00 – 11:00 AM PT (18:00 – 20:00 CET)
• Wed, November 25, 9:00 – 11:00 AM PT (18:00 – 20:00 CET)
• Fri, November 27, 9:00 – 11:00 AM PT (18:00 – 20:00 CET)

$300^.00 $400^.00 Register for this workshop → 3 × 2h live sessions + Q&A. Nov 23–27.
With all video recordings & slides. Get a ticket.

---

Course Breakdown

Session 1 — Making Sense Of It All

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

• The current AI landscape: what is happening, and why
• Vibe coding with tools like Lovable, Bolt or Figma Make, pair design with Claude or Cursor, and agentic design system workflows: what each one is, and what fits your work
• How a language model works in a design workflow, and why everything in your Figma file and codebase is now context
• Why guidance is not the same as a check, and why a person stays in the loop
• What an AI-ready design system is, and how to check yours

11:00 AM – 11:30 AM
Q&A with Christine on the day’s material. Chat with each other.

Session 2 — Making Design AI-Ready

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

• The design system basics that matter now between Figma and code: naming, primitive and semantic tokens, variables, component properties that match the code, descriptions
• The instruction layer: rules files, design.md, skills, and context inside the component itself
• MCP hands-on, from Figma to code and back
• What to do when your design system is not AI-ready yet, and who does what in design and development
• An introduction to In-System Design: code as the source of truth, and where that leaves designers

11:00 AM – 11:30 AM
Q&A with Christine on the day’s material. Chat with each other.

Session 3 — Design And Prototype Inside The System

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

• How AI-ready design systems are starting to be set up on the development side, made understandable for designers
• A sample environment: Claude Code for designers, a small codebase, Storybook, and a design branch where nothing can break
• Prototyping in real code with a design system and without the drift
• Moving between prototype and Figma canvas, and feeding it back into the real code
• The honest open questions: the new handoff, keeping Figma and code in sync, and everything the flashy demos do not show

11:00 AM – 11:30 AM
Q&A with Christine on the day’s material. Chat with each other.

Subjects and day-by-day might be slightly adapted.