Write a Design Brief Before Discovery Runs Off the Rails
Someone says 'redesign the checkout' with no scope or success criteria. Paste what you know into Claude and get a brief the team can align on.
Capture meetings without lifting a finger
Granola uses AI to transcribe and summarize your meetings automatically. Pair it with Claude Code via MCP to turn meeting notes into action items, tickets, and code.
Try Granola freehow it works
01 / 06
Someone says 'redesign the checkout.' Full stop.
No constraints, no user context, no definition of done. Just a vague ask with implied urgency.
02 / 06
You paste what you know into Claude.
The Slack message, the exec ask, the feedback from the last user test, whatever context you have. Raw is fine.
03 / 06
Claude asks about users, constraints, and what success looks like.
Three questions that surface the decisions you need to make before you start sketching.
04 / 06
Claude writes a structured design brief.
Problem context, user group, design goals, constraints, out of scope, and open questions. One document that captures the real ask.
05 / 06
You refine until it captures the real ask.
Push back on anything that's wrong. Add the constraint you forgot. Remove the assumption Claude made.
06 / 06
You go into discovery with shared framing.
Designer, PM, and engineering are looking at the same brief. No competing interpretations of what 'redesign the checkout' means.
The prompt
Paste this into Claude.ai with whatever context you have. A Slack message, a complaint from a user test, a note from a stakeholder meeting. It doesn't need to be polished.
Click a violet field and type your own details, then copy.
What you get back
Before I write the brief, three questions:
- Who's the primary user for checkout? Your context mentions "users struggling with payment" but also "high drop-off from mobile." Are we prioritizing mobile users specifically, or is this for all channels?
- What does "redesign" mean here — the full flow or a specific step? Checkout has 4+ steps: cart, address, payment, confirmation. Or is this a full-flow rethink?
- Is there a deadline tied to a business event? Black Friday, a partnership launch, or a product milestone would change how much we can scope.
Assuming: all channels with mobile as primary constraint, full flow but address step has most drop-off, no hard deadline but Q3 is the target.
Problem context
Checkout drop-off is 63%, above the 45% industry benchmark. Exit data shows the highest abandonment on the address step (41% of total drop-off) and at payment entry (29%). Mobile users account for 58% of traffic but only 34% of completions. The gap between mobile traffic and conversion is the clearest signal.
Users we're designing for
Primary: Mobile users completing a purchase for the first time. Secondary: returning users on any device.
Key behaviors from last research round: users don't trust forms that feel like they were designed for desktop, and they abandon when required fields aren't obvious.
Design goals
- Reduce time to complete checkout on mobile by at least 30%
- Increase address step completion rate from 59% to 75%
- Reduce payment step abandonment from 29% to under 15%
- Users should be able to complete checkout in under 2 minutes on a phone with one thumb
Constraints
- Existing payment provider (Stripe) stays. No new integrations in this scope.
- Accessibility: WCAG 2.1 AA minimum
- Brand system applies. No new custom components without design system sign-off.
- Engineering: 6-week build window maximum
Out of scope
- Guest checkout vs. account creation flow (separate project)
- International address formats (phase 2)
- Buy-now-pay-later integration (flagged but not this cycle)
Open questions
- Do we have session recording of where exactly users pause or go back on mobile?
- Is autofill working on address fields? 40% of mobile abandonment on address could be a technical issue, not a UX one.
- What's the legal requirement for the confirmation email? It affects how much we can simplify the confirmation step.
Variations
Same shape, different starting points.
Click a violet field and type your own details, then copy.
Click a violet field and type your own details, then copy.
Click a violet field and type your own details, then copy.
Tips and gotchas
Open questions are more valuable than premature answers. A design brief that says "we need to learn X before we can design confidently" is more useful than one that guesses. Claude will sometimes fill gaps with assumptions: check each one and replace with an open question if it's not actually decided.
Constraints are not the enemy. A brief with no constraints leads to a discovery phase that never ends. Constraints force creative decisions. If you don't have real constraints, list the most likely ones and ask Claude to flag which ones need confirmation.
Watch for solutions disguised as requirements. "The checkout button should be green" is a solution. "Users should see a clear primary action" is a requirement. If the brief is full of the former, ask Claude: "which of these requirements are actually pre-decided solutions? Rewrite them as outcomes instead."
Ready to try?
Click a violet field and type your own details, then copy.
Need somewhere to deploy?
Railway gives you one-click deploys from GitHub with generous free tier. Perfect for shipping what Claude Code builds.
Deploy your first app on RailwayPick the right Claude plan for your workflow
Use our side-by-side comparison to match plan to workload so you never hit limits mid-sprint.
Open plan comparisonNew guides, when they ship
One email, roughly weekly. CLAUDE.md templates, workflows I actually use, and the cut-for-length stuff that does not make the public guides. One-click unsubscribe.
Or read Product Field Notes, the Substack
