Agentic Design Systems + Figma

The practical guide for designers working with AI agents.


COMING SOON
Sign up for the newsletter to be the first to know.

Something that started in enterprise design systems is now trickling down fast, and it changes what your Figma file is actually for. This course is about understanding what's happening and making sure your work is ready for it. The good news: most of this is stuff you should already be doing. The better news: if you get it right, you have more creative control over what gets built than ever before.

Part One: Understand it

1. What agentic AI actually is
2. What makes a design system agent-ready?
3. What MCP is and how it works with your Figma file
4. Code Connect, explained for designers
5. Let's build a simple agent in Claude Cowork — no code needed

Part Two: Set it up

1. Variables and why the semantic layer is non-negotiable
2. Matching component properties to code
3. Designing every state
4. Figma Slots
5. Layer naming and auto layout as instructions
6. Writing descriptions agents can actually use
7. Where the gaps are — and how to stay in control
   
   

Part Three: The extra mile

1. Introduction to context-based design systems 
2. Working with developers in an agentic setup 
3. Accessibility in an agentic workflow 
4. Keeping your visual voice 
5. The evolving role of the designer 

Already a member? Click here