Design Intelligence for AI Agents

CContextual
RResponsive
IIntelligent
SSeamless
PPowerful

Your AI agent can generate code. It can't evaluate design.

Every era has had a framework for whether something is well designed. This is ours.

Get CRISP → See the framework
SCROLL
✓ CRISP loaded — /crisp-audit ready ·
Design intelligence for every AI harness ·
Grade: B+  — up from C last audit ·
Works with Claude Code · Cursor · Antigravity · VS Code · Gemini CLI ·
5 dimensions · 5 commands · one clear standard ·
✓ .crisp.md written to project root ·
✓ CRISP loaded — /crisp-audit ready ·
Design intelligence for every AI harness ·
Grade: B+  — up from C last audit ·
Works with Claude Code · Cursor · Antigravity · VS Code · Gemini CLI ·
5 dimensions · 5 commands · one clear standard ·
✓ .crisp.md written to project root ·

The Lineage

Every era has had a framework for evaluating
whether a designed thing is actually good.

CRISP didn't appear from nowhere. It is the latest in a 3,000-year tradition of named, structured systems for asking the same question: does this designed thing actually serve the person it was made for?

Craftsman's hands applying gold leaf — representing Bezalel's sacred craft
1446 BC

Bezalel

Chokmah · Tevunah · Da'at

"I have filled him with wisdom, with understanding, and with knowledge, and with all kinds of skill." — Exodus 31:3

CRISP parallel Intelligent · Contextual · Powerful

Ancient architectural drawings on vellum with bronze compass — Vitruvius's proportioned blueprint
25 BC

Vitruvius

Firmitas · Utilitas · Venustas

"Well building hath three conditions: firmness, commodity, and delight." — De Architectura

CRISP parallel Powerful · Seamless · Responsive

Close-up of a 1970s Braun radio dial — Dieter Rams's functional silence
1976

Dieter Rams

Ten Principles of Good Design

"Good design is as little design as possible. Less, but better." — Dieter Rams

CRISP parallel Powerful · Seamless · Contextual

Mechanical keyboard lit by green phosphor glow — CRISP for the age of AI
2026

CRISP

C · R · I · S · P

"Your AI agent can generate code. It can't evaluate design."

CRISP parallel Contextual · Responsive · Intelligent · Seamless · Powerful

Four objects connected by a gold thread — representing 3,472 years of design thinking

— Bezalel · Vitruvius · Rams · CRISP —

3,472 years of the same question.

01 — Lineage complete. What changes when your agent understands design →

01 — Before & After

What changes when
your agent understands design

AI agents produce technically functional interfaces. CRISP evaluates whether they're actually good — and why they aren't.

WITHOUT CRISP
  • ✗CEmpty state says "No data available" — user doesn't know why or what to do
  • ✗RSpinner appears on every filter change — user waits while nothing seems to happen
  • ✗IRaw metric: "1,247" — no context, no comparison, no suggested action
  • ✗S"Open in portal" — forces a redirect and new login for a simple approval
  • ✗PAll 23 settings visible to every user at all times — cognitive overload
WITH CRISP
  • ✓C"Your Q3 pipeline looks healthy — 12 deals active. Add your first deal to get started."
  • ✓ROptimistic update — result appears instantly, background sync happens silently
  • ✓I"1,247 leads — up 23% this month. 3 deals need your attention before Friday."
  • ✓SInline approval card — one click, no redirect, no re-authentication required
  • ✓P3 most-used actions surfaced. Everything else collapsed behind "Advanced settings"
/crisp-audit dashboard.tsx Grade: B+
C
82Contextual
R
64Responsive ⚠
I
91Intelligent
S
71Seamless
P
88Powerful
BENCHMARKED AGAINST
StripeTrustworthy, progressive disclosure
LinearMinimal, fast, keyboard-native
NotionFlexible, powerful, great onboarding
AsanaTask-focused, clear status
SlackHierarchy, efficient workflows
BENCHMARKED AGAINST
StripeTrustworthy, progressive disclosure
LinearMinimal, fast, keyboard-native
NotionFlexible, powerful, great onboarding
AsanaTask-focused, clear status
SlackHierarchy, efficient workflows

02 — The Framework

Five dimensions.
One clear standard.

CRISP gives your AI agent a shared design language. Each dimension maps to a specific failure pattern and a specific fix.

