How jasonku09/grill-with-ui works
grill-with-ui is an agent skill that moves a design interview into a local browser. The user stages answers and discussion, then sends them as one turn; the agent replies with answers and another question round, and ultimately writes a design document. The main runtime is deliberately small: SKILL.md guides the agent, server.mjs serves the session and mediates files and notifications, and page.html provides the interface. Explore deeper and Visualize are additional agent-led workflows. Details of page/server routes and the prompt are based on README documentation where source excerpts were unavailable.
Main entry points: server.mjs Server and CLI · page.html Interview page · SKILL.md Visualize workflow
Components 14
Interview workflow
- Interview prompt
SKILL.md - Interview page
page.html - Explore deeper
SKILL.md
Local session runtime
- Server and CLI
server.mjs - Patch validation
server.mjs - Session state
server.mjs - Send event log
server.mjs - Monitor / wait
server.mjs
Design artifacts
- Visualize workflow
SKILL.md - Prototype or diagram
- Exhaustive design doc
Other components
- User
- Coding agent
- Visual subagent
Connections 20
- Coding agent → Interview prompt: follows
- Coding agent → Server and CLI: starts session
- User → Interview page: answers and stages
- Interview page → Server and CLI: reads state / sends
- Server and CLI → Interview page: serves interface
- Server and CLI → Send event log: appends Sends
- Server and CLI → Session state: reads session
- Coding agent → Patch validation: submits changes
- Patch validation → Session state: validates and writes
- Server and CLI → Monitor / wait: prints Send
- Monitor / wait → Coding agent: delivers turn
- Coding agent → Explore deeper: requests analysis
- Explore deeper → Coding agent: returns pros and cons
- Coding agent → Visualize workflow: requests visual
- Visualize workflow → Visual subagent: briefs drawing
- Visual subagent → Prototype or diagram: creates or redraws
- Server and CLI → Prototype or diagram: serves artifact
- User → Visualize workflow: requests visualization
- User → Prototype or diagram: gives feedback
- Coding agent → Exhaustive design doc: writes on finish