Name: Design Systems Mastery: From Foundations to Agentic AI
Price: 500 USD
Availability: PreOrder
Rating: 5 (5 reviews)

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.

19 درسًا مباشرًا6 أسابيعCohort 2

5.0 (5)

Mohamed Ismail

Design System Manager

ماذا ستتعلّم

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.

متطلبات الدورة

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.

الوصف

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.

المدرّبون

Mohamed Ismail

Design System Manager

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