New live course
The problem
Figma UI
Coded UI
The shift
What you will build
Live and cohort based
The method
What you will learn
Set the direction and start building immediately.
Design Systems Have a New User
Understand why AI changes the role of a Design System without turning the session into abstract AI theory.
You leave with: AI does not remove the need for a Design System. It increases the value of a well-structured one.
Define the System We Will Build
Turn the course into a real system project.
You leave with: A Design System project definition and architecture plan.
Prototype the First System Slice
End the first week with something tangible.
You leave with: A first working slice of the system plus a list of context gaps.
Build foundations that people and AI can understand.
Tokens, Semantics, and Naming
Understand how to create a token model that communicates intent.
You leave with: Agreed token taxonomy for the project.
Build the Foundation in Figma
Implement the token architecture as Figma variables.
You leave with: Working Figma foundations and variable architecture.
Component Architecture for Humans and AI
Create components with predictable APIs and boundaries.
You leave with: A coherent initial Figma component library.
Connect design, AI, repositories, and code.
Connect Figma and AI
Give AI structured access to the actual design.
You leave with: Working Figma to agent connection.
Code for Designers
Make the codebase understandable without teaching a frontend development course.
You leave with: You can navigate the repository and explain how a component is represented in code.
Git, GitHub, and GitLab
Understand safe version-controlled workflows.
You leave with: A working Design System repository and basic review workflow.
Turn the system into production components.
Build with shadcn
Understand why shadcn is a useful foundation for a custom AI-era Design System.
You leave with: Working shadcn setup aligned to the project.
Build and Customize Components
Implement the core Design System in code.
You leave with: A working production component library.
Build the shadcn Registry
Make the system distributable and discoverable.
You leave with: Working custom registry.
Make the system understandable to people and AI.
Storybook as the System Interface
Document the implementation so people can understand and use components correctly.
You leave with: Initial documented Storybook environment.
Storybook for Humans and AI
Turn documentation into structured context agents can consume.
You leave with: An AI-accessible Storybook workflow.
Teach AI Your Design System
Create persistent rules so you do not need to repeat the same instructions in every prompt.
You leave with: A persistent AI instruction layer for the system.
Use the system for real product work, then learn how to keep it healthy.
Build a Product with AI
Test whether AI can actually use the Design System instead of inventing UI.
You leave with: A real working product interface built with the Design System.
Maintain the System with AI
Use AI as a maintenance and auditing assistant.
You leave with: AI-assisted maintenance toolkit.
Governance, Evolution, and Final Presentation
Define how AI participates in the system after the course and present the completed work.
You leave with: Completed capstone and governance model.
Part-time training
The teacher
The toolchain
- FigmaDesign Tokens
- Figma MCP · BridgeClaude
- React + ShadCNStorybook + MCP
- GitGithub · Gitlab
Who it’s for
- Product Designers
- Principal · Staff Designers
- Design Systems Leads
- Product & Design Directors
Pricing
Academy
999€ 899€
Have any question?
The course is designed primarily for Product Designers, Design System Designers, and Design System Leads who already understand the basics of Design Systems and want to learn how to build and operate them in an AI-assisted product workflow.
It is particularly relevant if you want to become more technical without becoming a full-time developer.
The course is intermediate. You should already be comfortable working in Figma and understand basic concepts such as components, variants, Auto Layout, variables, and Design Systems.
We will not spend the course teaching Figma fundamentals from scratch.
No. This is not a programming bootcamp.
You will work with code, repositories, React components, Git, and AI-generated changes, but the objective is to teach the technical concepts a designer needs to understand, direct, and review the work. You are not expected to become a frontend engineer during the course.
The practical workflow is designed around Claude and Codex. We will also use integrations such as Figma MCP and Storybook MCP where appropriate.
The principles are more important than any single AI product, so the course is designed to remain useful as tools evolve.
An agentic Design System is a system structured so AI agents can do more than generate random UI.
Agents can inspect the system, understand approved components and tokens, read documentation and rules, help build product interfaces, validate work, and assist with maintenance. Human judgment and governance remain central.
You will build one complete Design System project throughout the six weeks rather than completing disconnected exercises. The project will include:
- Figma foundations
- Primitive and semantic tokens
- Reusable components
- A code repository
- shadcn-based components
- A custom component registry
- Storybook documentation
- AI instructions
- MCP integrations
- A real product interface
- AI-assisted maintenance workflows
- A governance model
The course runs for six weeks. There are three live sessions every week.
Plan for approximately two hours of independent project work per week, plus additional time to complete the final capstone.
The current estimate is approximately 52 to 54 total hours across the full program, including the 36 live teaching hours.
Students who successfully complete the required final project receive the Certified AI Design Systems Practitioner certification.
The intention is for it to reflect demonstrated practical competency rather than simply attendance.
The program is live, project-based, and focused specifically on Design Systems. Students build one system over six weeks, receive direct feedback, troubleshoot real implementation issues, compare approaches with other practitioners, and finish with a capstone rather than only watching tutorials.
The value is direct teaching, cohort interaction, practical system-building, and deep Design System expertise applied to AI.