Designing With AI: Claude, Codex, Figma | Full Guide
Learn how to design with AI using Claude from Anthropic, Codex from OpenAI, Google Stitch, Mobbin, and Figma.
This full guide walks through how I use AI tools in real product design workflows, from early ideation and UX thinking to wireframing, high-fidelity design, design systems, prototyping, and production-ready UI.
We’ll look at where Claude, Codex, Google Stitch, Mobbin, and Figma fit into the design process, how to avoid generic AI-generated results, and how designers can move faster, make better decisions, and burn fewer tokens without losing taste, structure, or control.
🔗 KEY LINKS
📣 JOIN THE COMMUNITY: https://uicollective.co/
❎ Follow me on X: https://x.com/KirkMDesign
Why Join UI Collective Academy? Get access to premium courses, premium downloads, and so much more on the way (I am largely building this solo...trying to make design education available for all, support goes a long way!)
↪️ Need a design system? (also included in the academy): https://collectivekit.co/
🔗 OTHER SYSTEM VIDEOS TO WATCH
Build a Design System: • Build a Design System - Full Course
Complex Design System & Figma Variable Setup: • Design System & Figma Variable Set Up - Fu...
Claude Design Video: • Claude Design: The Complete Guide
🔗 MORE LINKS
Let us build or fix your design system: https://designsystemlabs.co/
📣 Save 20% on the Annual Mobbin plan: http://mobbin.com/uicollective
Google Stitch: https://stitch.withgoogle.com/
Claude Design: https://claude.ai/design
[email protected]
0:00 An Introduction
0:52 AI is Not a Tool, AI is a Workflow
6:43 The AI Design Stack
7:32 Claude vs Codex
9:16 AI Design Setup (Figma Skills & Figma MCP)
16:31 Google Stitch
21:27 Where I Use Stitch In My Workflow
23:29 Claude Design
27:01 Claude Design Output
28:35 When to Use Google Stitch With Claude Design
31:44 Claude Design Limitation
32:35 Claude and Codex Comparison Experiment
38:25 Best Use of AI Tokens
40:45 Design Systems and AI
42:04 Claude Design Design System Limitations
45:32 Building Design Tokens with AI
49:01 Figma Variables and AI
52:26 Design System Components and AI
58:32 Training AI On Our Design System
1:01:34 Design System Claude Skills
1:08:04 Components and Claude Skills
1:13:48 Adding Claude Skills to Codex
1:15:09 AI and Design Research with Mobbin
1:17:24 Building Production UI’s with Claude Code
1:22:43 Building UI’s with Chat GPT
1:24:26 Refining Our AI Design
1:25:13 Pushing to Figma and Final Result
1:27:08 Outro