Prototyping
Trigger
Activate on /prototyping, a request to prototype a decision or compare
options through a prototype, or a request to keep prototyping through a host
session. Keep this stance until the client says to stop. Treat one-off
"prototype this" work as a one-step session.
Scope
Own the prototyping session directory, shell, step pages, manifest, and
loopback serving. The host owns its questions and plan; the client owns each
decision. Leave the discussed repository unchanged and stop before
implementing a selected option.
Inputs
- Host steps as they occur, including Consultant or Autoconsultant questions,
each Grilling question, Wayfinder ticket questions, and plain choices.
- A client-named slug or path to resume. Fresh requests never inspect sibling
sessions.
- A client-supplied state root, or expanded
~/.prototyping by default.
Roles
The agent builds pages, maintains the manifest, and keeps serving alive. The
client chooses options. Host skills keep their own output contract unchanged.
Procedure
- On activation, resolve one session directory. Resume only an explicitly
named slug or path. Otherwise choose a direct lowercase-hyphen slug from the
topic without listing or reading siblings. Create
steps/ and initialize
steps.js with exactly window.STEPS = []; when absent. Copy
assets/index.html once when absent and replace its __SESSION_SLUG__
placeholder with the slug. Run this skill's shipping
scripts/serve.sh <session-dir> in place; never copy the helper into the
session directory.
- For every host step, assign the next monotonic integer
n across the whole
session. Preserve the host's label: Question N, Qn,
Qn (ticket: <name>), or an empty string for a plain host.
- Enumerate substantive options before applying the gate. Consultant and
Autoconsultant use number strings and exclude trailing
Other. Grilling,
Wayfinder, and plain hosts use A, B, and later letters in presentation
order. A prototype has two to five options. A step without enumerable
choices uses options: [] and recommended: null.
- Build a prototype only when the enumerated options differ in a way the
client can see or click. Visible structural choices use the UI shape;
behavioral choices use the logic shape. Read
the step-page contract before building either.
Text-only, naming, numeric, approval, and other non-visible choices use a
stub and have no step file.
- Append exactly one line per step to
steps.js:
window.STEPS.push({...});. The object contains n, label, one-line
title, host, kind, file, options, recommended, and decision.
Use valid compact JSON inside the call. kind is prototype or stub;
file is steps/NN-<lowercase-hyphen-step-slug>.html for a prototype and
null for a stub. Start decision as null. options is always a JSON
array of objects shaped exactly {"key":"1","label":"Option label"};
never use an array of bare keys, even when the page already shows labels.
- Run this skill's shipping
scripts/serve.sh <session-dir> in place before
rendering the host reply. Put
exactly one line immediately above the complete host reply. A single-step
host gets Prototypes: <URL>#<n>. A multi-question round gets
Prototypes: <URL>#<n> #<n> ... with every round entry, including stubs.
The host text below that line stays byte-identical, and the line never
enters the host's fenced question block. An activation-only turn prints
Prototypes: <URL> with no hash.
- When the client answers, edit only that entry's line and set
decision to
the option key or the client's exact free-text answer before adding the
next step. Keep the rest of the line's data unchanged.
- On
stop prototyping, leave the files and server running, report the
current URL and the resolved shipping helper command
<skill-dir>/scripts/serve.sh <session-dir> stop, then drop this stance.
Never copy that helper into the session. Later host steps receive no entry
or Prototypes: line.
Outputs
One ~/.prototyping/<slug>/ or redirected session containing the shell,
append-shaped manifest, optional self-contained step pages, server.port,
server.pid, and server.log, plus the served loopback URL and recorded
decisions.
Exceptions
If serving fails after the script's retries, report the session path and its
one reason line, keep building the files, and omit an unverified URL. If a
named session does not exist, ask only for the intended slug or path without
inspecting siblings.
QC
- Every active host step has one unique monotonic entry, and every answered
entry has its decision set before the next step.
- Each
prototype file exists, is self-contained, and has exactly one
selector per manifest option with accurate recommended and chosen markers.
- Each
stub has file: null; pagination uses n, while labels preserve host
numbering.
- The exact
/index.html URL answers on 127.0.0.1; the recorded PID belongs
to http.server serving the canonical session directory.
- The shell title shows the resolved session slug, never the literal
__SESSION_SLUG__ placeholder.
- The session contains only
index.html, steps.js, steps/, and
server.port, server.pid, and server.log; no helper script is copied in.
- No task file was written outside the resolved session directory, and host
text below the one added line is byte-identical.
References
Read references/step-page.md whenever the gate calls
for a UI or logic prototype page.
1---2name: prototyping3description: Triggers when a user asks to prototype a decision, compare visible or behavioral options in throwaway pages, keep prototyping through a consultant, grilling, or wayfinder session, or says /prototyping. It builds one loopback session that grows step by step and also handles a one-off "prototype this" request. Not for durable standalone HTML artifacts, polished product demos, browser QA, or integrating selected prototype code into an application.4---56# Prototyping78## Trigger910Activate on `/prototyping`, a request to prototype a decision or compare11options through a prototype, or a request to keep prototyping through a host12session. Keep this stance until the client says to stop. Treat one-off13"prototype this" work as a one-step session.1415## Scope1617Own the prototyping session directory, shell, step pages, manifest, and18loopback serving. The host owns its questions and plan; the client owns each19decision. Leave the discussed repository unchanged and stop before20implementing a selected option.2122## Inputs2324- Host steps as they occur, including Consultant or Autoconsultant questions,25 each Grilling question, Wayfinder ticket questions, and plain choices.26- A client-named slug or path to resume. Fresh requests never inspect sibling27 sessions.28- A client-supplied state root, or expanded `~/.prototyping` by default.2930## Roles3132The agent builds pages, maintains the manifest, and keeps serving alive. The33client chooses options. Host skills keep their own output contract unchanged.3435## Procedure36371. On activation, resolve one session directory. Resume only an explicitly38 named slug or path. Otherwise choose a direct lowercase-hyphen slug from the39 topic without listing or reading siblings. Create `steps/` and initialize40 `steps.js` with exactly `window.STEPS = [];` when absent. Copy41 `assets/index.html` once when absent and replace its `__SESSION_SLUG__`42 placeholder with the slug. Run this skill's shipping43 `scripts/serve.sh <session-dir>` in place; never copy the helper into the44 session directory.452. For every host step, assign the next monotonic integer `n` across the whole46 session. Preserve the host's label: `Question N`, `Qn`,47 `Qn (ticket: <name>)`, or an empty string for a plain host.483. Enumerate substantive options before applying the gate. Consultant and49 Autoconsultant use number strings and exclude trailing `Other`. Grilling,50 Wayfinder, and plain hosts use `A`, `B`, and later letters in presentation51 order. A prototype has two to five options. A step without enumerable52 choices uses `options: []` and `recommended: null`.534. Build a prototype only when the enumerated options differ in a way the54 client can see or click. Visible structural choices use the UI shape;55 behavioral choices use the logic shape. Read56 [the step-page contract](references/step-page.md) before building either.57 Text-only, naming, numeric, approval, and other non-visible choices use a58 stub and have no step file.595. Append exactly one line per step to `steps.js`:60 `window.STEPS.push({...});`. The object contains `n`, `label`, one-line61 `title`, `host`, `kind`, `file`, `options`, `recommended`, and `decision`.62 Use valid compact JSON inside the call. `kind` is `prototype` or `stub`;63 `file` is `steps/NN-<lowercase-hyphen-step-slug>.html` for a prototype and64 `null` for a stub. Start `decision` as `null`. `options` is always a JSON65 array of objects shaped exactly `{"key":"1","label":"Option label"}`;66 never use an array of bare keys, even when the page already shows labels.676. Run this skill's shipping `scripts/serve.sh <session-dir>` in place before68 rendering the host reply. Put69 exactly one line immediately above the complete host reply. A single-step70 host gets `Prototypes: <URL>#<n>`. A multi-question round gets71 `Prototypes: <URL>#<n> #<n> ...` with every round entry, including stubs.72 The host text below that line stays byte-identical, and the line never73 enters the host's fenced question block. An activation-only turn prints74 `Prototypes: <URL>` with no hash.757. When the client answers, edit only that entry's line and set `decision` to76 the option key or the client's exact free-text answer before adding the77 next step. Keep the rest of the line's data unchanged.788. On `stop prototyping`, leave the files and server running, report the79 current URL and the resolved shipping helper command80 `<skill-dir>/scripts/serve.sh <session-dir> stop`, then drop this stance.81 Never copy that helper into the session. Later host steps receive no entry82 or `Prototypes:` line.8384## Outputs8586One `~/.prototyping/<slug>/` or redirected session containing the shell,87append-shaped manifest, optional self-contained step pages, `server.port`,88`server.pid`, and `server.log`, plus the served loopback URL and recorded89decisions.9091## Exceptions9293If serving fails after the script's retries, report the session path and its94one reason line, keep building the files, and omit an unverified URL. If a95named session does not exist, ask only for the intended slug or path without96inspecting siblings.9798## QC99100- Every active host step has one unique monotonic entry, and every answered101 entry has its decision set before the next step.102- Each `prototype` file exists, is self-contained, and has exactly one103 selector per manifest option with accurate recommended and chosen markers.104- Each `stub` has `file: null`; pagination uses `n`, while labels preserve host105 numbering.106- The exact `/index.html` URL answers on `127.0.0.1`; the recorded PID belongs107 to `http.server` serving the canonical session directory.108- The shell title shows the resolved session slug, never the literal109 `__SESSION_SLUG__` placeholder.110- The session contains only `index.html`, `steps.js`, `steps/`, and111 `server.port`, `server.pid`, and `server.log`; no helper script is copied in.112- No task file was written outside the resolved session directory, and host113 text below the one added line is byte-identical.114115## References116117Read [references/step-page.md](references/step-page.md) whenever the gate calls118for a UI or logic prototype page.