The Shape of AI
Emily Campbell's pattern library for AI interfaces: prompting, tuning, trust and governance, each with live product examples.
Resources & Tools for AI Product Designers
Patterns, tools and learning for designers building AI products, and for designers using AI in their own process. Study how AI interfaces handle prompting, trust and errors, then prototype with the same tools your engineers use.
AI UX Patterns
Pattern libraries and guidance for prompting, feedback, trust and agent experiences, plus real AI product screens.
Pattern Libraries
aiverse
Playbook for AI-native products: 300+ AI UX interaction examples, design patterns and case studies, added weekly.
Carbon Design System
IBM's open-source system with deep usage guidance, data viz and Carbon for AI patterns for chat and agent experiences.
Product References
Refero
Searchable reference library of real web and iOS product screens and flows, updated weekly. Has a Figma plugin and MCP.
Nicelydone
200k+ screens, flows and in-context components from 500+ SaaS apps. Search by on-screen text and export to Figma.
SaaSFrame
SaaS UI and website examples by page type (dashboards, billing, tables, AI pages). Pro adds Figma file downloads.
Prototype with AI
Generate layouts to explore, then build working prototypes that use real data and real model responses.
Prompt-to-Code
Figma Make
Figma's prompt-to-app tool. Turns prompts or existing frames into working React prototypes without leaving Figma.
v0
Vercel's AI builder for React and Tailwind UIs and full-stack apps, with a visual Design Mode for fine-tuning.
Lovable
Chat-based full-stack app builder. Use it to ship clickable, data-backed prototypes and MVPs in hours.
Magic Patterns
AI prototyping that works from your design system and components, producing shareable flows and React code.
UI Generation
Google Stitch
Google's AI design canvas (formerly Galileo AI). Prompt multi-screen UI flows, then export to Figma or HTML/Tailwind.
UX Pilot
Generates wireframes and hi-fi screens from prompts, with a Figma plugin to edit and export results.
Visily
AI wireframing from text or screenshots, plus diagrams and prototypes. Handy for fast alignment with PMs and founders.
Relume
Turns a brief into a sitemap and wireframes from its component library, exporting to Figma, Webflow or React.
AI for Visuals
Image, vector and color tools for exploration, art direction and production assets.
Imagery and Vectors
Midjourney
Leading image model for art direction, moodboards and hero visuals. V8 added faster, native 2K output.
Krea
Real-time AI image and video suite with many models, editing and a high-res enhancer in one canvas.
Figma Weave
Formerly Weavy: a node-based canvas that chains image and video models with pro editing into reusable workflows.
Magnific
Creative AI upscaler that adds detail to renders and images; now also the name of Freepik's full AI suite.
Recraft
AI image model that outputs editable SVG vectors. Great for on-brand icons, logos and illustration sets.
Color
Khroma
An AI color tool that learns your taste from 50 colors you pick, then generates endless combinations.
Huemint
A machine-learning palette generator that previews colors on real-world mockups to help you decide.
Realtime Colors
Preview a palette and font pairing on a live website layout, check contrast, then export to CSS, Tailwind or Figma.
Research and Copy
Speed up synthesis, test attention before launch and keep product copy consistent.
Research and Copy Tools
Dovetail
Research repository that auto-tags transcripts, clusters themes and answers questions with cited customer quotes.
Attention Insight
Predictive attention heatmaps for designs before launch. Check whether CTAs and key content actually get seen.
Ditto
Product copy management with AI drafting and style-guide checks, plus an MCP server for AI coding tools.
Learn and Follow
Courses, podcasts and publications tracking how AI is changing product design.
Courses
Design Patterns for AI Interfaces
Vitaly Friedman's 10-hour course on UX patterns for AI products, with checklists and optional live training.
Memorisely
Live, hands-on bootcamps in UI, UX research, design systems and AI design engineering, taught inside real tools.
Interaction Design Foundation (IxDF)
One membership for 40 self-paced UX, UI and AI courses plus master classes and certificates. Strong for team training.
Listen and Read
Dive Club
Ridd's weekly interviews with top product designers on craft, AI workflows and design engineering.
Design Better Podcast
Weekly podcast since 2017 with design leaders on creativity, teams and building with AI.
Figma Blog
Product launches, Config news and essays on craft and AI. Follow it to keep up with Figma's tooling.
Fast Company Co.Design
Fast Company's design desk covering product, brand and the business of design, including AI.
Other toolkits
Weekly newsletter · Every Tuesday
New references, every Tuesday.
The newest additions to the library, three LDS picks worth revisiting and a category spotlight, in one short email.
Browse past issues