@opengsd/get-shit-done-redux 1.0.0

package/get-shit-done/workflows/ui-phase.md

@@ -0,0 +1,338 @@
+<purpose>
+Generate a UI design contract (UI-SPEC.md) for frontend phases. Orchestrates gsd-ui-researcher and gsd-ui-checker with a revision loop. Inserts between discuss-phase and plan-phase in the lifecycle.
+
+UI-SPEC.md locks spacing, typography, color, copywriting, and design system decisions before the planner creates tasks. This prevents design debt caused by ad-hoc styling decisions during execution.
+</purpose>
+
+<required_reading>
+@~/.claude/get-shit-done/references/ui-brand.md
+</required_reading>
+
+<available_agent_types>
+Valid GSD subagent types (use exact names — do not fall back to 'general-purpose'):
+- gsd-ui-researcher — Researches UI/UX approaches
+- gsd-ui-checker — Reviews UI implementation quality
+</available_agent_types>
+
+<process>
+
+## 1. Initialize
+
+```bash
+# SDK resolution: prefer local gsd-tools.cjs, fall back to global gsd-sdk (#3668)
+GSD_TOOLS="${RUNTIME_DIR:-$(git rev-parse --show-toplevel 2>/dev/null || pwd)}/get-shit-done/bin/gsd-tools.cjs"
+if [ -f "$GSD_TOOLS" ]; then
+  GSD_SDK="node $GSD_TOOLS"
+elif command -v gsd-sdk >/dev/null 2>&1; then
+  GSD_SDK="gsd-sdk"
+else
+  echo "ERROR: gsd-sdk not found on PATH and $GSD_TOOLS does not exist." >&2
+  echo "Run: npx get-shit-done-cc@latest --claude --local" >&2
+  exit 1
+fi
+INIT=$($GSD_SDK query init.plan-phase "$PHASE")
+if [[ "$INIT" == @file:* ]]; then INIT=$(cat "${INIT#@file:}"); fi
+AGENT_SKILLS_UI=$($GSD_SDK query agent-skills gsd-ui-researcher)
+AGENT_SKILLS_UI_CHECKER=$($GSD_SDK query agent-skills gsd-ui-checker)
+```
+
+Parse JSON for: `phase_dir`, `phase_number`, `phase_name`, `phase_slug`, `padded_phase`, `has_context`, `has_research`, `commit_docs`.
+
+**File paths:** `state_path`, `roadmap_path`, `requirements_path`, `context_path`, `research_path`.
+
+Detect sketch findings:
+```bash
+SKETCH_FINDINGS_PATH=$(ls ./.claude/skills/sketch-findings-*/SKILL.md 2>/dev/null | head -1 || true)
+```
+
+Resolve UI agent models:
+
+```bash
+UI_RESEARCHER_MODEL=$($GSD_SDK query resolve-model gsd-ui-researcher --raw)
+UI_CHECKER_MODEL=$($GSD_SDK query resolve-model gsd-ui-checker --raw)
+```
+
+Check config:
+
+```bash
+UI_ENABLED=$($GSD_SDK query config-get workflow.ui_phase 2>/dev/null || echo "true")
+```
+
+**If `UI_ENABLED` is `false`:**
+```
+UI phase is disabled in config. Enable via /gsd:settings.
+```
+Exit workflow.
+
+**If `planning_exists` is false:** Error — run `/gsd:new-project` first.
+
+## 2. Parse and Validate Phase
+
+Extract phase number from $ARGUMENTS. If not provided, detect next unplanned phase.
+
+```bash
+PHASE_INFO=$($GSD_SDK query roadmap.get-phase "${PHASE}")
+```
+
+**If `found` is false:** Error with available phases.
+
+## 3. Check Prerequisites
+
+**If `has_context` is false:**
+```
+No CONTEXT.md found for Phase {N}.
+Recommended: run /gsd:discuss-phase {N} first to capture design preferences.
+Continuing without user decisions — UI researcher will ask all questions.
+```
+Continue (non-blocking).
+
+**If `has_research` is false:**
+```
+No RESEARCH.md found for Phase {N}.
+Note: stack decisions (component library, styling approach) will be asked during UI research.
+```
+Continue (non-blocking).
+
+**If `SKETCH_FINDINGS_PATH` is not empty:**
+```
+⚡ Sketch findings detected: {SKETCH_FINDINGS_PATH}
+   Validated design decisions from /gsd:sketch will be loaded into the UI researcher.
+   Pre-validated decisions (layout, palette, typography, spacing) should be treated as locked — not re-asked.
+```
+
+## 4. Check Existing UI-SPEC
+
+```bash
+UI_SPEC_FILE=$(ls "${PHASE_DIR}"/*-UI-SPEC.md 2>/dev/null | head -1)
+```
+
+
+**Text mode (`workflow.text_mode: true` in config or `--text` flag):** Set `TEXT_MODE=true` if `--text` is present in `$ARGUMENTS` OR `text_mode` from init JSON is `true`. When TEXT_MODE is active, replace every `AskUserQuestion` call with a plain-text numbered list and ask the user to type their choice number. This is required for non-Claude runtimes (OpenAI Codex, Gemini CLI, etc.) where `AskUserQuestion` is not available.
+**If exists:** Use AskUserQuestion:
+- header: "Existing UI-SPEC"
+- question: "UI-SPEC.md already exists for Phase {N}. What would you like to do?"
+- options:
+  - "Update — re-run researcher with existing as baseline"
+  - "View — display current UI-SPEC and exit"
+  - "Skip — keep current UI-SPEC, proceed to verification"
+
+If "View": display file contents, exit.
+If "Skip": proceed to step 7 (checker).
+If "Update": continue to step 5.
+
+## 5. Spawn gsd-ui-researcher
+
+Display:
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+ GSD ► UI DESIGN CONTRACT — PHASE {N}
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+◆ Spawning UI researcher...
+```
+
+Build prompt:
+
+```markdown
+Read ~/.claude/agents/gsd-ui-researcher.md for instructions.
+
+<objective>
+Create UI design contract for Phase {phase_number}: {phase_name}
+Answer: "What visual and interaction contracts does this phase need?"
+</objective>
+
+<files_to_read>
+- {state_path} (Project State)
+- {roadmap_path} (Roadmap)
+- {requirements_path} (Requirements)
+- {context_path} (USER DECISIONS from /gsd:discuss-phase)
+- {research_path} (Technical Research — stack decisions)
+- {SKETCH_FINDINGS_PATH} (Sketch Findings — validated design decisions, CSS patterns, visual direction from /gsd:sketch, if exists)
+</files_to_read>
+
+${AGENT_SKILLS_UI}
+
+<output>
+Write to: {phase_dir}/{padded_phase}-UI-SPEC.md
+Template: ~/.claude/get-shit-done/templates/UI-SPEC.md
+</output>
+
+<config>
+commit_docs: {commit_docs}
+phase_dir: {phase_dir}
+padded_phase: {padded_phase}
+</config>
+```
+
+Omit null file paths from `<files_to_read>`.
+
+```
+Agent(
+  prompt=ui_research_prompt,
+  subagent_type="gsd-ui-researcher",
+  model="{UI_RESEARCHER_MODEL}",
+  description="UI Design Contract Phase {N}"
+)
+```
+
+> **ORCHESTRATOR RULE — CODEX RUNTIME**: After calling Agent() above, stop working on this task immediately. Do not read more files, edit code, or run tests related to this task while the subagent is active. Wait for the subagent to return its result. This prevents duplicate work, conflicting edits, and wasted context. Only resume when the subagent result is available.
+
+## 6. Handle Researcher Return
+
+**If `## UI-SPEC COMPLETE`:**
+Display confirmation. Continue to step 7.
+
+**If `## UI-SPEC BLOCKED`:**
+Display blocker details and options. Exit workflow.
+
+## 7. Spawn gsd-ui-checker
+
+Display:
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+ GSD ► VERIFYING UI-SPEC
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+◆ Spawning UI checker...
+```
+
+Build prompt:
+
+```markdown
+Read ~/.claude/agents/gsd-ui-checker.md for instructions.
+
+<objective>
+Validate UI design contract for Phase {phase_number}: {phase_name}
+Check all 6 dimensions. Return APPROVED or BLOCKED.
+</objective>
+
+<files_to_read>
+- {phase_dir}/{padded_phase}-UI-SPEC.md (UI Design Contract — PRIMARY INPUT)
+- {context_path} (USER DECISIONS — check compliance)
+- {research_path} (Technical Research — check stack alignment)
+</files_to_read>
+
+${AGENT_SKILLS_UI_CHECKER}
+
+<config>
+ui_safety_gate: {ui_safety_gate config value}
+</config>
+```
+
+```
+Agent(
+  prompt=ui_checker_prompt,
+  subagent_type="gsd-ui-checker",
+  model="{UI_CHECKER_MODEL}",
+  description="Verify UI-SPEC Phase {N}"
+)
+```
+
+> **ORCHESTRATOR RULE — CODEX RUNTIME**: After calling Agent() above, stop working on this task immediately. Do not read more files, edit code, or run tests related to this task while the subagent is active. Wait for the subagent to return its result. This prevents duplicate work, conflicting edits, and wasted context. Only resume when the subagent result is available.
+
+## 8. Handle Checker Return
+
+**If `## UI-SPEC VERIFIED`:**
+Display dimension results. Proceed to step 10.
+
+**If `## ISSUES FOUND`:**
+Display blocking issues. Proceed to step 9.
+
+## 9. Revision Loop (Max 2 Iterations)
+
+Track `revision_count` (starts at 0).
+
+**If `revision_count` < 2:**
+- Increment `revision_count`
+- Re-spawn gsd-ui-researcher with revision context:
+
+```markdown
+<revision>
+The UI checker found issues with the current UI-SPEC.md.
+
+### Issues to Fix
+{paste blocking issues from checker return}
+
+Read the existing UI-SPEC.md, fix ONLY the listed issues, re-write the file.
+Do NOT re-ask the user questions that are already answered.
+</revision>
+```
+
+- After researcher returns → re-spawn checker (step 7)
+
+**If `revision_count` >= 2:**
+```
+Max revision iterations reached. Remaining issues:
+
+{list remaining issues}
+
+Options:
+1. Force approve — proceed with current UI-SPEC (FLAGs become accepted)
+2. Edit manually — open UI-SPEC.md in editor, re-run /gsd:ui-phase
+3. Abandon — exit without approving
+```
+
+Use AskUserQuestion for the choice.
+
+## 10. Present Final Status
+
+Display:
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+ GSD ► UI-SPEC READY ✓
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+**Phase {N}: {Name}** — UI design contract approved
+
+Dimensions: 6/6 passed
+{If any FLAGs: "Recommendations: {N} (non-blocking)"}
+
+───────────────────────────────────────────────────────────────
+
+## ▶ Next Up — [${PROJECT_CODE}] ${PROJECT_TITLE}
+
+{If CONTEXT.md exists for this phase:}
+**Plan Phase {N}** — planner will use UI-SPEC.md as design context
+
+`/clear` then: `/gsd:plan-phase {N}`
+
+{If CONTEXT.md does NOT exist:}
+**Discuss Phase {N}** — gather implementation context before planning
+
+`/clear` then: `/gsd:discuss-phase {N}`
+
+(or `/gsd:plan-phase {N}` to skip discussion)
+
+───────────────────────────────────────────────────────────────
+```
+
+## 11. Commit (if configured)
+
+```bash
+$GSD_SDK query commit "docs(${padded_phase}): UI design contract" --files "${PHASE_DIR}/${PADDED_PHASE}-UI-SPEC.md"
+```
+
+## 12. Update State
+
+```bash
+$GSD_SDK query state.record-session \
+  --stopped-at "Phase ${PHASE} UI-SPEC approved" \
+  --resume-file "${PHASE_DIR}/${PADDED_PHASE}-UI-SPEC.md"
+```
+
+</process>
+
+<success_criteria>
+- [ ] Config checked (exit if ui_phase disabled)
+- [ ] Phase validated against roadmap
+- [ ] Prerequisites checked (CONTEXT.md, RESEARCH.md — non-blocking warnings)
+- [ ] Existing UI-SPEC handled (update/view/skip)
+- [ ] gsd-ui-researcher spawned with correct context and file paths
+- [ ] UI-SPEC.md created in correct location
+- [ ] gsd-ui-checker spawned with UI-SPEC.md
+- [ ] All 6 dimensions evaluated
+- [ ] Revision loop if BLOCKED (max 2 iterations)
+- [ ] Final status displayed with next steps
+- [ ] UI-SPEC.md committed (if commit_docs enabled)
+- [ ] State updated
+</success_criteria>

package/get-shit-done/workflows/ui-review.md

@@ -0,0 +1,203 @@
+<purpose>
+Retroactive 6-pillar visual audit of implemented frontend code. Standalone command that works on any project — GSD-managed or not. Produces scored UI-REVIEW.md with actionable findings.
+</purpose>
+
+<required_reading>
+@~/.claude/get-shit-done/references/ui-brand.md
+</required_reading>
+
+<available_agent_types>
+Valid GSD subagent types (use exact names — do not fall back to 'general-purpose'):
+- gsd-ui-auditor — Audits UI against design requirements
+</available_agent_types>
+
+<process>
+
+## 0. Initialize
+
+```bash
+# SDK resolution: prefer local gsd-tools.cjs, fall back to global gsd-sdk (#3668)
+GSD_TOOLS="${RUNTIME_DIR:-$(git rev-parse --show-toplevel 2>/dev/null || pwd)}/get-shit-done/bin/gsd-tools.cjs"
+if [ -f "$GSD_TOOLS" ]; then
+  GSD_SDK="node $GSD_TOOLS"
+elif command -v gsd-sdk >/dev/null 2>&1; then
+  GSD_SDK="gsd-sdk"
+else
+  echo "ERROR: gsd-sdk not found on PATH and $GSD_TOOLS does not exist." >&2
+  echo "Run: npx get-shit-done-cc@latest --claude --local" >&2
+  exit 1
+fi
+INIT=$($GSD_SDK query init.phase-op "${PHASE_ARG}")
+if [[ "$INIT" == @file:* ]]; then INIT=$(cat "${INIT#@file:}"); fi
+AGENT_SKILLS_UI_REVIEWER=$($GSD_SDK query agent-skills gsd-ui-auditor)
+```
+
+Parse: `phase_dir`, `phase_number`, `phase_name`, `phase_slug`, `padded_phase`, `commit_docs`.
+
+```bash
+UI_AUDITOR_MODEL=$($GSD_SDK query resolve-model gsd-ui-auditor --raw)
+```
+
+Display banner:
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+ GSD ► UI AUDIT — PHASE {N}: {name}
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+```
+
+## 1. Detect Input State
+
+```bash
+SUMMARY_FILES=$(ls "${PHASE_DIR}"/*-SUMMARY.md 2>/dev/null)
+UI_SPEC_FILE=$(ls "${PHASE_DIR}"/*-UI-SPEC.md 2>/dev/null | head -1)
+UI_REVIEW_FILE=$(ls "${PHASE_DIR}"/*-UI-REVIEW.md 2>/dev/null | head -1)
+```
+
+**If `SUMMARY_FILES` empty:** Exit — "Phase {N} not executed. Run /gsd:execute-phase {N} first."
+
+
+**Text mode (`workflow.text_mode: true` in config or `--text` flag):** Set `TEXT_MODE=true` if `--text` is present in `$ARGUMENTS` OR `text_mode` from init JSON is `true`. When TEXT_MODE is active, replace every `AskUserQuestion` call with a plain-text numbered list and ask the user to type their choice number. This is required for non-Claude runtimes (OpenAI Codex, Gemini CLI, etc.) where `AskUserQuestion` is not available.
+**If `UI_REVIEW_FILE` non-empty:** Use AskUserQuestion:
+- header: "Existing UI Review"
+- question: "UI-REVIEW.md already exists for Phase {N}."
+- options:
+  - "Re-audit — run fresh audit"
+  - "View — display current review and exit"
+
+If "View": display file, exit.
+If "Re-audit": continue.
+
+## 2. Gather Context Paths
+
+Build file list for auditor:
+- All SUMMARY.md files in phase dir
+- All PLAN.md files in phase dir
+- UI-SPEC.md (if exists — audit baseline)
+- CONTEXT.md (if exists — locked decisions)
+
+## 3. Spawn gsd-ui-auditor
+
+```
+◆ Spawning UI auditor...
+```
+
+Build prompt:
+
+```markdown
+Read ~/.claude/agents/gsd-ui-auditor.md for instructions.
+
+<objective>
+Conduct 6-pillar visual audit of Phase {phase_number}: {phase_name}
+{If UI-SPEC exists: "Audit against UI-SPEC.md design contract."}
+{If no UI-SPEC: "Audit against abstract 6-pillar standards."}
+</objective>
+
+<files_to_read>
+- {summary_paths} (Execution summaries)
+- {plan_paths} (Execution plans — what was intended)
+- {ui_spec_path} (UI Design Contract — audit baseline, if exists)
+- {context_path} (User decisions, if exists)
+</files_to_read>
+
+${AGENT_SKILLS_UI_REVIEWER}
+
+<config>
+phase_dir: {phase_dir}
+padded_phase: {padded_phase}
+</config>
+```
+
+Omit null file paths.
+
+```
+Agent(
+  prompt=ui_audit_prompt,
+  subagent_type="gsd-ui-auditor",
+  model="{UI_AUDITOR_MODEL}",
+  description="UI Audit Phase {N}"
+)
+```
+
+> **ORCHESTRATOR RULE — CODEX RUNTIME**: After calling Agent() above, stop working on this task immediately. Do not read more files, edit code, or run tests related to this task while the subagent is active. Wait for the subagent to return its result. This prevents duplicate work, conflicting edits, and wasted context. Only resume when the subagent result is available.
+
+## 4. Handle Return
+
+**If `## UI REVIEW COMPLETE`:**
+
+Display score summary:
+
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+ GSD ► UI AUDIT COMPLETE ✓
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+**Phase {N}: {Name}** — Overall: {score}/24
+
+| Pillar | Score |
+|--------|-------|
+| Copywriting | {N}/4 |
+| Visuals | {N}/4 |
+| Color | {N}/4 |
+| Typography | {N}/4 |
+| Spacing | {N}/4 |
+| Experience Design | {N}/4 |
+
+Top fixes:
+1. {fix}
+2. {fix}
+3. {fix}
+
+Full review: {path to UI-REVIEW.md}
+
+───────────────────────────────────────────────────────────────
+
+## ▶ Next
+
+`/clear` then one of:
+
+- `/gsd:verify-work {N}` — UAT testing
+- `/gsd:plan-phase {N+1}` — plan next phase
+
+- `/gsd:verify-work {N}` — UAT testing
+- `/gsd:plan-phase {N+1}` — plan next phase
+
+───────────────────────────────────────────────────────────────
+```
+
+## Automated UI Verification (when Playwright-MCP is available)
+
+If `mcp__playwright__*` tools are accessible in this session:
+
+1. Navigate to each UI component described in the phase's UI-SPEC.md using
+   `mcp__playwright__navigate` (or equivalent Playwright-MCP tool).
+2. Take a screenshot of each component using `mcp__playwright__screenshot`.
+3. Compare against the spec's visual requirements — dimensions, color palette,
+   layout, spacing scale, and typography.
+4. Report any dimension, color, or layout discrepancies automatically as
+   additional findings within the relevant pillar section of UI-REVIEW.md.
+5. Flag items that require human judgment (brand feel, content tone) as
+   `needs_human_review: true` in the findings — these are surfaced to the user
+   separately after the automated pass completes.
+
+If Playwright-MCP is not available in this session, this section is skipped
+entirely. The audit falls back to the standard code-only review described above.
+No configuration change is required — the availability of `mcp__playwright__*`
+tools is detected at runtime.
+
+## 5. Commit (if configured)
+
+```bash
+$GSD_SDK query commit "docs(${padded_phase}): UI audit review" --files "${PHASE_DIR}/${PADDED_PHASE}-UI-REVIEW.md"
+```
+
+</process>
+
+<success_criteria>
+- [ ] Phase validated
+- [ ] SUMMARY.md files found (execution completed)
+- [ ] Existing review handled (re-audit/view)
+- [ ] gsd-ui-auditor spawned with correct context
+- [ ] UI-REVIEW.md created in phase directory
+- [ ] Score summary displayed to user
+- [ ] Next steps presented
+</success_criteria>