# AI UX Playground

> Practical reference for designing AI products: patterns, frameworks, gallery case studies, prompts, workflows, skills, and blog essays.

Canonical site: https://aiuxplayground.com
Sitemap: https://aiuxplayground.com/sitemap.xml

## Primary sections

- Patterns (catalog + interactive examples): https://aiuxplayground.com/patterns
- Frameworks (agentic UX, chat UX, trust): https://aiuxplayground.com/frameworks
- Case studies (product screenshots): https://aiuxplayground.com/gallery
- Teardowns (job-first product UX case studies): https://aiuxplayground.com/teardowns
- Composer UX comparison (ChatGPT vs Claude vs Perplexity vs Gemini): https://aiuxplayground.com/teardowns/compare/design-the-composer
- Output & artifacts UX comparison: https://aiuxplayground.com/teardowns/compare/output-artifacts-refinement
- Onboarding & first-value UX comparison: https://aiuxplayground.com/teardowns/compare/ai-onboarding-first-value
- Human-in-the-loop UX comparison: https://aiuxplayground.com/teardowns/compare/human-in-the-loop
- Citations & sources UX comparison (ChatGPT vs Perplexity): https://aiuxplayground.com/teardowns/compare/trust-privacy-settings
- Personalization & memory UX comparison (ChatGPT vs Claude vs Perplexity): https://aiuxplayground.com/teardowns/compare/personalization-memory
- Model & mode selection UX comparison: https://aiuxplayground.com/teardowns/compare/model-mode-selection
- Pricing & upgrade UX comparison: https://aiuxplayground.com/teardowns/compare/pricing-upgrade
- Prompts: https://aiuxplayground.com/prompts
- AI prompts for designers: https://aiuxplayground.com/prompts/for-designers
- AI prompts for product managers: https://aiuxplayground.com/prompts/for-pms
- AI prompts for user researchers: https://aiuxplayground.com/prompts/for-researchers
- AI prompts for marketers: https://aiuxplayground.com/prompts/for-marketers
- AI prompts for startup founders: https://aiuxplayground.com/prompts/for-founders
- Workflows (multi-step prompt chains): https://aiuxplayground.com/workflows
- Skills (SKILL.md for agents): https://aiuxplayground.com/skills
- Agent skills for startup founders: https://aiuxplayground.com/skills/for-founders
- Agent skills for designers: https://aiuxplayground.com/skills/for-designers
- Agent skills for copywriters: https://aiuxplayground.com/skills/for-copywriters
- Agent skills for product managers: https://aiuxplayground.com/skills/for-pms
- Agent skills for marketers: https://aiuxplayground.com/skills/for-marketers
- Agent skills for engineers: https://aiuxplayground.com/skills/for-engineers
- Playground (60+ AI UX references for vibe coding): https://aiuxplayground.com/playground
- Playground shaders & WebGPU: https://aiuxplayground.com/playground/shaders
- Playground motion & interaction: https://aiuxplayground.com/playground/motion
- Playground tools: https://aiuxplayground.com/playground/tools
- Playground components & kits: https://aiuxplayground.com/playground/components
- Playground Framer: https://aiuxplayground.com/playground/framer
- Playground portfolios & craft: https://aiuxplayground.com/playground/portfolios
- Playground FAQ (what it is, how to use, submit): https://aiuxplayground.com/playground#faq
- Example: Thinking orbs (AI loading indicators): https://aiuxplayground.com/playground/thinking-orbs
- Example: Bible Strong Avatar Lab (procedural 2D avatars): https://aiuxplayground.com/playground/bible-strong-avatar-lab
- Example: vgpu (WebGPU library for agents): https://aiuxplayground.com/playground/vgpu
- Example: Liquid Orb Editor (WebGPU glass orb): https://aiuxplayground.com/playground/liquid-orb-editor
- Blog: https://aiuxplayground.com/blog
- What is human-in-the-loop UX (2026 guide): https://aiuxplayground.com/guides/how-to-design-human-in-the-loop
- How to design AI citations & sources UX: https://aiuxplayground.com/guides/how-to-design-ai-citations
- How to design AI chat composer UX: https://aiuxplayground.com/guides/how-to-design-ai-chat-composer
- How to design AI output, artifacts & refinement UX: https://aiuxplayground.com/guides/how-to-design-ai-output-artifacts
- How to design AI memory & personalization UX: https://aiuxplayground.com/guides/how-to-design-ai-memory-personalization
- How to design AI onboarding & first-value UX: https://aiuxplayground.com/guides/how-to-design-ai-onboarding
- AI for designers hub: https://aiuxplayground.com/ai-for-designers
- How to design an AI feature: https://aiuxplayground.com/guides/how-to-design-an-ai-feature
- ChatGPT vs Claude UX comparison: https://aiuxplayground.com/compare/chatgpt-vs-claude-ux
- AI trust design hub: https://aiuxplayground.com/ai-trust-design
- Generative UI patterns hub: https://aiuxplayground.com/generative-ui-patterns
- AI failure states UX hub: https://aiuxplayground.com/ai-failure-states
- Human-in-the-loop AI design hub: https://aiuxplayground.com/human-in-the-loop-ai
- About: https://aiuxplayground.com/about
- FAQ index: https://aiuxplayground.com/faq
- Access (free, no account): https://aiuxplayground.com/access.md

## Audience

Product designers, UX researchers, PMs, design engineers, and founders shipping chat, agents, copilots, and multimodal AI.

## Access

Free to browse. No account required. See https://aiuxplayground.com/access.md

## Contact

- Newsletter: https://aiuxplayground.substack.com
- LinkedIn: https://www.linkedin.com/company/aiuxplayground/

## Notes for crawlers

- Home, /patterns, /frameworks, /skills, /prompts, /teardowns, /guides, and /playground include a visible FAQ section (`#faq`) with FAQPage JSON-LD aligned to on-page Q&A.
- /playground is a CollectionPage with ItemList JSON-LD; each /playground/{id} page has CreativeWork schema and an At a glance block.
- Playground lanes (/playground/shaders, /playground/motion, etc.) are CollectionPage routes with filtered ItemList JSON-LD and lane-specific FAQ sections (`#faq`) with FAQPage JSON-LD.
- Playground detail breadcrumbs include the parent lane (Home → Playground → Lane → Project).
- Teardown job comparisons live at /teardowns/compare/{jobSlug} (composer, output, onboarding, human-in-the-loop, citations, personalization, model selection, pricing); product teardowns remain at /teardowns/{product}/{guide}.
- Product teardown guides and glossary terms include visible FAQs with matching FAQPage JSON-LD; glossary terms also emit DefinedTerm schema.
- Workflow/playbook pages emit HowTo JSON-LD from their step lists.
- Binder how-to guides (`/guides/how-to-design-*`) include a visible FAQ (`#faq`) with FAQPage JSON-LD and HowTo JSON-LD from their ship-next steps.
- Pattern detail pages include live UI demos inline; there is no separate /demos section.
- Topic hub URLs redirect to /frameworks.
- /design-md and /search?* are noindex.
- Bingbot and msnbot are allowed; IndexNow ownership key is published at site root for faster Bing/ChatGPT discovery after content updates.