C
Contextual
Can the user tell where they are and what this page does within 5 seconds?
FAILS WHEN
Dead-end empty states · missing breadcrumbs · unclear orientation · generic headings
R
Responsive
Does the UI update immediately on every interaction?
FAILS WHEN
Spinners on every action · click-wait-update patterns · no hover feedback · delayed confirms
I
Intelligent
Are we showing insights, not just raw data?
FAILS WHEN
Numbers without meaning · blank forms · no next-best-action · we know the user but pretend we don't
S
Seamless
Are we fitting into their day — not forcing them into ours?
FAILS WHEN
Unnecessary logins · portal redirects · custom components that break habits · friction on routine tasks
P
Powerful
Is complexity hidden appropriately for each user type?
FAILS WHEN
Expert settings shown to novices · no keyboard shortcuts · no undo · all options always visible

03 — Commands

Five commands.
The full design loop.

From onboarding to evaluation to developer handoff — CRISP covers every design decision point in a single skill pack.

/crisp-teach
One-time project onboarding. Learns your product, users, and design system. Writes .crisp.md — your context file that every other command reads automatically.
Claude Code — /crisp-teach
CRISP: Who are the primary users of this product?
Enterprise SaaS product managers, 50-500 person companies...
CRISP: What design system or UI library do you use?
Tailwind CSS + shadcn/ui, custom tokens...
CRISP: What does "great design" look like for this product?
Fast, no-surprise interactions. Think Linear or Stripe...
PRODUCES
.crisp.md context file
User personas + jobs-to-be-done
Design system reference
Benchmark + anti-reference set
/crisp-audit
Full CRISP evaluation. Scores all five dimensions with P0–P3 severity ratings, benchmarks against Stripe and Linear, and produces a prioritised action plan.
Claude Code — /crisp-audit
/crisp-audit settings.tsxGrade: B+
C
82Contextual
R
64Responsive ⚠
I
91Intelligent
S
71Seamless
P
88Powerful
PRODUCES
Grade A–F with justification
5-dimension CRISP scorecard
P0–P3 severity violations
Prioritised fix list
/crisp-review
30-second scan for rapid design iteration. Returns a letter grade and the top 3 issues by user impact — with specific fix suggestions, not vague feedback.
Claude Code — /crisp-review
B+
"Solid foundations. Three quick wins available before this ships."
P1Empty state needs a clear action CTA — users are strandedFix →
P1Filter spinner blocks UI — switch to skeleton or optimistic updateFix →
P218 settings visible — only 4 are P0. Collapse with "Advanced settings"Fix →
PRODUCES
Grade A–F + one-line verdict
Top 3 issues ranked by impact
Specific fix per issue
Quick wins list
/feature-design
Design a new feature from scratch using CRISP principles. Takes a problem statement and produces user flows, component decisions, and rationale benchmarked against world-class products.
Claude Code — /feature-design
User triggers approval flow
↓
Can approve inline? Check context
↓
Yes → Inline card
✓ Seamless
No → Contextual redirect
⚠ Avoid if possible
↓
Optimistic confirm → sync silently
PRODUCES
User flow with decision rationale
CRISP compliance check per step
Component recommendations
Research questions to validate
/handoff
Convert any CRISP-approved design into a developer-ready specification. Covers implementation notes, component states, edge cases, token references, and accessibility requirements.
Claude Code — /handoff
EmptyState
spacing: space-8color: text-mutedicon: size-12
ApprovalCard
variant: inlinez-index: overlay
States: default · loading · success · error · disabled
A11y: role="dialog", aria-live="polite"
PRODUCES
Component state inventory
Token + spacing references
Edge cases + error states
Accessibility checklist
/crisp-teach
One-time project onboarding. Learns your product, users, and design system. Writes .crisp.md — your context file that every other command reads automatically.
→ .crisp.md context file
→ User personas + jobs-to-be-done
→ Design system reference
→ Benchmark + anti-reference set
/crisp-audit
Full CRISP evaluation. Scores all five dimensions with P0–P3 severity ratings, benchmarks against Stripe and Linear, and produces a prioritised action plan.
→ Grade A–F with justification
→ 5-dimension CRISP scorecard
→ P0–P3 severity violations
→ Prioritised fix list
/crisp-review
30-second scan for rapid design iteration. Returns a letter grade and the top 3 issues by user impact — with specific fix suggestions, not vague feedback.
→ Grade A–F + one-line verdict
→ Top 3 issues ranked by impact
→ Specific fix per issue
/feature-design
Design a new feature from scratch using CRISP principles. Takes a problem statement and produces user flows, component decisions, and rationale.
→ User flow with decision rationale
→ CRISP compliance check per step
→ Component recommendations
/handoff
Convert any CRISP-approved design into a developer-ready specification covering states, tokens, edge cases, and accessibility requirements.
→ Component state inventory
→ Token + spacing references
→ Accessibility checklist

