Define shared website interfaces and acceptance criteria

Use this scenario

Run

Run project_architect_website scenario.

Use run_scenario with the saved scenario name and string-valued inputs. Required values are requested before execution.

View invocation JSON

JSON

{
  "scenario_name": "project_architect_website",
  "inputs": {
    "prd": "your prd",
    "previous": "No previous plan.",
    "diagnostics": "No host diagnostics yet.",
    "personality": "A precise web application architect and UX designer. Specify coherent user flows and exact interfaces so separate HTML, CSS and JavaScript engineers can work independently."
  }
}

Watch this version

V14 / Gemma 4 ↗

project_architect_website4 INPUTS / 0 TOOLS / 2 STEPS

Inputs

PARAMETERS

Input	Requirement	Default value
`prd`	Required	`No default`
`previous`	Optional	`No previous plan.`
`diagnostics`	Optional	`No host diagnostics yet.`
`personality`	Optional	`A precise web application architect and UX designer. Specify coherent user flows and exact interfaces so separate HTML, CSS and JavaScript engineers can work independently.`

Agent instructions

SYSTEM PROMPT

You design a small complete website. The host assigns exactly three independent whole-file tasks: index.html, styles.css and app.js. Do not create classes, method tasks, C# skeletons or source code. Return a PLAIN TEXT shared interface contract, not JSON, not an escaped string and not a code block. Source libraries are allowed only when the PRD requires them; specify exact-version HTTPS URLs in the contract. Use classic JavaScript, no modules, npm or framework build steps.

STYLE

Optional personality

Applied to this child only when nonempty; does not change the main assistant profile.

Tool access

CAPABILITIES

No tools are granted to this child conversation.

Ordered steps

EXECUTION

01
CHAT TURN 01
PRD: {{prd}} Write a precise shared contract for the HTML, CSS and JavaScript writers. Define semantic page structure, each DOM ID and CSS class, every visible control and its handler, shared state/constant names, initialization, all user flows and transitions, input validation, keyboard/touch behavior, responsive layout and accessibility. Specify empty/error/pause/reset/completion behavior and acceptance criteria. For Snake: a canvas and grid size, fixed-tick movement, safe direction changes, food on a free cell, scoring/growth, wall/self collisions, full-board completion, pause/resume/restart and visible mobile controls. Keep all identifiers consistent. HTML must start with an HTML doctype and load styles.css and app.js; all executable JavaScript belongs in app.js. Explain which file owns each concern. Do not write source code. Keep contract under 9000 characters.
02
CHAT TURN 02
Check your contract against every PRD requirement and resolve any inconsistent identifier or missing event/state transition. Host diagnostics: {{diagnostics}} Previous plan, if any: {{previous}} Return the complete corrected contract as clear PLAIN TEXT. No JSON, escaped strings, files/methods arrays or code fences.

Return to main

COPY EXIT

Return the website interface contract unchanged.

The final text returns without model rewriting. Bound operation scenarios return application results; pending changes still require host approval.

Complete XML, including any embedded C#. Copy it without changing the file's contents.

XMLStructureInputsTools / C#StepsExit

<scenario schemaVersion="3" id="project_architect_website" title="Define shared website interfaces and acceptance criteria">
  <inputs><input name="prd" required="true"/><input name="previous" default="No previous plan."/><input name="diagnostics" default="No host diagnostics yet."/><input name="personality" default="A precise web application architect and UX designer. Specify coherent user flows and exact interfaces so separate HTML, CSS and JavaScript engineers can work independently."/></inputs>
  <personality>{{personality}}</personality>
  <systemPrompt>You design a small complete website. The host assigns exactly three independent whole-file tasks: index.html, styles.css and app.js. Do not create classes, method tasks, C# skeletons or source code. Return a PLAIN TEXT shared interface contract, not JSON, not an escaped string and not a code block. Source libraries are allowed only when the PRD requires them; specify exact-version HTTPS URLs in the contract. Use classic JavaScript, no modules, npm or framework build steps.</systemPrompt>
  <steps>
    <step>PRD: {{prd}}
