Apr 7
Loading video player...
This is a full overview of Claude & Claude Code and how designers can actually use it in their workflow. If you’re working in Figma or product/UX, this will give you a clear starting point without the fluff. 🔗 KEY LINKS 📣 JOIN THE COMMUNITY: https://uicollective.co/ ❎ Follow me on X: https://x.com/KirkMDesign Figma Skills: https://www.figma.com/community/skills 📣 Save 20% on the Annual Mobbin plan: http://mobbin.com/uicollective 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/ 🔗 VIDEOS TO WATCH Build a Design System: https://youtu.be/opTANvl9G1g Complex Design System Setup: https://youtu.be/L-tpK7Eeuow AI & Design Systems: https://youtu.be/XfezMs8B-O8 🔗 MORE LINKS Let us build or fix your design system: https://designsystemlabs.co/ kirkland@uicollective.co OTHER LINKS & MORE: Claude Terminal Installation: https://code.claude.com/docs/en/overview#terminal Terminal Figma Plugin installation: /plugin install figma@claude-plugins-official MCP documentation: https://code.claude.com/docs/en/mcp 0:00 An Introduction 0:31 Connecting Figma MCP Inside Claude 1:21 Generating Design + Pushing to Figma 3:14 Where Designers Find Value 4:05 Reviewing Output 5:06 Competitive Research with Mobbin 6:15 Building a Claude Skill for Better AI Designs 8:05 Building Better Designs with Research 9:17 Generating Component Documentation 10:55 Figma Skills Overview 12:51 Installing Figma Skills 16:25 Testing Figma Skills 17:37 Things to Know 19:24 Building a Design with Claude Code 21:33 Auditing a Figma Design 23:00 Anthropic Plugin 23:19 Accessibility Audit 25:41 Outro