AI 程式設計教程中文版
官方教程中文版學習路線

遊戲開發路線

Codex 結合 image generation,用來建立 browser-based games 和其他型別 games 會很有用。

這一篇用 5 分鐘換什麼:把"用 Codex 做遊戲"從"寫一個遊戲"重新理解成5 步可驗證 loop——先 PLAN.md → 最小 playable loop → UI/controls 微調 → 複雜邏輯配 evaluation → bug triage 與 PR review。讀完後你的遊戲不會停在 demo 程式碼或視覺草稿。

Codex 結合 image generation,用來建立 browser-based games 和其他型別 games 會很有用。

這組 use cases 可以幫助你把 ideas 變成 live games。

遊戲開發路線的關鍵不是“讓 Codex 寫一個遊戲”,而是把遊戲拆成可驗證的 playable loop:plan、rendering、controls、assets、browser testing、bug triage、PR review。每一步都要有可執行結果,否則遊戲很容易停在 demo 程式碼或視覺草稿。

配圖:

適合什麼專案

適合:

  • browser-based game,從 0 到 playable prototype。
  • 需要反覆調 controls、UI feel、timing、visual assets 的遊戲。
  • 需要 imagegen 產出 concept art、sprites、backgrounds、UI assets 的專案。
  • 可以用 Playwright 在真實瀏覽器中測試的遊戲。

不適合:

  • 還沒有明確 core loop 的泛泛創意。
  • 只想生成一堆素材,但沒有 gameplay milestone。
  • 不能本地或預覽環境執行的專案。
  • 需要大型商業 game engine 深度整合,但沒有現成工程約束。

Build the First Playable Loop

讓 Codex 把 game brief 轉成 browser build,並生成 assets、controls 和可測試的 loop。

  • Create browser-based games Use Codex to turn a game brief into first a well-defined plan, and then a real browser-based game. Engineering · Code

官方 use case 建議先讓 Codex 寫 PLAN.md,再進入實現。計劃裡至少包括:

  • player goal
  • main loop
  • inputs and controls
  • win and fail states
  • progression 或 difficulty
  • visual direction
  • stack and hosting assumptions
  • milestone order

一個好的第一階段交付不是“所有功能都完成”,而是玩家能開啟頁面、理解目標、完成一次主要操作,並看到成功或失敗反饋。

Starter prompt

Use $playwright-interactive, $imagegen, and $openai-docs to plan and build a browser game in this repo.
First create PLAN.md with player goal, main loop, controls, win/fail states, visual direction, stack, hosting assumptions, and milestone order.
Then implement the smallest playable loop.
Use Playwright to test the game in a real browser.
Save reusable image prompts under .prompts/ and log implementation decisions under .logs/.

Tune UI and Controls

game 跑起來後,用 Codex 調整 HUD details、menus、controls 和小型 interaction issues。

  • Make granular UI changes Use Codex to make one small UI adjustment at a time in an existing app, verify it in the browser, and keep the change scoped. Front-end · Design

這一階段要避免一次改太多。遊戲 UI 的手感來自小細節:按鈕響應、HUD 層級、鍵盤輸入延遲、失敗反饋、暫停狀態、移動端觸控目標。每次只改一個明確問題,再用瀏覽器驗證。

建議讓 Codex 輸出:

  • 改了哪個 UI/controls 問題。
  • 用什麼 viewport 和輸入方式驗證。
  • 是否影響 keyboard、mouse、touch。
  • 截圖或 Playwright 檢查結果。

Tackle Hard Game Logic

透過 self-evaluation loop,讓 Codex 迭代 complex game algorithms。

  • Iterate on difficult problems Give Codex an evaluation system, such as scripts and reviewable artifacts, so it can keep improving hard logic. Engineering · Analysis

複雜邏輯不要只靠人工試玩。把可計算的部分變成 evaluation:

  • collision detection test
  • pathfinding fixture
  • scoring rule tests
  • level generation seed tests
  • save/load state tests
  • frame timing or event order assertions

Codex 適合在有評價系統時反覆改進。如果沒有 evaluation,它只能憑感覺調整。

Triage Bugs from Real Signals

讓 Codex 在 patch game 前,先彙總 bug reports、failing checks、logs 和 repro notes,形成 prioritized list。

  • Automate bug triage Ask Codex to check recent alerts, issues, failed checks, logs, and chat reports, then tune the triage output. Automation · Quality

遊戲 bug triage 應該把“現象”和“可復現路徑”分開:

欄位示例
SymptomPlayer gets stuck after jumping near wall
Repro stepsOpen level 2, move right, jump at second platform edge
ExpectedPlayer lands or falls
ActualPlayer position freezes
EvidenceConsole log, screenshot, failing fixture
PriorityBlocks main loop

讓 Codex 先整理 bug list,再按優先順序修,質量會比直接讓它“fix all bugs”穩定。

Review Before Merge

讓 GitHub 中的 Codex 自動 review PRs,捕捉 regressions 和 missing tests,加快 deployment。

推薦技術堆疊

官方 browser game use case 給出的預設方向是:

NeedDefault options用途
Web game stackNext.js with Phaser or PixiJS頁面 shell 加 rendering layer
Backend stackFastify, WebSockets, Postgres, Redispersistence、matchmaking、leaderboards、pub/sub
Browser verificationPlaywright interactive真實瀏覽器試玩和斷點檢查
Asset generationImageGenconcept art、sprites、backgrounds、UI assets

如果只是單人小遊戲,不要一開始就上 backend。先完成 local playable loop,再決定是否需要 persistence 或 leaderboard。

完成標準

  • PLAN.md,且定義了 core loop、controls、win/fail states。
  • 遊戲可以在瀏覽器開啟並完成一輪主要玩法。
  • visual assets 的 prompts 可複用,方便繼續擴充套件風格一致的素材。
  • 有 Playwright 或等價瀏覽器驗證記錄。
  • 複雜邏輯有 tests 或 fixtures。
  • bug list 有 repro steps 和 priority。
  • PR review 覆蓋 regressions、missing tests、UI breakpoints。

官方資料

接下來去哪

本頁目錄