Claude Code Guide

Full project development flow

A 9-stage flow that ties gstack, ECC, and Auto Agent together end-to-end.

Full project development flow

The 9-stage flow that ties three companion tools together — gstack commands, ECC Skills, and Auto Agent — from idea to ship. Each stage lists only the must-run commands; click into the commands library for full usage details.

TL;DR — the golden 6-step chain: One complete feature, from kickoff to launch. Run these six commands in order.

/using-superpowers→ /autoplan→ /ui-ux-pro-max→ /tdd-workflow→ /cso→ /ship

gstack command (you type it) ECC Skill (you type it) Auto Agent (Claude fires it)

Kickoff — the very first message of every new conversation

This is the master switch that turns on every ECC Skill so the rest of the commands can auto-detect and self-fire. Skip it and a lot of skills simply won't trigger.

/using-superpowers

Research — search before you write a line of code

Take the CEO's view across the competitive landscape and reference implementations, then use ECC to dig up existing libraries, templates, and projects so you don't reinvent anything.

/browse [competitor URL or name]　·　/search-first [keywords]

Plan — three viewpoints before you ship

/office-hours uses six pointed questions to force you to clarify the goal. /autoplan runs CEO + engineering + design reviews back-to-back and produces a prioritized implementation plan. /executing-plans loads the plan and walks through it step by step.

/office-hours　→　/autoplan　→　/executing-plans

UI design — pick a style before you write any markup

/design-consultation clarifies the product's positioning. /design-shotgun diverges into 3–5 options for comparison. /ui-ux-pro-max picks a final style from a library of 67 styles, 96 palettes, and 56 fonts. /design-html renders an HTML preview. /frontend-design turns it into production code.

/design-consultation　·　/design-shotgun　·　/ui-ux-pro-max　·　/frontend-design

Build — TDD-driven, with three Auto Agents standing watch

/tdd-workflow enforces the rhythm: failing test first, smallest implementation that makes it pass, then refactor — coverage stays above 80%. Once you've written code, Claude auto-fires code-reviewer for quality, security-reviewer for security, and build-error-resolver for build breakage.

/tdd-workflow　+　code-reviewer / security-reviewer / build-error-resolver (auto)

Debug & verify — chase the root cause, then run the full sweep

When you hit a bug, run /systematic-debugging first — hypothesis → experiment → verification — instead of patching blindly. After the fix, /verification-loop runs the full sweep: tests, build, E2E. Then /verify gives the engineer-view deep check on edge cases.

/systematic-debugging　→　/verification-loop　→　/verify

Security & code review — three viewpoints in parallel

/cso runs OWASP Top 10 plus STRIDE threat modeling and attaches an attack scenario to each finding. /security-review is a deeper security-only pass. /review scores quality from the engineer's view. /requesting-code-review spawns an independent subagent for an objective third-party review.

/cso　·　/security-review　·　/review　·　/requesting-code-review

QA — actually open a browser and click around

Hand /qa a staging URL and it opens a real browser, clicks through the flows, finds bugs, fixes them, and adds regression tests. /benchmark runs perf benchmarks to surface bottlenecks.

/qa [staging URL]　·　/benchmark

Ship — one command from "done" to "PR open"

/ship syncs main, runs the tests, pushes, and opens a PR. /finishing-a-development-branch walks you through the post-test wrap-up and merge. /land-and-deploy merges and triggers CI/CD. For risky changes, gate it behind /canary first.

/ship　→　/land-and-deploy　(use /canary first for risky changes)

Wrap up & retro — write down the state, capture the lessons

Before every push, jot the current progress into PROJECT_STATE.md so the next conversation picks up exactly where this one left off. Run /retro to look back at this round of work and flag the friction points so you can sidestep them next time.

PROJECT_STATE.md　·　/retro

Git commit message quick reference

feat: add a new feature

Use when you've added something new

fix: fix a bug

Use when you've fixed a bug

refactor: restructure

Behavior unchanged, structure improved

style: update styling

UI tweaks, no logic changes

docs: update docs

Documentation only

chore: routine maintenance

Dependency bumps, config tweaks

Read next:

"Best practices & tricks" — parallel execution, model selection, context-window management
"UI/UX Pro Max guide" — the deep-dive for stage 3 (the 67 styles and 96 palettes)

Open the full interactive index →

Vexilo is the missing index for Claude Code — 31 agents, 125 commands, 123 skills and more, organized by scenario. Browse free; unlock search, filters and one-click CLAUDE.md export with a one-time $19 licence.