AI & Design Systems

Name: AI & Design Systems
Price: 12.75 USD
Availability: InStock
Rating: 5 (1 reviews)

8h 15m 18s

English

Paid

March 24, 2026

Unlock the future of digital product creation with our advanced course focused on AI and design systems. This course delves into essential concepts, cutting-edge technologies, and effective implementation strategies to enhance your skills in today’s dynamic environment.

This program is tailored for all professionals who impact the success of digital products within their organization. Whether you function as a designer, developer, product owner, manager, or leader, you'll gain an in-depth understanding of how AI integrates with design systems to elevate digital product quality. Our course seamlessly blends foundational knowledge with detailed practical insights to ensure you can proficiently navigate this subject matter.

Course Benefits

By enrolling in and completing this course, you will be equipped to:

Navigate the AI Landscape: Distinguish the true value of AI amidst the noise and stay ahead in the ever-evolving AI domain.
Utilize Critical Design Infrastructure: Understand the pivotal role of design systems in the AI-driven setting.
Enhance Product Creation: Become adept at leveraging the synergy between AI and design systems to craft superior digital products.
Accelerate AI Adoption: Employ architecture models and case studies to foster AI and design systems' integration.
Transform Team Dynamics: Streamline workflows and boost efficiency without reducing product quality.
Enhance Collaboration: Bridge designers and developers through shared concepts, languages, and frameworks.
Optimize Resource Usage: Effectively synchronize diverse environments, tools, and project components to save time and effort.

Course Structure

The course is self-paced and enriched with comprehensive video lessons that blend strategic theories with hands-on applications, exemplifying how AI and design systems are mutually advantageous. Below is a breakdown of the chapters covered:

Chapter 1: AI + Design Systems

Explore foundational concepts and interaction models that enhance the efficiency, consistency, and quality of digital products through AI and design systems.

Chapter 2: Technologies and Tools

Gain insight into the rapidly evolving landscape of technologies and tools within the realms of AI and design systems, equipping you for future challenges.

Chapter 3: Environments and Setup

Learn to integrate AI within design platforms, development environments, documentation processes, and other vital elements throughout the product lifecycle.

Chapter 4: Contextual Workflow of Design Systems

Master the utilization of AI for component creation, design artifact verification, translatory design-to-code processes, implementation validation, and accelerating high-quality deliverables.

Chapter 5: System Support and Readiness for Change

Develop a culture of adaptability and resilience to thrive in a constantly changing environment, ensuring your team is always ready for transformation.

Additional

PRE-ORDER Version of course. To be continue....

About the Authors

Brad Frost

About Brad Frost

Hello, I’m Brad Frost. I work as a design systems consultant and frontend developer. I also teach, speak, write, and create music and art. I care about the web, creativity, and how people work together to build useful digital products.

Work in Design Systems

I have helped many teams build design systems. I focus on clear structure, open processes, and a team-first culture. I created the Atomic Design method and wrote a book about building and keeping strong design systems.

My work includes the Style podcast, Pattern Lab, Styleguides.io, and the Style Guide Guide.

Teaching and Sharing

I like to make things and share what I learn. My talks, workshops, trainings, and writing help designers and developers understand how to work with design systems.

Life and Interests

I live in Pittsburgh, Pennsylvania, with my wife, my daughter Ella, and our French bulldog, Butzi. When I take a break from design tokens, I make music or work on a new project. I look for chances to create something new.

Ian Frost

About Ian Frost

Hello, my name is Ian Frost. I am Brad's younger brother. I work as a frontend architect, tech lead, and consultant. I focus on helping developers grow and improve their craft.

Work in Design Systems

I have worked on design systems with Brad since 2015. During these years, I built systems with Web Components, React, Angular, Vue, and other tools.

I have teamed up with tech leads, developers, and designers from many groups. I help them create and maintain clear and strong architectures for design systems and tokens. This work mixes science and art, and I want to share what we learned so you can use it in your own projects.

Background and Interests

Before I wrote code, I worked as a professional meteorologist. When I am not coding or forecasting snow, you may find me playing music, on a sports field, or with my wife and son.

TJ Pitre

