A structured, repeatable system for designing and prototyping AI-enabled product experiences. Built for product designers, UX designers, and design technologists working in vibe coding workflows.
This framework gives teams a shared behavioral model for AI-assisted product design. Instead of starting with screens or ad hoc prompts, teams define the logic first — what signals are available, how confident the system can be, and what AI behavior is appropriate — then express that logic in UI.
It is designed to be used alongside AI coding tools (Claude, Cursor, Copilot, etc.) to produce consistent, reviewable prototype outputs across multiple designers and projects.
Without a shared model, two designers using the same AI tool can produce completely different results — not because of skill differences, but because there are no common rules connecting signals to behavior to interface expression.
This framework makes the decision chain explicit and shared:
Signals → Intent → Confidence → Condition Logic → AI Level → Pattern → UI
- Product designers and UX designers building AI-enabled product concepts
- Design technologists prototyping adaptive experiences in vibe coding environments
- Product teams who want to explore AI behavior systematically rather than screen by screen
/ai-experience-framework
README.md ← You are here
CLAUDE.md ← AI tool entry point and load order
ONBOARDING.md ← Team onboarding guide
/core ← Shared framework logic. Do not edit per-project.
00-framework-overview.md ← Mental model and system overview
01-principles.md ← Non-negotiable rules and the Level 0 gate
02-pattern-library.md ← 12 reusable AI interaction patterns
03-design-system-rules.md ← Generic component vocabulary and DS setup guide
04-prompting-guidelines.md ← How AI tools should interpret and respond
05-components.md ← Component behavior, states, and code annotation spec
/projects
_template/ ← Copy this to start a new project (files 10–19)
Start with /core/00-framework-overview.md to understand the mental model, then 01-principles.md for the rules that govern all projects.
Open /core/03-design-system-rules.md and complete the setup section — map the framework's generic component vocabulary to your team's actual design system components. This step takes 30–60 minutes and makes every subsequent session significantly more consistent.
cp -r projects/_template projects/your-project-nameComplete files 10 through 15 before touching 16 through 19. Behavioral logic before UI expression — always.
| File | What it defines |
|---|---|
10-project-context.md |
Product, users, scope, constraints |
11-user-jobs-and-intents.md |
Jobs to be done, intent states |
12-signals.md |
Explicit and implicit signals, strength ratings |
13-confidence-model.md |
How confidence is defined for this product |
14-decision-model.md |
Behavior rules: given this signal state, what should the system do? |
15-control-model.md |
Confirm, edit, dismiss, undo, transparency rules |
Complete 16-pattern-selection.md, 17-ui-composition.md, and 18-prototype-scenarios.md.
19-output-request.md tells the AI tool how to structure its responses for this project. This is what makes outputs consistent across designers.
Load the AI Experience Framework for [project name].
Core files: /ai-experience-framework/core/
Project files: /ai-experience-framework/projects/[project-name]/
Begin with the output request format defined in 19-output-request.md.
| Condition | What it means | Confidence | Starting level |
|---|---|---|---|
| A | Explicit action or accumulated implicit signal | High | 2 or 3 |
| B | Context of focus known, specific intent unknown | Medium | 2 |
| C | Ambiguous signal or low implicit data | Low | 1–2 |
| D | Inaction, error state, or passive signal only | Low | 1 |
| Level | Name | Description |
|---|---|---|
| 0 | Route or withhold | AI routes to existing destination or withholds action. The Level 0 gate. |
| 1 | Nudge | Ambient prompt entry points, suggestion chips, non-intrusive cards |
| 2 | Conversational panel | AI panel alongside existing page UI |
| 3 | Conversational canvas | Conversation thread + generative output surface |
Before generating any AI pattern, evaluate whether the task involves legal consent, audit trail requirements, security verification, or intentional friction. If any apply — route to an existing destination rather than generating AI UI. See 01-principles.md for the full checklist.
/core/03-design-system-rules.md defines a generic component vocabulary that maps to the framework's levels and patterns. Before using the framework on a project, complete the mapping table in that file to connect the generic names to your actual design system components.
/core/05-components.md defines the behavior spec, interaction states, visual rules, and code annotation guidance for each component. Two components (AssistantPanel and RecommendationCard) are fully worked as reference examples. All others follow the same structure with commentary guiding your team to fill in design-system-specific values.
Contributions welcome:
- New patterns for
02-pattern-library.md - Additional worked example projects in
/projects/ - Design system adapters (Figma component mapping, token reference sheets, etc.)
- Improvements to the template files or component specs
Please open an issue before submitting a large change so the approach can be discussed first.
This work is licensed under a Creative Commons Attribution 4.0 International License by Bradly Zavakos.