Userflow Dispatcher
Overview
Entry point for the flow-* skill set. Reads what the user is building (from their words or the project itself), selects the most relevant flow skills, loads them, and applies their combined guidance — so the user never has to know skill names.
When to Use
/userflowinvoked, with or without arguments- User describes something to build/review ("add billing", "new mobile app", "our signup is leaking users") and flow guidance would help
- Starting any app surface when the relevant
flow-*skills aren't obvious - NOT for pure visual styling (color, type, spacing) — no flow skill covers that
- NOT when the user already named a specific
flow-*skill — just invoke it directly
The Dispatch Process
- Determine scope. Use the argument text if given. If none, infer from conversation; if still unclear, inspect the project (routes, screens, package manifest) — don't interrogate the user. Ask at most one question, only if the answer changes skill selection.
- Select skills from the routing table below. Pick 1–4. Prefer the fewest that cover the task; a whole-app request gets the App Bundle, a single screen gets 1–2.
- Load them. Invoke each selected skill (Skill tool in Claude Code; read
skills/<name>/SKILL.mdin other harnesses). Never work from memory of a skill — load it. - State the selection in one line ("Applying flow-checkout + flow-forms") and do the work under their combined rules. On conflicts, the more specific skill wins (flow-checkout beats flow-forms inside a payment step).
- Check the output against each loaded skill's Anti-Patterns section before presenting it.
- Generate the flow report. For any request that designs or reviews one or more flows, emit a self-contained
flow-report.htmlthe user can open — see Flow Report below. Skip only for trivial single-question lookups.
Flow Report
Fill report-template.html (in this skill's directory) — a dependency-free HTML file, one copy per run, written to the project root (or a path the user names):
- Header: project, date, one-line scope, chips for each skill applied.
- Per flow: numbered step cards (screen title, what's on it, primary action → destination, branch conditions), a screen-inventory table (purpose / primary action / empty-loading-error states), and an anti-pattern audit table with PASS/WARN/FAIL verdicts taken from the loaded skills' Anti-Patterns sections.
- Footer sections: open questions / parked items.
Duplicate the marked repeat-block per flow; delete unused placeholders — never ship
{{…}}in output. Tell the user the file path when done.
Routing Table
| Signal in task / project | Skills |
|---|---|
| Signup, login, SSO, passkeys, 2FA, password reset, "locked out", session expiry | flow-auth |
| First-run, welcome, activation, setup wizard, "users sign up but don't stick" | flow-onboarding (+ flow-empty-states) |
| Blank screen, no data yet, loading, skeletons, spinners, "feels slow" | flow-empty-states |
| Push/notification/location/camera permission, priming, "everyone denies the prompt" | flow-permissions |
| Cart, checkout, payment, buy, donate, order confirmation, abandonment | flow-checkout (+ flow-forms) |
| Pricing page, trial, subscription, upgrade/downgrade, cancel, paywall, dunning | flow-paywall |
| Settings, preferences, profile, account, delete account, change email/password, data export | flow-settings (+ flow-forms) |
| Share, invite, collaborators, permissions on objects, "who can see this", presence | flow-sharing |
| Nav structure, menus, tab bar vs sidebar, breadcrumbs, "users get lost", cmd+K | flow-navigation |
| Overall layout, shell, panels, sidebar widths, responsive collapse, "layout feels off" | flow-app-shell (+ flow-navigation) |
| Table, list, feed, grid of records, sorting, bulk actions, pagination vs infinite scroll | flow-tables |
| Search box, filters, facets, typeahead, zero results, "can't find things" | flow-search |
| Any form, wizard, multi-step, field validation, "form abandonment" | flow-forms |
| Errors, failures, offline, retries, undo, destructive actions, 404/500, lost work | flow-errors |
| AI chat, assistant, copilot, agent UI, streaming, tool-use display, citations | flow-ai-chat |
Bundles (multi-skill requests)
| Request shape | Bundle |
|---|---|
| "New app" / greenfield product | flow-app-shell, flow-navigation, flow-onboarding, flow-auth |
| "Add billing/monetization" | flow-paywall, flow-checkout, flow-settings |
| "Admin panel / dashboard / back office" | flow-app-shell, flow-tables, flow-search |
| "Make it collaborative / add teams" | flow-sharing, flow-permissions, flow-settings |
| "UX audit / review the whole app" | Walk the routing table against each existing surface; report per-skill anti-pattern hits |
| "Add an AI feature" | flow-ai-chat, flow-empty-states, flow-errors |
Quick Reference
| Situation | Action |
|---|---|
/userflow build a pricing page | Load flow-paywall, build under it |
/userflow with no args, mid-project | Infer surface from recent work; inspect repo if needed |
| Task matches nothing in the table | Say so — don't force-fit a skill |
| More than 4 skills match | It's a bundle request — use a bundle row or split the work |
Anti-Patterns
| Mistake | Fix |
|---|---|
| Summarizing skills from memory instead of loading them | Always load the selected SKILL.md — the value is in the specifics |
| Loading all 15 "to be safe" | Max 4; selection is the job |
| Asking the user which skills they want | They invoked the dispatcher precisely to avoid that — route, then state the pick |
| Applying flow guidance to a styling-only request | Redirect to design/styling skills; flows ≠ visuals |
