Apr 2026Hackathon build
Respec
A visual review tool that turns Kiro-style spec files (requirements, design, tasks) into an interactive canvas for reviewing, annotating, and approving specs, with a VS Code extension and a web demo.
- TypeScript
- Next.js
- React
- VS Code Extension API
- Vercel
01
What it does
Respec converts Kiro-style spec files (requirements.md, design.md, tasks.md) into a three-column interactive canvas where reviewers can annotate, request changes, and approve specs, then feed structured feedback back into Kiro or other agents.
02
How it works
- Three-column canvas showing requirements, design, and tasks side-by-side with cross-links from each requirement to its implementation tasks
- Four annotation types — comment, split, remove, clarify — that capture intent rather than just freeform notes
- Deterministic demo agents (DriftDetector and GapFinder) flag issues across the spec without depending on a live model
- FeedbackCompiler produces structured output that can be replayed into Kiro or another spec-driven agent
- VS Code extension reads from .kiro/specs/ and writes review artifacts back to .kiro/respec/, plus a Next.js web demo for the canvas
03
Key decisions
- Kept the demo agents deterministic so reviews are reproducible during the hackathon, with the architecture leaving room for Bedrock/Claude-powered agents later
- Split the repo into a Next.js web demo and a VS Code extension with shared webview, so the same canvas works inside the editor and on the web
- Modeled annotations as typed actions (split, remove, clarify) rather than freeform comments so feedback can be compiled and replayed
- Built for the Kiro Spark Challenge at ASU as a three-person team, MIT licensed