04 — In Action

Watch a C+ become a B+

CRISP doesn't just flag problems — it shows you exactly what to fix and verifies the improvement.

STEP 01Before CRISP
Analytics Dashboard
1,247 Leads [I] Raw number, no context
42% Conv. Rate [I] Good or bad? Unknown
$84k Revenue [I] No trend indicator
No data available [C] Dead-end empty state
STEP 02Running /crisp-audit
$ /crisp-audit analytics.tsx
Evaluating 5 CRISP dimensions...
✗ C: Empty state has no context or action
✗ I: Metrics shown without comparison
✗ R: Filter triggers full spinner
P0 violations: 2   P1 violations: 1
Grade: C+ (3 fixes to reach B+)
STEP 03After applying fixes
Analytics Dashboard
1,247 Leads ↑ 23% this month [I] ✓ Context added
42% Conv. Rate ↑ above 38% avg [I] ✓ Benchmark shown
$84k Revenue 3 deals need action [I] ✓ Next action clear
Your Q3 pipeline looks healthy — 12 deals active.
Add your first deal to get started → [C] ✓ Action + context
STEP 04Score improved
C+ → B+
3 fixes applied in 12 minutes
C
82↑ from 55
R
76↑ from 64
I
91↑ from 48
S
71stable
P
88stable

05 — Get Started

Up and running
in two steps.

One install command. One onboarding session. Then every design decision in your project is grounded in CRISP.

STEP 01
Install the skills
One command installs all five CRISP skills and auto-detects your AI harness.
zsh — crisp-install
$
# Auto-detects Cursor, Claude Code, Antigravity, VS Code, Gemini CLI
✓ Claude Code detected
✓ Installing 5 CRISP skills...
✓ Done. Run /crisp-teach to get started.
↳ About .crisp.md
Run /crisp-teach once per project. It learns your users, design system, and references — then writes .crisp.md. Every subsequent CRISP command reads from it automatically. Your context is never lost between sessions.
STEP 02
Run /crisp-teach
Teach CRISP about your product once. It does the rest.
Claude Code
YOU
/crisp-teach
CRISP
Let's set up your project context. What's the primary job of this product — what does a user accomplish in a typical session?
CRISP
SUPPORTED TOOLS
Claude Code
Cursor
Antigravity
VS Code Copilot
Gemini CLI
Codex CLI

06 — FAQ

Common questions

Impeccable improves how your AI generates frontend code — typography choices, layout patterns, visual polish. CRISP evaluates whether the design is actually good — whether a user knows where they are, whether the interface feels instant, whether it surfaces insight instead of data. Different layer entirely. They're complementary, not competing.
No. Run it once per project. It writes .crisp.md to your project root — every CRISP command reads from it automatically in subsequent sessions. Your context is preserved across updates too; .crisp.md is never overwritten when you update the skills pack.
Product designers, design leads, and engineers who use AI agents to design and ship software. If you've ever received a "functional but flat" design output from an AI — technically correct, but experientially hollow — CRISP is the missing evaluation layer.
Contextual, Responsive, Intelligent, Seamless, Powerful. Five dimensions of world-class product design, each with a specific test question and a specific set of failure patterns. The framework is benchmarked against Stripe, Linear, Notion, Asana, and Slack.
Yes. /crisp-audit and /crisp-review work on any design screenshot or description, without project context. /crisp-teach just makes them significantly more accurate — the agent knows your users, your design system, and what "good" looks like specifically for your product.
npx skills add @laith-wallace/crisp auto-detects your AI harness and places files in the correct directory: .claude/ for Claude Code, .cursor/ for Cursor, .agents/skills/ for Antigravity, and so on. If you prefer, download the universal ZIP and extract to your project root manually.

Ready to give your AI agent
design intelligence?

One install. Five commands. Every design decision in your project grounded in a world-class standard.

Get CRISP → View on GitHub