qualia-framework 3.2.1 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +49 -18
- package/agents/plan-checker.md +158 -0
- package/agents/research-synthesizer.md +86 -0
- package/agents/researcher.md +119 -0
- package/agents/roadmapper.md +157 -0
- package/bin/install.js +101 -5
- package/package.json +2 -1
- package/references/questioning.md +123 -0
- package/skills/qualia-discuss/SKILL.md +115 -0
- package/skills/qualia-map/SKILL.md +145 -0
- package/skills/qualia-milestone/SKILL.md +148 -0
- package/skills/qualia-new/SKILL.md +374 -229
- package/skills/qualia-plan/SKILL.md +135 -30
- package/skills/qualia-research/SKILL.md +124 -0
- package/templates/phase-context.md +48 -0
- package/templates/projects/ai-agent.md +55 -0
- package/templates/projects/mobile-app.md +56 -0
- package/templates/projects/voice-agent.md +55 -0
- package/templates/projects/website.md +58 -0
- package/templates/requirements.md +69 -0
- package/templates/research-project/ARCHITECTURE.md +70 -0
- package/templates/research-project/FEATURES.md +60 -0
- package/templates/research-project/PITFALLS.md +73 -0
- package/templates/research-project/STACK.md +51 -0
- package/templates/research-project/SUMMARY.md +86 -0
- package/templates/roadmap.md +71 -0
|
@@ -1,323 +1,468 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: qualia-new
|
|
3
|
-
description: "Set up a new project from scratch —
|
|
3
|
+
description: "Set up a new project from scratch — deep questioning, parallel research, REQUIREMENTS.md, ROADMAP.md, approval gate. Use when starting any new client project."
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
# /qualia-new — New Project
|
|
6
|
+
# /qualia-new — New Project
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
Comprehensive project initialization. Deep questioning → 4 parallel research agents → REQUIREMENTS.md with REQ-IDs → ROADMAP.md with phases → approval → scaffold → ready to plan Phase 1.
|
|
9
|
+
|
|
10
|
+
**Flags:**
|
|
11
|
+
- `/qualia-new` — full flow (default)
|
|
12
|
+
- `/qualia-new --quick` — 4-phase flat wizard (faster, less rigorous, for trivial projects)
|
|
9
13
|
|
|
10
14
|
## Process
|
|
11
15
|
|
|
12
16
|
### Step 0. Banner
|
|
13
17
|
|
|
14
|
-
Print this FIRST, before anything else:
|
|
15
|
-
|
|
16
18
|
```bash
|
|
17
19
|
node ~/.claude/bin/qualia-ui.js banner new
|
|
18
20
|
```
|
|
19
21
|
|
|
20
|
-
Then say: **"Let's build something. Tell me what you
|
|
22
|
+
Then say: **"Let's build something. Tell me what you want to make."**
|
|
21
23
|
|
|
22
|
-
Wait for
|
|
24
|
+
Wait for free-text answer. Do NOT use AskUserQuestion here — let them talk naturally.
|
|
23
25
|
|
|
24
|
-
### Step
|
|
26
|
+
### Step 0.5. Brownfield Check
|
|
25
27
|
|
|
26
|
-
|
|
28
|
+
Before questioning, detect if we're in an existing codebase:
|
|
27
29
|
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
description: "Landing page, SaaS, dashboard, marketing site, portal"
|
|
34
|
-
- label: "AI Agent"
|
|
35
|
-
description: "Chatbot, AI assistant, tool-calling agent, RAG system"
|
|
36
|
-
- label: "Voice Agent"
|
|
37
|
-
description: "Phone agent, VAPI, Retell AI, ElevenLabs call bot"
|
|
38
|
-
- label: "Mobile App"
|
|
39
|
-
description: "iOS, Android, React Native, Expo"
|
|
30
|
+
```bash
|
|
31
|
+
test -f package.json && echo "HAS_PACKAGE"
|
|
32
|
+
test -d .git && echo "HAS_GIT"
|
|
33
|
+
ls *.ts *.tsx *.js *.jsx *.py 2>/dev/null | head -5
|
|
34
|
+
test -f .planning/codebase/README.md && echo "ALREADY_MAPPED"
|
|
40
35
|
```
|
|
41
36
|
|
|
42
|
-
|
|
37
|
+
**If existing code detected AND not already mapped:**
|
|
43
38
|
|
|
44
|
-
|
|
39
|
+
- header: "Existing Code"
|
|
40
|
+
- question: "I see existing code here. Map the codebase first so I understand what's already built?"
|
|
41
|
+
- options:
|
|
42
|
+
- "Map codebase first" — Run /qualia-map, then continue (recommended for brownfield)
|
|
43
|
+
- "Skip mapping" — Treat as greenfield anyway
|
|
45
44
|
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
- "AI / LLM" — Chat, completions, embeddings, RAG
|
|
55
|
-
- "Voice calls" — Inbound/outbound calls, IVR, telephony
|
|
56
|
-
- "Email / notifications" — Transactional email, SMS, push
|
|
57
|
-
- "File uploads" — Images, documents, S3/storage
|
|
58
|
-
- "Admin dashboard" — Internal tools, analytics, reporting
|
|
59
|
-
- "API / integrations" — Third-party APIs, webhooks, CRM sync
|
|
60
|
-
- "Real-time" — WebSockets, live updates, presence
|
|
45
|
+
If "Map codebase first": invoke the `qualia-map` skill inline, wait for completion, then continue to Step 1.
|
|
46
|
+
|
|
47
|
+
### Step 1. Deep Questioning
|
|
48
|
+
|
|
49
|
+
**Load the questioning methodology as your guide:**
|
|
50
|
+
|
|
51
|
+
```bash
|
|
52
|
+
cat ~/.claude/qualia-references/questioning.md 2>/dev/null
|
|
61
53
|
```
|
|
62
54
|
|
|
63
|
-
|
|
55
|
+
Follow that methodology:
|
|
56
|
+
- Start with their free-text answer from Step 0
|
|
57
|
+
- Follow energy — dig into what excited them
|
|
58
|
+
- Challenge vagueness — never accept fuzzy answers
|
|
59
|
+
- Make abstract concrete — "walk me through using this"
|
|
60
|
+
- Surface motivation — "what prompted this?"
|
|
61
|
+
- Check the 4-item context checklist mentally (what, why, who, done)
|
|
64
62
|
|
|
65
|
-
|
|
63
|
+
**Use AskUserQuestion for forks with 2-4 concrete interpretations.** Use free text when you want them to think freely.
|
|
66
64
|
|
|
67
|
-
|
|
65
|
+
**Decision gate** — when you could write a clear PROJECT.md:
|
|
68
66
|
|
|
69
|
-
|
|
70
|
-
question: "
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
-
|
|
74
|
-
description: "Dark backgrounds, neon accents, strong contrast"
|
|
75
|
-
preview: |
|
|
76
|
-
┌──────────────────────────────┐
|
|
77
|
-
│ ██████████████████████████ │
|
|
78
|
-
│ ██ DARK BG + TEAL GLOW ██ │
|
|
79
|
-
│ ██████████████████████████ │
|
|
80
|
-
│ │
|
|
81
|
-
│ ░░░░░░░░░░░░░░░░░░░░░░░░ │
|
|
82
|
-
│ Sharp cards, glass effects │
|
|
83
|
-
│ Neon borders, deep shadows │
|
|
84
|
-
└──────────────────────────────┘
|
|
85
|
-
|
|
86
|
-
- label: "Clean & Minimal"
|
|
87
|
-
description: "White space, subtle shadows, refined typography"
|
|
88
|
-
preview: |
|
|
89
|
-
┌──────────────────────────────┐
|
|
90
|
-
│ │
|
|
91
|
-
│ Clean & Minimal │
|
|
92
|
-
│ ───────────── │
|
|
93
|
-
│ │
|
|
94
|
-
│ Generous whitespace │
|
|
95
|
-
│ Subtle borders │
|
|
96
|
-
│ Light, airy feel │
|
|
97
|
-
└──────────────────────────────┘
|
|
98
|
-
|
|
99
|
-
- label: "Colorful & Playful"
|
|
100
|
-
description: "Gradients, rounded shapes, vibrant palette"
|
|
101
|
-
preview: |
|
|
102
|
-
┌──────────────────────────────┐
|
|
103
|
-
│ ⬢ ● ▲ ■ COLORFUL │
|
|
104
|
-
│ │
|
|
105
|
-
│ ╭──────╮ ╭──────╮ │
|
|
106
|
-
│ │ Card │ │ Card │ │
|
|
107
|
-
│ ╰──────╯ ╰──────╯ │
|
|
108
|
-
│ Rounded, gradient fills │
|
|
109
|
-
│ Fun, approachable │
|
|
110
|
-
└──────────────────────────────┘
|
|
111
|
-
|
|
112
|
-
- label: "Corporate / Professional"
|
|
113
|
-
description: "Structured layouts, trust signals, enterprise feel"
|
|
114
|
-
preview: |
|
|
115
|
-
┌──────────────────────────────┐
|
|
116
|
-
│ LOGO Nav Nav [CTA] │
|
|
117
|
-
│ ──────────────────────── │
|
|
118
|
-
│ ┌────┐ ┌────┐ ┌────┐ │
|
|
119
|
-
│ │Feat│ │Feat│ │Feat│ │
|
|
120
|
-
│ └────┘ └────┘ └────┘ │
|
|
121
|
-
│ Structured, trustworthy │
|
|
122
|
-
│ Clear hierarchy │
|
|
123
|
-
└──────────────────────────────┘
|
|
124
|
-
```
|
|
67
|
+
- header: "Ready?"
|
|
68
|
+
- question: "I think I understand what you're building. Ready to create PROJECT.md?"
|
|
69
|
+
- options:
|
|
70
|
+
- "Create PROJECT.md" — Let's move forward
|
|
71
|
+
- "Keep exploring" — I want to share more
|
|
125
72
|
|
|
126
|
-
|
|
73
|
+
Loop until "Create PROJECT.md".
|
|
127
74
|
|
|
128
|
-
|
|
75
|
+
### Step 2. Detect Project Type + Load Template
|
|
129
76
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
77
|
+
From the questioning answers, infer project type:
|
|
78
|
+
|
|
79
|
+
- "website", "landing page", "marketing site", "SaaS", "dashboard", "portal" → `website`
|
|
80
|
+
- "chatbot", "AI assistant", "chat agent", "RAG", "agent" → `ai-agent`
|
|
81
|
+
- "voice agent", "phone agent", "call bot", "VAPI", "Retell" → `voice-agent`
|
|
82
|
+
- "mobile app", "iOS", "Android", "React Native", "Expo" → `mobile-app`
|
|
83
|
+
|
|
84
|
+
**If a type matches:**
|
|
85
|
+
|
|
86
|
+
```bash
|
|
87
|
+
cat ~/.claude/qualia-templates/projects/{type}.md
|
|
140
88
|
```
|
|
141
89
|
|
|
142
|
-
|
|
143
|
-
If "Qualia + extras" — ask which integrations.
|
|
90
|
+
This template gives suggested phase structure and category names the roadmapper will use.
|
|
144
91
|
|
|
145
|
-
|
|
92
|
+
**If no type matches:** continue without a template — the roadmapper will derive structure from requirements.
|
|
146
93
|
|
|
147
|
-
|
|
94
|
+
Store `template_type` (or `null`) for use in Step 6.
|
|
148
95
|
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
-
|
|
158
|
-
|
|
159
|
-
|
|
96
|
+
### Step 3. Design Direction (frontend only)
|
|
97
|
+
|
|
98
|
+
If the project involves frontend work (most do), capture design direction:
|
|
99
|
+
|
|
100
|
+
- header: "Design"
|
|
101
|
+
- question: "What's the design vibe?"
|
|
102
|
+
- options:
|
|
103
|
+
- "Dark & Bold" — Dark backgrounds, neon accents, strong contrast
|
|
104
|
+
- "Clean & Minimal" — White space, subtle shadows, refined typography
|
|
105
|
+
- "Colorful & Playful" — Gradients, rounded shapes, vibrant palette
|
|
106
|
+
- "Corporate / Professional" — Structured, trust signals, enterprise feel
|
|
107
|
+
|
|
108
|
+
Also ask (free text): "Any brand colors or reference sites I should look at?"
|
|
109
|
+
|
|
110
|
+
Store these for Step 7 (DESIGN.md generation).
|
|
160
111
|
|
|
161
|
-
|
|
112
|
+
### Step 4. Client Context
|
|
162
113
|
|
|
163
|
-
|
|
114
|
+
- header: "Client"
|
|
115
|
+
- question: "Client project or internal?"
|
|
116
|
+
- options:
|
|
117
|
+
- "Client project" — External client, needs handoff
|
|
118
|
+
- "Internal / Qualia" — Our own product
|
|
119
|
+
- "Personal / Side project" — No formal client
|
|
164
120
|
|
|
121
|
+
If client, ask their name (free text) and check for saved prefs:
|
|
165
122
|
```bash
|
|
166
|
-
cat ~/.claude/knowledge/client-prefs.md 2>/dev/null
|
|
123
|
+
cat ~/.claude/knowledge/client-prefs.md 2>/dev/null | grep -A 10 "{client name}"
|
|
167
124
|
```
|
|
168
125
|
|
|
169
|
-
If
|
|
126
|
+
If prefs found, mention: *"I have notes on {client} — {summary}. Applying these to defaults unless you say otherwise."*
|
|
170
127
|
|
|
171
|
-
### Step
|
|
128
|
+
### Step 5. Write PROJECT.md
|
|
172
129
|
|
|
173
|
-
|
|
130
|
+
Create `.planning/PROJECT.md` from the template:
|
|
174
131
|
|
|
132
|
+
```bash
|
|
133
|
+
mkdir -p .planning
|
|
134
|
+
cat ~/.claude/qualia-templates/project.md
|
|
175
135
|
```
|
|
176
|
-
⬢ QUALIA ▸ PROJECT SUMMARY
|
|
177
|
-
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
|
178
|
-
|
|
179
|
-
Project {name}
|
|
180
|
-
Type {type}
|
|
181
|
-
Client {client}
|
|
182
|
-
Stack {stack}
|
|
183
|
-
Features {feature list}
|
|
184
|
-
Design {design direction}
|
|
185
|
-
```
|
|
186
136
|
|
|
187
|
-
|
|
137
|
+
Fill in with questioning answers. Include:
|
|
138
|
+
|
|
139
|
+
```markdown
|
|
140
|
+
# {Project Name}
|
|
141
|
+
|
|
142
|
+
## Client
|
|
143
|
+
{name or "Internal" or "Personal"}
|
|
144
|
+
|
|
145
|
+
## What We're Building
|
|
146
|
+
{one-paragraph description from questioning}
|
|
147
|
+
|
|
148
|
+
## Core Value
|
|
149
|
+
{the ONE thing that must work}
|
|
150
|
+
|
|
151
|
+
## Requirements
|
|
152
|
+
### Validated
|
|
153
|
+
{if brownfield, inferred from codebase map; else "(none yet)"}
|
|
154
|
+
|
|
155
|
+
### Active (hypotheses)
|
|
156
|
+
- [ ] {requirement 1 — from questioning}
|
|
157
|
+
- [ ] {requirement 2}
|
|
158
|
+
- [ ] {requirement 3}
|
|
159
|
+
|
|
160
|
+
### Out of Scope
|
|
161
|
+
- {exclusion 1}
|
|
162
|
+
|
|
163
|
+
## Stack
|
|
164
|
+
{from questioning — default: Next.js 16 + React 19 + TypeScript + Supabase + Vercel}
|
|
188
165
|
|
|
166
|
+
## Design Direction
|
|
167
|
+
{from Step 3}
|
|
168
|
+
|
|
169
|
+
## Decisions
|
|
170
|
+
| Decision | Rationale |
|
|
171
|
+
|----------|-----------|
|
|
172
|
+
| {choice from questioning} | {why} |
|
|
173
|
+
|
|
174
|
+
---
|
|
175
|
+
*Created: {date}*
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
Commit:
|
|
179
|
+
```bash
|
|
180
|
+
git init 2>/dev/null
|
|
181
|
+
git add .planning/PROJECT.md
|
|
182
|
+
git commit -m "docs: initialize project"
|
|
189
183
|
```
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
184
|
+
|
|
185
|
+
### Step 6. Create config.json
|
|
186
|
+
|
|
187
|
+
Write `.planning/config.json`:
|
|
188
|
+
|
|
189
|
+
```json
|
|
190
|
+
{
|
|
191
|
+
"mode": "interactive",
|
|
192
|
+
"depth": "standard",
|
|
193
|
+
"template_type": "{detected or null}",
|
|
194
|
+
"workflow": {
|
|
195
|
+
"research": true,
|
|
196
|
+
"plan_check": true,
|
|
197
|
+
"verifier": true
|
|
198
|
+
}
|
|
199
|
+
}
|
|
197
200
|
```
|
|
198
201
|
|
|
199
|
-
|
|
202
|
+
**If the user says "quick" or the project is clearly trivial (landing page with 2 sections, 1 form):** set `depth: "quick"` and `workflow.research: false`.
|
|
200
203
|
|
|
201
|
-
|
|
204
|
+
### Step 7. Create DESIGN.md (frontend projects)
|
|
202
205
|
|
|
206
|
+
If frontend work is involved, generate `.planning/DESIGN.md` from `~/.claude/qualia-templates/DESIGN.md` using the design direction from Step 3. Fill in:
|
|
207
|
+
- Palette (concrete hex values, not placeholders)
|
|
208
|
+
- Typography (distinctive fonts, NOT Inter/Roboto/system-ui)
|
|
209
|
+
- Spacing (8px grid)
|
|
210
|
+
- Motion approach
|
|
211
|
+
- Component patterns
|
|
212
|
+
|
|
213
|
+
Commit:
|
|
203
214
|
```bash
|
|
204
|
-
|
|
215
|
+
git add .planning/DESIGN.md .planning/config.json
|
|
216
|
+
git commit -m "docs: design direction + config"
|
|
217
|
+
```
|
|
205
218
|
|
|
206
|
-
|
|
207
|
-
git init 2>/dev/null
|
|
219
|
+
### Step 8. Run Research (if enabled)
|
|
208
220
|
|
|
209
|
-
|
|
210
|
-
npx create-next-app@latest . --typescript --tailwind --eslint --app --src-dir=false --import-alias="@/*" --no-git
|
|
221
|
+
Check `.planning/config.json` → `workflow.research`. If `true`, proceed. If `false`, skip to Step 9.
|
|
211
222
|
|
|
212
|
-
|
|
213
|
-
|
|
223
|
+
**Banner:**
|
|
224
|
+
```bash
|
|
225
|
+
node ~/.claude/bin/qualia-ui.js banner research
|
|
214
226
|
```
|
|
215
227
|
|
|
216
|
-
|
|
228
|
+
Say: **"Running 4 parallel research agents (stack, features, architecture, pitfalls)..."**
|
|
229
|
+
|
|
230
|
+
**Create research dir:**
|
|
217
231
|
```bash
|
|
218
|
-
|
|
232
|
+
mkdir -p .planning/research
|
|
219
233
|
```
|
|
220
234
|
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
235
|
+
**Spawn 4 researchers in parallel** (single message, 4 Agent tool calls):
|
|
236
|
+
|
|
237
|
+
```
|
|
238
|
+
Agent(prompt="
|
|
239
|
+
Read your role: @~/.claude/agents/qualia-researcher.md
|
|
240
|
+
|
|
241
|
+
<dimension>stack</dimension>
|
|
242
|
+
<domain>{inferred domain from PROJECT.md}</domain>
|
|
243
|
+
<project_context>{PROJECT.md summary}</project_context>
|
|
244
|
+
<milestone_context>greenfield</milestone_context>
|
|
245
|
+
<output_path>.planning/research/STACK.md</output_path>
|
|
246
|
+
", subagent_type="qualia-researcher", description="Stack research")
|
|
247
|
+
|
|
248
|
+
Agent(prompt="
|
|
249
|
+
Read your role: @~/.claude/agents/qualia-researcher.md
|
|
250
|
+
|
|
251
|
+
<dimension>features</dimension>
|
|
252
|
+
<domain>{inferred domain}</domain>
|
|
253
|
+
<project_context>{PROJECT.md summary}</project_context>
|
|
254
|
+
<milestone_context>greenfield</milestone_context>
|
|
255
|
+
<output_path>.planning/research/FEATURES.md</output_path>
|
|
256
|
+
", subagent_type="qualia-researcher", description="Features research")
|
|
257
|
+
|
|
258
|
+
Agent(prompt="
|
|
259
|
+
Read your role: @~/.claude/agents/qualia-researcher.md
|
|
260
|
+
|
|
261
|
+
<dimension>architecture</dimension>
|
|
262
|
+
<domain>{inferred domain}</domain>
|
|
263
|
+
<project_context>{PROJECT.md summary}</project_context>
|
|
264
|
+
<milestone_context>greenfield</milestone_context>
|
|
265
|
+
<output_path>.planning/research/ARCHITECTURE.md</output_path>
|
|
266
|
+
", subagent_type="qualia-researcher", description="Architecture research")
|
|
267
|
+
|
|
268
|
+
Agent(prompt="
|
|
269
|
+
Read your role: @~/.claude/agents/qualia-researcher.md
|
|
270
|
+
|
|
271
|
+
<dimension>pitfalls</dimension>
|
|
272
|
+
<domain>{inferred domain}</domain>
|
|
273
|
+
<project_context>{PROJECT.md summary}</project_context>
|
|
274
|
+
<milestone_context>greenfield</milestone_context>
|
|
275
|
+
<output_path>.planning/research/PITFALLS.md</output_path>
|
|
276
|
+
", subagent_type="qualia-researcher", description="Pitfalls research")
|
|
224
277
|
```
|
|
225
278
|
|
|
226
|
-
|
|
279
|
+
**After all 4 complete, spawn synthesizer:**
|
|
227
280
|
|
|
228
|
-
|
|
281
|
+
```
|
|
282
|
+
Agent(prompt="
|
|
283
|
+
Read your role: @~/.claude/agents/qualia-research-synthesizer.md
|
|
229
284
|
|
|
230
|
-
|
|
231
|
-
|
|
285
|
+
Merge the 4 research files at .planning/research/ into .planning/research/SUMMARY.md.
|
|
286
|
+
Include roadmap implications.
|
|
287
|
+
", subagent_type="qualia-research-synthesizer", description="Synthesize research")
|
|
288
|
+
```
|
|
289
|
+
|
|
290
|
+
**Commit research:**
|
|
291
|
+
```bash
|
|
292
|
+
git add .planning/research/
|
|
293
|
+
git commit -m "docs: research synthesis (4 dimensions)"
|
|
294
|
+
```
|
|
232
295
|
|
|
233
|
-
|
|
296
|
+
**Show key findings:**
|
|
297
|
+
```bash
|
|
298
|
+
node ~/.claude/bin/qualia-ui.js ok "Research complete"
|
|
299
|
+
```
|
|
300
|
+
Display top 3 findings from SUMMARY.md (stack recommendation, table stakes, top pitfall).
|
|
234
301
|
|
|
235
|
-
|
|
302
|
+
### Step 9. Feature Scoping
|
|
236
303
|
|
|
237
|
-
|
|
304
|
+
Read `.planning/research/FEATURES.md` (if exists) and present the feature landscape:
|
|
238
305
|
|
|
239
|
-
|
|
240
|
-
- Palette: dark backgrounds (#0a0a0a, #141414), vibrant accent (teal #00d4aa, amber #f59e0b, etc.)
|
|
241
|
-
- Typography: bold display font + clean body font (e.g., "Plus Jakarta Sans" + "DM Sans")
|
|
242
|
-
- Effects: glass morphism, noise textures, glow effects
|
|
243
|
-
- Motion: expressive — staggered fades, parallax hints
|
|
306
|
+
For each category, use AskUserQuestion:
|
|
244
307
|
|
|
245
|
-
|
|
246
|
-
-
|
|
247
|
-
-
|
|
248
|
-
-
|
|
249
|
-
-
|
|
308
|
+
- header: "{Category name}"
|
|
309
|
+
- question: "Which {category} features are in v1?"
|
|
310
|
+
- multiSelect: true
|
|
311
|
+
- options:
|
|
312
|
+
- Each feature from FEATURES.md with brief description
|
|
313
|
+
- "None for v1" — defer entire category
|
|
250
314
|
|
|
251
|
-
|
|
252
|
-
-
|
|
253
|
-
-
|
|
254
|
-
-
|
|
255
|
-
- Motion: expressive — bouncy spring easing, scale on hover
|
|
315
|
+
Track:
|
|
316
|
+
- Selected → v1 requirements
|
|
317
|
+
- Unselected table stakes → v2 (users expect these)
|
|
318
|
+
- Unselected differentiators → out of scope
|
|
256
319
|
|
|
257
|
-
**
|
|
258
|
-
- Palette: navy/charcoal base, conservative accent (blue, green)
|
|
259
|
-
- Typography: trustworthy geometric (e.g., "Manrope" + "IBM Plex Sans")
|
|
260
|
-
- Effects: clean borders, subtle shadows, structured grids
|
|
261
|
-
- Motion: subtle — smooth fades, no bounce
|
|
320
|
+
**If research was skipped:** Ask free text: "What are the main things users need to be able to do?" — then probe for specifics on each capability mentioned.
|
|
262
321
|
|
|
263
|
-
|
|
264
|
-
- Concrete CSS variable values (not placeholders)
|
|
265
|
-
- Google Fonts import URL
|
|
266
|
-
- Spacing scale (8px grid)
|
|
267
|
-
- Component patterns (buttons, inputs, cards)
|
|
268
|
-
- Responsive approach
|
|
269
|
-
- Anti-patterns to avoid
|
|
322
|
+
Gather any additional requirements the user wants that research missed.
|
|
270
323
|
|
|
271
|
-
### Step
|
|
324
|
+
### Step 10. Run Roadmapper
|
|
272
325
|
|
|
326
|
+
**Banner:**
|
|
273
327
|
```bash
|
|
274
|
-
node ~/.claude/bin/
|
|
328
|
+
node ~/.claude/bin/qualia-ui.js banner roadmap
|
|
275
329
|
```
|
|
276
|
-
This creates both STATE.md and tracking.json with consistent formatting.
|
|
277
|
-
Do NOT manually edit these files — state.js handles both.
|
|
278
330
|
|
|
279
|
-
|
|
331
|
+
Spawn the roadmapper agent:
|
|
280
332
|
|
|
281
|
-
|
|
333
|
+
```
|
|
334
|
+
Agent(prompt="
|
|
335
|
+
Read your role: @~/.claude/agents/qualia-roadmapper.md
|
|
336
|
+
|
|
337
|
+
<task>
|
|
338
|
+
Create REQUIREMENTS.md and ROADMAP.md for this project.
|
|
282
339
|
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
2. Core — Main features
|
|
286
|
-
3. Content — Pages, copy, media
|
|
287
|
-
4. Polish — Design, animations, responsive
|
|
340
|
+
User-scoped v1 features:
|
|
341
|
+
{list of features selected in Step 9, grouped by category}
|
|
288
342
|
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
2. Agent — AI logic, prompts, tool calling
|
|
292
|
-
3. Interface — Chat UI, streaming, history
|
|
293
|
-
4. Polish — Error handling, rate limiting, monitoring
|
|
343
|
+
Template type: {template_type from config.json}
|
|
344
|
+
If template type is set, use ~/.claude/qualia-templates/projects/{type}.md as the phase structure starting point.
|
|
294
345
|
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
346
|
+
Write files immediately:
|
|
347
|
+
- .planning/REQUIREMENTS.md
|
|
348
|
+
- .planning/ROADMAP.md
|
|
349
|
+
- Update STATE.md via: node ~/.claude/bin/state.js init --project '{name}' --client '{client}' --type '{type}' --phases '<JSON>' --total_phases <N>
|
|
350
|
+
</task>
|
|
351
|
+
", subagent_type="qualia-roadmapper", description="Create roadmap")
|
|
352
|
+
```
|
|
300
353
|
|
|
301
|
-
|
|
354
|
+
### Step 11. Review Roadmap
|
|
355
|
+
|
|
356
|
+
Read the generated `ROADMAP.md`. Present it inline:
|
|
302
357
|
|
|
303
358
|
```
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
359
|
+
## Proposed Roadmap
|
|
360
|
+
|
|
361
|
+
**{N} phases** | **{X} requirements mapped** | All v1 requirements covered ✓
|
|
362
|
+
|
|
363
|
+
| # | Phase | Goal | Requirements | Success Criteria |
|
|
364
|
+
|---|-------|------|--------------|------------------|
|
|
365
|
+
| 1 | {name} | {goal} | {REQ-IDs} | {count} |
|
|
366
|
+
| 2 | {name} | {goal} | {REQ-IDs} | {count} |
|
|
367
|
+
...
|
|
368
|
+
|
|
369
|
+
### Phase 1: {Name}
|
|
370
|
+
Goal: {goal}
|
|
371
|
+
Requirements: {REQ-IDs}
|
|
372
|
+
Success criteria:
|
|
373
|
+
1. {criterion}
|
|
374
|
+
2. {criterion}
|
|
375
|
+
3. {criterion}
|
|
376
|
+
|
|
377
|
+
### Phase 2: {Name}
|
|
378
|
+
...
|
|
311
379
|
```
|
|
312
380
|
|
|
313
|
-
### Step
|
|
381
|
+
### Step 12. Approval Gate
|
|
382
|
+
|
|
383
|
+
- header: "Roadmap"
|
|
384
|
+
- question: "Does this roadmap work for you?"
|
|
385
|
+
- options:
|
|
386
|
+
- "Approve" — Commit and continue
|
|
387
|
+
- "Adjust phases" — Tell me what to change
|
|
388
|
+
- "Review full file" — Show raw ROADMAP.md
|
|
389
|
+
|
|
390
|
+
**If "Adjust":**
|
|
391
|
+
- Get the user's feedback
|
|
392
|
+
- Re-spawn the roadmapper with revision context
|
|
393
|
+
- Show revised roadmap
|
|
394
|
+
- Loop until approved
|
|
395
|
+
|
|
396
|
+
**If "Review full file":** `cat .planning/ROADMAP.md`, then re-ask.
|
|
397
|
+
|
|
398
|
+
**If "Approve":**
|
|
314
399
|
|
|
315
400
|
```bash
|
|
316
|
-
git add .planning/
|
|
317
|
-
git commit -m "
|
|
318
|
-
git push -u origin main
|
|
401
|
+
git add .planning/REQUIREMENTS.md .planning/ROADMAP.md .planning/STATE.md
|
|
402
|
+
git commit -m "docs: requirements + roadmap ({N} phases)"
|
|
319
403
|
```
|
|
320
404
|
|
|
405
|
+
### Step 13. Environment Setup
|
|
406
|
+
|
|
407
|
+
Check what the project needs (from PROJECT.md stack + research):
|
|
408
|
+
|
|
409
|
+
- Supabase project? Guide through `supabase link` or create new
|
|
410
|
+
- Vercel project? Guide through `vercel link`
|
|
411
|
+
- Env vars? Create `.env.local` with placeholders
|
|
412
|
+
|
|
413
|
+
Only walk through what's needed. Skip if the user says "I'll handle env myself."
|
|
414
|
+
|
|
415
|
+
Commit:
|
|
416
|
+
```bash
|
|
417
|
+
git add .gitignore
|
|
418
|
+
git commit -m "chore: environment setup" 2>/dev/null
|
|
419
|
+
```
|
|
420
|
+
|
|
421
|
+
### Step 14. Done
|
|
422
|
+
|
|
321
423
|
```bash
|
|
322
424
|
node ~/.claude/bin/qualia-ui.js end "PROJECT READY" "/qualia-plan 1"
|
|
323
425
|
```
|
|
426
|
+
|
|
427
|
+
Show summary:
|
|
428
|
+
|
|
429
|
+
```
|
|
430
|
+
⬢ PROJECT INITIALIZED
|
|
431
|
+
|
|
432
|
+
| Artifact | Location |
|
|
433
|
+
|----------------|-----------------------------|
|
|
434
|
+
| Project | .planning/PROJECT.md |
|
|
435
|
+
| Config | .planning/config.json |
|
|
436
|
+
| Requirements | .planning/REQUIREMENTS.md |
|
|
437
|
+
| Roadmap | .planning/ROADMAP.md |
|
|
438
|
+
| Design | .planning/DESIGN.md |
|
|
439
|
+
| Research | .planning/research/ |
|
|
440
|
+
| State | .planning/STATE.md |
|
|
441
|
+
|
|
442
|
+
{N} phases | {X} requirements | Ready to build
|
|
443
|
+
|
|
444
|
+
▶ Next: /qualia-plan 1 — plan Phase 1: {phase 1 name}
|
|
445
|
+
```
|
|
446
|
+
|
|
447
|
+
## --quick Flag (Fast Path)
|
|
448
|
+
|
|
449
|
+
If invoked as `/qualia-new --quick`, run a 4-phase flat flow instead of the full comprehensive flow:
|
|
450
|
+
|
|
451
|
+
1. Banner + "What do you want to make?"
|
|
452
|
+
2. 4-step wizard (type / features / design / client)
|
|
453
|
+
3. Fixed 4 phases based on project type (Foundation / Core / Content / Polish)
|
|
454
|
+
4. Skip: research, REQUIREMENTS.md, plan-check
|
|
455
|
+
5. Still creates: PROJECT.md, ROADMAP.md (simplified), STATE.md, DESIGN.md
|
|
456
|
+
6. Route to `/qualia-plan 1`
|
|
457
|
+
|
|
458
|
+
Use `--quick` for: landing pages with 1-2 sections, throwaway prototypes, personal experiments.
|
|
459
|
+
Do NOT use `--quick` for: client projects, anything with compliance/regulatory stakes, anything longer than 1 week.
|
|
460
|
+
|
|
461
|
+
## Rules
|
|
462
|
+
|
|
463
|
+
1. **Questioning is not a checklist.** Follow the thread, don't follow a script.
|
|
464
|
+
2. **Research runs automatically** unless `depth: quick` in config. Don't ask the user every time.
|
|
465
|
+
3. **Approval gate is mandatory.** Never commit a roadmap the user hasn't seen.
|
|
466
|
+
4. **STATE.md updates go through state.js init.** Never edit STATE.md by hand — the statusline reads tracking.json which state.js writes atomically.
|
|
467
|
+
5. **Don't skip the research synthesizer.** Four research files without a synthesis = unread bloat.
|
|
468
|
+
6. **Inline skill invocation.** When Step 0.5 offers `/qualia-map`, INVOKE it inline — don't exit and tell the user to re-run.
|