Build it

1. Start a fresh chat in your tool (card 09).
   • Level 3 ■ Black: first sketch the architecture on paper: the screens, in order; what it stores (nothing, unless your target rung is Remember); the files (one self-contained HTML file, unless your spec needs more). Then start the agent in an empty folder, paste your spec with the plan-first prompt (card 12), and compare its plan with your sketch before you say go.
2. Optional, AI chat tools only (2 minutes): ask for three lists first (prompt below). Correct what the tool has assumed before it builds anything. Skip this step in Canva. At Level 3 ■ Black, the plan-first prompt does this job.
3. Predict before you look. Write down three things you expect to see and one thing you expect it to get wrong. This is the "Predict" in PRIMM (Predict, Run, Investigate, Modify, Make).
4. Paste your prompt (table above).
5. Open it and compare with your prediction. Use the tool's preview, or save the code as a .html file and open it in a browser (card 09). Then run your success checks, one at a time, exactly as written. Save it as [toolname]-v1.html before you change anything.
   • Level 1 ● Blue in Canva: Canva builds straight away. Open the preview. Your save point is the version number.

Everyone, wherever you have got to:

1. Save a version: download the file, or copy the link. Level 3 ■ Black: commit, or, if Git isn't installed, save a numbered copy such as -v1.html (card 12). Level 1 ● Blue in Canva: Your save point is the version number.
2. Rate yourself:

Switching level is normal here, up or down (card 01).

Before you build anything, read my brief below and show me three lists:
FOUND: what my brief tells you.
ASSUMED: what you are inferring that I should check.
STILL NEEDED: what is missing before you can build it well.
Do not build until I reply "approved".

MY BRIEF:
[PASTE YOUR BRIEF]

Adapted from the Found, Assumed and Still needed lists in Alex Gray, What an AI Teaching Workflow Looks Like.

For Level 2 ▲ Orange. Level 1 ● Blue: your fill-in-the-blanks spec already carries the key rules. Level 3 ■ Black: use the plan-first prompt on card 12.

Build the classroom tool described in my brief below as ONE self-contained HTML file.

THE FILE
- HTML, CSS and JavaScript all in one file. No external libraries, fonts, images or links.
- Works in any modern browser, offline, on a laptop or a phone.
- No login or sign-up. Nothing students type is saved or sent anywhere.
- No calls to any AI service or other website.

THE LEARNING DESIGN
- Students predict, choose or explain before any answer or result is revealed.
- All feedback says why an answer is right or wrong and what to do next. No praise-only feedback.
- Nothing decorative: no confetti, emoji, sound effects, stock images, points, streaks, leaderboards or timers, unless my brief says they serve the goal.
- One idea per screen. Labels sit next to what they name. Motion only when the idea is about change.
- For a simulation or model: only the controls my brief names, and each change shows its effect straight away.
- End with at least one question students answer from memory.
- After two wrong tries on a question, it says "Ask your teacher" or shows a worked example.

ACCESS
- Text contrast of at least 4.5:1 against its background.
- Colour is never the only signal: right and wrong are also shown in words.
- Everything works with the keyboard alone, with a clearly visible focus outline.
- Works at 320 pixels wide with no sideways scrolling. Buttons at least 24 by 24 pixels.
- Alt text on every image or diagram. A visible label on every input.
- Any timer can be turned off, adjusted or extended. Anything that moves for more than 5 seconds can be paused. Nothing flashes.
- Anything students drag can also be done by clicking.

WHEN YOU HAVE FINISHED
1. List every fact, answer, formula, constant and unit in the file, so I can check each one by hand.
2. List anything in my brief you were unsure about, and what you assumed.
3. Do not add anything my brief does not ask for.

MY BRIEF:
[PASTE YOUR BRIEF]

Where the rules come from. Card 08 names the research behind each rule. Access: WCAG 2.2.

• Blank page or an error: copy the error message, or describe what you see, and use card 06.
• Code but no preview: use the universal fallback on card 09.
• It ignored part of the spec: do not start again. Log it (card 05) and fix one thing at a time (card 06).
• You hit a usage limit: move to another tool. Paste your spec, and your latest saved file if you have one.

For anyone who would rather start from one of the four working starter tools and change it for their class.

Below are a working classroom tool (an HTML file) and my brief for adapting it for my class. Make only the changes my brief lists, starting with this one: [first change]. Keep the rules already in the file: no login, nothing saved or sent, no calls to AI or other websites.
Keep everything else unchanged. Explain what you changed and how I'd check it.

MY BRIEF:
[PASTE THE STARTER'S BRIEF, WITH YOUR BLANKS FILLED IN]

THE STARTER FILE:
[PASTE ALL OF THE STARTER'S CODE]

"The prompt is not the impressive part. The judgement is."

Alex Gray, I Gave ChatGPT a Week to Build My App