先看作品，再寫一句目標
打開作品，說出它做什麼、主要檔案在哪裡、要修改哪一塊。不要一開始就要求大改。
使用範圍
- 包含2 本中英童書與 8 個小作品。
- 排除
mini-projects/hermes-agent/任務代理工具不用進入這條路線。 - 目標學會 Codex AI coding 的需求描述、實作、檢查與修正循環。
固定 Prompt 格式
每次請 Codex 做事，都用同一個骨架：目標、檔案位置、功能限制、完成後檢查。這樣比較容易得到可驗證的結果。
請修改 [檔案或目錄]。
目標：[一句話說明要完成什麼]
限制：使用 HTML/CSS/Vanilla JS，不加後端，不引入框架。
功能：[列出 3 到 5 個具體功能]
完成後請檢查：手機版、JS 語法、本機連結、主要操作流程。
Four Stages
四階段練習流程
每個小作品都走同一套流程：準備、執行、檢查、修正。
一次只給 Codex 一個任務
例如新增一頁童書、加一個按鈕、修一個手機版問題。任務越小，越容易檢查。
自己驗證，不只看回覆
確認頁面能開、手機版正常、按鈕能操作、沒有破壞首頁連結。
把問題改成清楚修正任務
例如「手機版右側溢出」比「畫面怪怪的」更容易讓 Codex 修好。
10 Works
10 個學習素材與任務
照順序做。每一格都有「學什麼」、「給 Codex 的 prompt」和「完成後檢查」。
Leo 的學校一天
學什麼：靜態頁、SEO、封面 SVG、頁卡結構、中英對照句。
Prompt：請在 Leo 的學校一天新增第 9 頁，英文句子、繁中翻譯、朗讀提示、單字 chips 與簡單 SVG 插圖都要有。
檢查：第 9 頁出現在頁面最後，手機版不溢出，文字沒有重疊。
Mia 在家的一天
學什麼：沿用既有版型、改主角與情境、保持低幼短句。
Prompt：請把 Mia 童書其中一頁改成「Mia helps Mommy clean up toys」，保留中英對照與朗讀提示。
檢查：英文適合 4 歲親子共讀，插圖內容和句子一致。
英文單字照打練習
學什麼：輸入框、即時比對、資料陣列、狀態提示。
Prompt：請新增 5 個英文單字資料，每個包含中文解釋、用法與例句。
檢查：每個單字都能切換，輸入正確和錯誤時提示正常。
抽籤程式
學什麼：多行文字解析、隨機抽選、紀錄、選項開關。
Prompt：請新增「複製抽籤紀錄」按鈕，把目前紀錄複製到剪貼簿。
檢查：有紀錄時可複製；沒有紀錄時顯示清楚提示。
賓果遊戲
學什麼：5x5 陣列、抽號、標記、Bingo 判斷、房間狀態。
Prompt：請新增「顯示剩餘號碼數」資訊，抽號後即時更新。
檢查：抽號後數字會減少，重新開始會回到 75。
井字遊戲網路版
學什麼：棋盤狀態、勝負判斷、計分、localStorage 同步。
Prompt：請新增「下一局先手切換」功能，上一局 X 先手，下一局改 O 先手。
檢查：重新開局後先手會輪替，計分不會被清掉。
電子白板
學什麼：Canvas、滑鼠與觸控、文字繪製、復原、保存。
Prompt：請新增「橡皮擦模式」，可用同樣的拖曳方式擦除白板內容。
檢查：橡皮擦不影響粉筆顏色選擇，復原仍可用。
打磚塊雙人左右對戰版
學什麼：動畫迴圈、碰撞判斷、道具、鍵盤與觸控。
Prompt：請新增「慢速球」道具，接到後球速降低 6 秒。
檢查：道具被接到後狀態列更新，6 秒後球速恢復。
777 拉霸遊戲
學什麼：亂數、條件判斷、動畫、分數紀錄。
Prompt：請新增「最高分紀錄」，用 localStorage 保存目前最高總分。
檢查：重新整理後最高分仍存在，重新開始不會清掉最高分。
3D 摩天輪網頁
學什麼：CSS 3D、動畫速度、控制項、視覺檢查。
Prompt：請新增「夜晚模式」切換，背景變暗、燈光更明顯。
檢查：切換模式後摩天輪仍旋轉，手機版控制項不重疊。
First Prompt
第一個 Codex 練習：修改 Leo 的學校一天
先從內容型頁面開始，風險低、容易檢查，也能練習看懂既有 HTML 結構。
可直接使用的 prompt
請修改 mini-projects/school-day-picture-book/index.html。
目標：在「Leo 的學校一天」最後新增第 9 頁。
內容：
- 英文句子：Leo packs his school bag for tomorrow.
- 繁中翻譯：Leo 整理明天要用的書包。
- 朗讀提示：packs 是「整理、打包」；tomorrow 是「明天」。
- 單字 chips：pack、school bag、tomorrow
- 新增一張簡單 SVG 插圖，畫面是 Leo 把書放進書包。
限制：
- 使用現有 page-card 結構。
- 不引入外部圖片、框架或後端。
- 保持手機版可讀，不要讓文字或插圖溢出。
完成後請檢查 JavaScript 語法、手機版版面和本機連結。