I am a frontend engineer, design system architect, and founder of Southleft. For two decades, I have been helping product teams transform complex interfaces into reliable, scalable systems compatible with various brands, platforms, and teams. I enjoy creating interfaces that are both flexible and resilient.

In recent years, I've been focused on how artificial intelligence can accelerate the journey from design to development. I create generative UI prototypes and tools that help teams build real interfaces based on design systems, verify the correctness of tokens and component structures, and maintain high-quality standards with less cost. I regularly share this experience through demos, talks, and collaborative projects, exploring how AI enhances existing digital product creation processes.

I live in New Orleans with my wife and three children. When I'm not working on a new project, you can find me in the kitchen, workshop, or searching for the next exciting idea.

Watch Online 48 lessons

0:00

#1: 001 Intro 1080p

All Course Lessons (48)

#	Lesson Title	Duration
1	001 Intro 1080p Demo	00:58
2	002 Our Design Systems and AI Experience 1080p	03:49
3	003 Grounded in Reality and Respect 1080p	02:39
4	004 Moving Beyond the AI Hype Cycle 1080p	01:34
5	005 Course Outline 1080p	04:23
6	006 Join The Community 1080p	01:30
7	007 Who This Course Is For 1080p	02:20
8	008 Nuance and Responsibility around AI 1080p	03:58
9	009 Expectations and Next Steps 1080p	01:29
10	010 AI that knows (and uses) your design system 1080p	01:01:15
11	011 01 - Agentic Design Systems in 2026 with Storybook - Intro from Dominic Nguyen 1080p	11:59
12	012 02 - Agentic Design Systems in 2026 - Storybook MCP 720p	08:55
13	013 Into Design Systems - Vibe Coding Jam November 2025 720p	02:04:21
14	014 Part 1 Why Figma Console MCP 540p	07:58
15	015 Part 2 From System-Wide Awareness to Pinpoint Precision 720p	09:23
16	016 Part 3 Figma Console MCP vs. Dev Mode MCP – Component Creation 720p	09:50
17	017 Part 4 Unlocking Full Variable Access 540p	08:01
18	018 Part 5 Plugin Development and AI Feedback Loops 540p	07:30
19	019 Figma MCP → Web Components → React Storybook → Story UI 540p	06:38
20	020 Using Claude Desktop with Figma MCP, Story UI, and Design Systems Assistant 720p	06:15
21	021 Generate Stories in Story UI using Claude Desktop 540p	07:19
22	022 Installing Story UI Into Existing Custom Design System in Storybook 720p	10:11
23	023 Using Figma MCP with Claude Code	08:21
24	024 Design Systems Assistant Overview	02:48
25	025 Connecting The Design Systems Assistant to ChatGPT	07:22
26	026 Documentation Integrating Grammarly with Design Systems	08:20
27	027 Using MCP Apps with Figma Console MCP To Analyze Design System	07:34
28	028 Linting Components with FigmaLint	08:45
29	029 Figma Lint AI Model Integration and Features	11:01
30	030 Installing Figma Console MCP	08:26
31	031 Using the Figma Console MCP Effectively	14:17
32	032 Figma Console MCP Capabilities	13:47
33	033 Using Figma Console MCP for Enterprise Design System Applications	10:04
34	034 Implementing Code-Only Props Technique with Figma Console MCP	06:08
35	035 Figma Console MCP Design To Code Demo	11:48
36	036 Figma Console MCP Code To Design - Fixing Drift	08:47
37	037 Story UI and Claude Desktop	06:15
38	038 Cursor Features and Story UI	07:13
39	039 Using the Figma MCP and Design Systems Assistant	06:40
40	040 Understanding AI-Generated Interfaces with A2UI	19:45
41	041 Welcome!	00:26
42	042 AI & Design Systems Benefits Infomercial	00:37
43	043 Course Goals & Outcomes	01:43
44	044 Who This Course Is For	01:47
45	045 Meet Your Teachers	03:09
46	046 Our Collective AI Experience	01:27
47	047 Principles & Our Approach to AI	13:26
48	048 What To Expect	03:07

Unlock unlimited learning

Get instant access to all 47 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription