Design Systems Mastery: From Foundations to Agentic AI
Design Systems Mastery: From Foundations to Agentic AI
Learn how to build a real design system from the ground up, and take it further than most designers ever do. Architect scalable token structures, build component libraries with Atomic Design, and document systems that teams actually use, then step into the agentic era: direct AI to generate your tokens, scaffold components, and ship them as production-ready code. All guided by a Design System Manager with experience on million-dollar projects. Trusted by 150+ students across the Arab World.
What you'll learn
Audit any existing product UI and produce a structured design audit report with prioritized findings.- Plan and build tokens in Figma using Variables and Styles, with support for modes.
- Create a components following Atomic Design methodology, from subatomic particles to full page templates.
- Use agentic AI to generate tokens and components, and ship them as production-ready code.
- Document your system with clear guidelines, usage rules, and structured references that designers and developers can follow.
- Set up a governance model and adoption framework to maintain and scale the system across teams and products.
This course includes:
Course requirements
Figma Proficiency: You should be comfortable working in Figma (creating frames, using auto layout, basic components). This is not a Figma beginner course.- Design Experience (1+ years): You should have at least one year of hands-on UI or product design experience. Understanding of basic design principles (color, typography, layout) is expected.
- Commitment to Weekly Sessions: The bootcamp runs for 5 weeks with live sessions. You need to commit to attending or catching up via recordings within the week.
Description
This is a 5-week, hands-on bootcamp where you build a real design system, not watch someone talk about one.
You'll start with foundations: understanding what a design system is, running a design audit, and planning your system roadmap. Then across three dedicated token sessions, you'll build color, typography, sizing, shadow, and composite token structures in Figma, applying naming conventions, scaling strategies, semantic mapping, and light/dark mode setup.
From there, you'll move into component architecture, learning Auto Layout, Figma Properties, and Variants before building simple and complex components using compound composition and slotting techniques. You'll also learn how to document components professionally, and set up governance and maintenance processes.
The bootcamp ends with a capstone project where you deliver a complete design system for a real product brief; including tokens, components, documentation, and a full case study.
Everything is built in Figma. Everything is hands-on.
Who is this course for
Product Designers - Design the system, not just the screens.
UI Designers - Master tokens, modes, and structure.
UX Designers - Bridge strategy with infrastructure.
Who is this course for
Product Designers - Design the system, not just the screens.
UI Designers - Master tokens, modes, and structure.
UX Designers - Bridge strategy with infrastructure.
Course syllabus
6 Weeks • 11 Modules • 33 lessons (19 live lessons)
Design Systems: Getting StartedDesign AuditFile structure & Roadmap
Activity: Conduct a design audit on a real productHomework: Complete your design audit.Instructors
I'm Ismail, a Design System Manager at du, one of the UAE's biggest telecom operators.
My day-to-day is token architecture, component governance, multi-brand systems, and the unglamorous work of keeping a design system alive and adopted across dozens of teams.
I've been building design systems for years. Not writing about them - actually building them, maintaining them, and fighting for them.
I started teaching because I kept seeing talented designers hit the same wall - they understood the concept but had never actually built a system end to end. Never dealt with the naming decisions, the governance questions, the "what do we do when the dev team ignores the tokens" conversations.
That's what the bootcamp is about. Not theory. The real thing.
150+ designers across 15+ countries have gone through it. 200+ hours of live instruction. And every cohort, I'm teaching the same frameworks I used that week
Frequently Asked Questions
If you still have questions, contact instructor or Zomra on LinkedIn
All live sessions are recorded and available for replay within 24 hours. You can watch them at your convenience.
You're one step away from learning new skills, achieving your career goals, & earning a certificate.
Certificate of Completion
Design Systems Mastery: From Foundations to Agentic AI
Graduated from Design Systems Mastery: From Foundations to Agentic AI at Zomra, with strong grasp of its fundamentals, completed all coursework and activities.