The reference for AI product design Search Ctrl K Newsletter Join 2K+ AI designers and PMs on Substack. New teardowns, patterns, and prompts as they drop. Prompt pack Build an AI native design system Chained prompts for the audit, tokens, components, docs, and rollout, written so your coding agent can read the system too. Open prompt pack Teardowns The design decisions behind top AI products. See all ChatGPT ChatGPT Intelligent UI: generative interfaces in the thread Output & artifacts · 16 screens Claude Claude artifacts UX: split pane & preview design Output & artifacts · 10 screens Lovable Lovable onboarding UX: setup wizard & segmentation Onboarding · 10 screens Patterns Solved AI UX problems, ready to reuse. See all Why does streaming feel faster? Because you see words right away. Streaming Stop Streaming Keep people oriented while a long response is still forming. How much is 10 ounces of gold? Searchcurrent gold price per ounce $2,045 per ounce Calculator2045 × 10 $20,450 The current gold price is $2,045 per ounce. For 10 ounces, that would cost $20,450. Tool Use Show which tool the model called and what came back, without burying the answer. Sony WH-1000XM5 $348 Best Buy · Visa ···· 4242 Ready to buy Buy now Instant Buy Finish the purchase inside the AI surface. Price, payment, and confirmation stay visible. Essential guides Ship AI features, one step at a time. See all The Eight States Every AI Feature Needs Before Launch 9 min read The Rise of the Design Engineer in the Era of AI 14 min read Skill vs prompt: when to use each 8 min read Inspirations Vibe-coded work to spark your next idea. See all Orbkit zzzzshawn KeyUI sahilcodex Liquid Gooey Jakub Antalik Shortlisted tools See all Sponsored Wispr Flow Dictating long, detailed prompts Sponsored Lottie Creator Tiny loading and thinking animations Motion Motion Spring, gesture, and layout animation in React Figma Tokens Studio Keeping Figma tokens in sync with code Components Fancy Components Playful text and interaction effects Icons Phosphor One icon family in six weights Popular prompts See all Generate a full UX architecture doc Producing a first-draft UX specification for a new product… Audit and test my Claude Code setup Improving an existing Claude Code setup with evidence Behavioral Interview Preparation Preparing for behavioral interviews Design Critique Framework Conducting design critiques, providing structured feedback User Flow Mapping Mapping user flows for features, documenting user journeys Career Development Plan Creating career development plans, setting growth goals Popular skills See all Hallmark Anti-AI-slop UI design for new pages, redesigns, and audits Usability Testing Plan and run usability tests with Lenny-style rigor Grill Me Relentless interviewing skill that stress-tests plans… Make Interfaces Feel Better Jakub Krehel's all-in-one polish skill Customer Journey Map Create end-to-end customer journey maps with stages Interview Prep Generator Generate STAR stories, practice questions Recently published All Teardowns Patterns Guides Prompts Skills Inspirations Teardown Alexa for shopping: conversation, price alert, and auto buy Alexa for shopping teardown: left chat side panel on Amazon. Product cards and Add to cart, price history, price… Sep 14 Pattern Instant Buy Buy inside the AI surface without leaving for checkout May 25 Guide How to Design AI Chat Composer UX A build playbook for AI intent capture: Chat UX patterns plus ChatGPT vs Claude vs Perplexity vs Gemini composer… Jul 14 Prompt Build a scoring rubric for AI output quality Turn “is the AI output good?” into a weighted 1–5 rubric with anchor examples, failure-type mapping, and a calibration… Oct 13 Skill Anatomy Name an idea in one line and Claude invents a real machine that does it: live isometric SVG figures with dozens of… Oct 16 Inspiration Orbkit WebGL shader orbs for agent states: idle, thinking, speaking. Thirty-three looks, installable one at a time through… Sep 7 Teardown Ask YouTube: guides built from video Ask YouTube teardown: full-page guides synthesized from the video catalog with cited clips, compare metadata, and… Sep 1 Pattern Universal Cart One cart when AI shops across merchants May 25 Guide How to Design AI Citations & Sources UX A build playbook for grounded answers: Trust Scaffolding, citation pattern demos, and ChatGPT vs Perplexity teardown… Jul 14 Prompt Design a human-AI conversation flow Step-by-step prompt for an AI feature’s conversation design: dialogue structure, who leads when, modalities, repair… Oct 13 Skill Agentation Adds the Agentation toolbar to a Next.js app so you can click and annotate UI in the browser and send that visual… Oct 13 Inspiration Pablo's World A hand-drawn portfolio you walk around: arrow keys to move through a black-and-white isometric world instead of… Sep 2 Teardown Ask Maps by Google Maps: chat beside the map Ask Maps teardown: chat beside Google Maps that writes place cards, itineraries, and review grounding onto the live map. Aug 26 Pattern Tool Switching in Composer Switch between AI capabilities within composer May 25 Guide How to Design AI Memory & Personalization UX A build playbook for inspectable continuity: memory controls, persona settings, and ChatGPT vs Claude vs Perplexity… Jul 14 Prompt Explain an AI initiative to executives Fill-in-the-blanks prompt that turns an AI topic, feature, or decision into an executive-ready explanation: a 10-second… Oct 13 Skill AI Elements Build AI chat interfaces with Vercel's shadcn-based components: conversations, messages, reasoning, tool calls, and… Oct 13 Inspiration Pane Staggered gradient panels from playgrnd: each row splits on its own so no edge runs the full height, then export PNG,… Sep 2 Teardown Qwen composer: a quiet bar for a multimodal studio First send should feel like chat. Image, video, research, and live voice open when intent shows. Aug 25 Pattern Context Chip Management Adding context sources via menu with removable chips May 25 Frequently asked questions What is AI UX Playground? How is this different from a general UI pattern library? What is the difference between Patterns and Teardowns? What are Guides and the Glossary? How do prompts, prompt packs, and skills differ? Do pattern pages include working demos? Who maintains AI UX Playground and is it free to use?