How to Design with Claude + Figma | Complete AI-Native Workflow
Learn how to design with Claude AI and Figma—from UX research planning and wireframes to a working prototype.
Follow a complete AI-native product design workflow using Claude Projects, Figma Design Agent, and Figma MCP.
In this step-by-step tutorial for designers, I show you how to use Claude and Figma throughout the UX design process: understanding the problem, planning research, exploring ideas, evaluating design directions, and building an interactive prototype.
We’ll design a Case Study Coach—a product concept that helps designers turn scattered project notes into clear portfolio case studies. You’ll see how I guide AI with project context, research, and design decisions while keeping human judgment at every stage.
🔗Resources:
AI-Native Process: https://drive.google.com/file/d/1ElGGE4CucgjekW1BSzPOb4eVpH2BZcz5/view?usp=drive_link
Prompt Library: https://drive.google.com/file/d/1HpTdlE-TCdIEKIWqgYCIXRMkNg6jUrEh/view?usp=drive_link
WHAT YOU’LL LEARN
• Set up Claude Projects with instructions, a product brief, and relevant context.
• Use Claude to research a problem and distinguish evidence from assumptions.
• Plan user interviews with research questions and an interview guide.
• Turn findings into a design brief and prompts for ideation.
• Generate low-fidelity wireframes with the Figma Design Agent.
• Compare design directions and combine their strongest ideas.
• Use Claude and Figma MCP to build a high-fidelity prototype informed by a Figma design system.
• Prepare a working prototype to share, test, and refine.
This AI design workflow is for product designers, UX/UI designers, and non-coders who want to learn how to design with Claude while strengthening their user-centered design process.
AI-native design means embedding AI into how you research, think, explore, and prototype. Throughout the tutorial, I explain where AI can accelerate the work and where your judgment remains essential.
Which part of your design workflow would you like to try with Claude first? Share your questions in the comments, and subscribe for practical AI tutorials for designers.
#ClaudeAI #AIDesign #Figma
-------------------------------------------------------------------------------
⏱️ Chapters:
0:00 AI-Native Product Design: What You’ll Build
0:42 What AI-Native Design Means
1:34 The Problem: Case Study Coach
2:25 Set Up Claude for Design Work
7:48 Research and Define the Problem with Claude
18:30 Explore Lo-Fi Wireframes with Figma’s Design Agent
23:32 Create the Hi-Fi Design with Claude and Figma
25:34 Walk Through the Case Study Coach Prototype
29:13 Publish the Prototype
29:39 Recap and Next Steps
-------------------------------------------------------------------------------
🎥 Watch Next ⬇️
🎨 **Figma Design Agent Complete Course**
https://youtube.com/playlist?list=PLXdRMPwB8CHm6XJwPZMZwUfDTUipxGMPK&si=pbp2rXVshkssQ6Et
🤖 **Claude AI + Figma MCP for Designer: The New AI-Design Workflow**
https://www.youtube.com/playlist?list=PLXdRMPwB8CHnCai2ohL6e9HA4mcq-ZEn0
-------------------------------------------------------------------------------
👩🏻💻 I'm Nehmat — Design Leader, Professor, and your guide for navigating the AI era. With 13+ years leading product design teams and teaching the next generation of designers, I strive to make high-quality Design Education freely accessible to all.
📌 Mission: This channel helps Designers adapt, evolve, and lead by mastering AI-powered Design workflows. I only create videos about tools I use and believe in — No Sponsored Content.
💕 Subscribe to get the latest releases & changes in our industry
🔔 Turn on ALL notifications so you don't miss the latest releases and tutorials
👉 Join my community for First Access, direct guidance & live consultation on your work
🔥 Hype a video to help it reach the designers searching for this content
💬 Leave me comments with ideas or questions, I always read and reply to them
➡️ Follow me on LinkedIn: https://linkedin.com/in/nehmatgereige
❎ Follow me onX: https://x.com/33Nehmat
-------------------------------------------------------------------------------
Follow a complete AI-native product design workflow using Claude Projects, Figma Design Agent, and Figma MCP.
In this step-by-step tutorial for designers, I show you how to use Claude and Figma throughout the UX design process: understanding the problem, planning research, exploring ideas, evaluating design directions, and building an interactive prototype.
We’ll design a Case Study Coach—a product concept that helps designers turn scattered project notes into clear portfolio case studies. You’ll see how I guide AI with project context, research, and design decisions while keeping human judgment at every stage.
🔗Resources:
AI-Native Process: https://drive.google.com/file/d/1ElGGE4CucgjekW1BSzPOb4eVpH2BZcz5/view?usp=drive_link
Prompt Library: https://drive.google.com/file/d/1HpTdlE-TCdIEKIWqgYCIXRMkNg6jUrEh/view?usp=drive_link
WHAT YOU’LL LEARN
• Set up Claude Projects with instructions, a product brief, and relevant context.
• Use Claude to research a problem and distinguish evidence from assumptions.
• Plan user interviews with research questions and an interview guide.
• Turn findings into a design brief and prompts for ideation.
• Generate low-fidelity wireframes with the Figma Design Agent.
• Compare design directions and combine their strongest ideas.
• Use Claude and Figma MCP to build a high-fidelity prototype informed by a Figma design system.
• Prepare a working prototype to share, test, and refine.
This AI design workflow is for product designers, UX/UI designers, and non-coders who want to learn how to design with Claude while strengthening their user-centered design process.
AI-native design means embedding AI into how you research, think, explore, and prototype. Throughout the tutorial, I explain where AI can accelerate the work and where your judgment remains essential.
Which part of your design workflow would you like to try with Claude first? Share your questions in the comments, and subscribe for practical AI tutorials for designers.
#ClaudeAI #AIDesign #Figma
-------------------------------------------------------------------------------
⏱️ Chapters:
0:00 AI-Native Product Design: What You’ll Build
0:42 What AI-Native Design Means
1:34 The Problem: Case Study Coach
2:25 Set Up Claude for Design Work
7:48 Research and Define the Problem with Claude
18:30 Explore Lo-Fi Wireframes with Figma’s Design Agent
23:32 Create the Hi-Fi Design with Claude and Figma
25:34 Walk Through the Case Study Coach Prototype
29:13 Publish the Prototype
29:39 Recap and Next Steps
-------------------------------------------------------------------------------
🎥 Watch Next ⬇️
🎨 **Figma Design Agent Complete Course**
https://youtube.com/playlist?list=PLXdRMPwB8CHm6XJwPZMZwUfDTUipxGMPK&si=pbp2rXVshkssQ6Et
🤖 **Claude AI + Figma MCP for Designer: The New AI-Design Workflow**
https://www.youtube.com/playlist?list=PLXdRMPwB8CHnCai2ohL6e9HA4mcq-ZEn0
-------------------------------------------------------------------------------
👩🏻💻 I'm Nehmat — Design Leader, Professor, and your guide for navigating the AI era. With 13+ years leading product design teams and teaching the next generation of designers, I strive to make high-quality Design Education freely accessible to all.
📌 Mission: This channel helps Designers adapt, evolve, and lead by mastering AI-powered Design workflows. I only create videos about tools I use and believe in — No Sponsored Content.
💕 Subscribe to get the latest releases & changes in our industry
🔔 Turn on ALL notifications so you don't miss the latest releases and tutorials
👉 Join my community for First Access, direct guidance & live consultation on your work
🔥 Hype a video to help it reach the designers searching for this content
💬 Leave me comments with ideas or questions, I always read and reply to them
➡️ Follow me on LinkedIn: https://linkedin.com/in/nehmatgereige
❎ Follow me onX: https://x.com/33Nehmat
-------------------------------------------------------------------------------