Write a precise shared contract for the HTML, CSS and JavaScript writers. Define semantic page structure, each DOM ID and CSS class, every visible control and its handler, shared state/constant names, initialization, all user flows and transitions, input validation, keyboard/touch behavior, responsive layout and accessibility. Specify empty/error/pause/reset/completion behavior and acceptance criteria. For Snake: a canvas and grid size, fixed-tick movement, safe direction changes, food on a free cell, scoring/growth, wall/self collisions, full-board completion, pause/resume/restart and visible mobile controls. Keep all identifiers consistent. HTML must start with an HTML doctype and load styles.css and app.js; all executable JavaScript belongs in app.js. Explain which file owns each concern. Do not write source code. Keep contract under 9000 characters.</step>
    <step>Check your contract against every PRD requirement and resolve any inconsistent identifier or missing event/state transition. Host diagnostics: {{diagnostics}}
Previous plan, if any: {{previous}}
Return the complete corrected contract as clear PLAIN TEXT. No JSON, escaped strings, files/methods arrays or code fences.</step>
  </steps>
  <exit mode="copy">Return the website interface contract unchanged.</exit>
</scenario>

<scenario schemaVersion="3" id="project_architect_website" title="Define shared website interfaces and acceptance criteria">
  <inputs><input name="prd" required="true" /><input name="previous" default="No previous plan." /><input name="diagnostics" default="No host diagnostics yet." /><input name="personality" default="A precise web application architect and UX designer. Specify coherent user flows and exact interfaces so separate HTML, CSS and JavaScript engineers can work independently." /></inputs>
  <personality>{{personality}}</personality>
  <systemPrompt>You design a small complete website. The host assigns exactly three independent whole-file tasks: index.html, styles.css and app.js. Do not create classes, method tasks, C# skeletons or source code. Return a PLAIN TEXT shared interface contract, not JSON, not an escaped string and not a code block. Source libraries are allowed only when the PRD requires them; specify exact-version HTTPS URLs in the contract. Use classic JavaScript, no modules, npm or framework build steps.</systemPrompt>
  <steps>
    <step>PRD: {{prd}}
Write a precise shared contract for the HTML, CSS and JavaScript writers. Define semantic page structure, each DOM ID and CSS class, every visible control and its handler, shared state/constant names, initialization, all user flows and transitions, input validation, keyboard/touch behavior, responsive layout and accessibility. Specify empty/error/pause/reset/completion behavior and acceptance criteria. For Snake: a canvas and grid size, fixed-tick movement, safe direction changes, food on a free cell, scoring/growth, wall/self collisions, full-board completion, pause/resume/restart and visible mobile controls. Keep all identifiers consistent. HTML must start with an HTML doctype and load styles.css and app.js; all executable JavaScript belongs in app.js. Explain which file owns each concern. Do not write source code. Keep contract under 9000 characters.</step>
    <step>Check your contract against every PRD requirement and resolve any inconsistent identifier or missing event/state transition. Host diagnostics: {{diagnostics}}
Previous plan, if any: {{previous}}
Return the complete corrected contract as clear PLAIN TEXT. No JSON, escaped strings, files/methods arrays or code fences.</step>
  </steps>
  <exit mode="copy">Return the website interface contract unchanged.</exit>
</scenario>

Download XML ↓

EVERY XML ELEMENT / IN FILE ORDER

Every part, briefly.

Short explanations of every element and chat step in this scenario.

01
<scenario>
Names and versions the workflow.
Writing example ↗
02
<inputs>
Declares input values.
Writing example ↗
03
<input>prd
Requires a supplied value.
Writing example ↗
04
<input>previous
Provides an optional value.
Writing example ↗
05
<input>diagnostics
Provides an optional value.
Writing example ↗
06
<input>personality
Provides an optional value.
Writing example ↗
07
<personality>
Optionally styles this child's replies.
Writing example ↗
08
<systemPrompt>
Sets the child's instructions.
Writing example ↗
09
<steps>
Orders the chat turns.
Writing example ↗
10
<step 1>
PRD: {{prd}} Write a precise shared contract for the…
Writing example ↗
11
<step 2>
Check your contract against every PRD requirement and resolve…
Writing example ↗
12
<exit>
Returns the output unchanged.
Writing example ↗

Write a scenario, step by step ↗How sub-agents work ↗