從單一提示詞打造可玩的 3D 遊戲
遊戲開發是技術要求最高的創意領域之一——它需要物理、渲染、AI、狀態管理與 UI 全部在同一個程式碼庫中協同運作。這個工作流程證明了,只要有足夠詳細的提示詞與 Gemini 3.1 Pro Preview,Eigent 就能規劃、撰寫並交付一款完整可玩的多檔案瀏覽器遊戲,完全不需要手動撰寫任何程式碼。
設定 Gemini 3.1 Pro Preview
這個工作流程是在錄製當下最強大的 Gemini 3.1 Pro Preview 上執行。要在 Eigent 中設定它,請前往 Settings → Models → Custom Models:
- API Host:
https://generativelanguage.googleapis.com/v1beta/openai/ - Model:
gemini-3.1-pro-preview
Eigent 支援同時設定多個自訂模型——你可以一次配置 Gemini、OpenAI、Anthropic、Qwen、Deepseek、MiniMax 等,並將其中一個設為啟用中的預設模型。
遊戲設計提示詞
詳細的提示詞會產生詳細的結果。這一份提示詞明確指定了機制、視覺風格、計分、特殊事件,甚至特定的收集序列:
建立一款現代 3D 橫向捲軸平台遊戲,靈感來自 Mario,並結合 Snow Bros 機制。玩家可以左右移動與跳躍,發射雪球彈,將怪物逐步凍結成雪球。當完全凍結後,會出現一個「Kick」按鈕,讓雪球在關卡中滾動與反彈,擊敗敵人並觸發連鎖反應。如果使用同一顆雪球清除所有怪物,就會掉落 10,000 分獎勵,或偶爾出現一個發光的蛋糕。收集蛋糕會生成四隻藍色雪怪;擊敗它們可獲得字母 S、N、O、W,收集齊四個後可獲得額外生命。包含計分系統、生命顯示、難度遞增,以及重新開始功能。背景應類似 Mario 風格的世界,具備豐富、分層且視覺複雜的 3D 環境,包括多層地形、裝飾元素與視差深度效果,並呈現平滑、現代且沉浸式的視覺表現。
提示詞中提到的每一項機制,都會在輸出中被實作。
Eigent 規劃並執行建置
Eigent 會為 Developer Agent 建立一個單一任務:
使用 Three.js 開發一款完整可玩的 HTML5/JavaScript 網頁遊戲,結合現代 3D 橫向捲軸平台遊戲視覺與 Snow Bros 遊戲機制——包含發射雪球、敵人凍結與踢飛、連鎖反應獎勵、計分、生命、難度遞增,以及重新開始功能。
Developer Agent 會搭配 Terminal & Shell 工具,以及 Web Deployment 與 Screen Capture 功能,直接將所有遊戲檔案寫入工作區資料夾。
三個檔案,一款完整遊戲
輸出會是三個彼此相依的檔案:
index.html— 進入點與遊戲容器game.js— 所有遊戲邏輯:Three.js 渲染管線、物理、敵人 AI 狀態機、投射物系統、連鎖反應偵測、獎勵掉落邏輯、計分、生命追蹤,以及 SNOW 字母收集序列style.css— 畫布尺寸、UI 疊層、HUD 樣式
Three.js 渲染器會建立一個具備視差深度的分層 3D 環境——背景是雪山,中景是平台,前景是地形,全部搭配程式化 canvas 元素與流暢動畫。
完成後的遊戲會長什麼樣子
在任何現代瀏覽器中開啟 index.html,就會看到一款完整可玩的平台遊戲:
- HUD: 分數計數器、波次計數器、生命顯示,以及 S-N-O-W 字母進度條
- 玩家控制: 左右移動、跳躍、發射雪球彈
- 敵人機制: 漸進式凍結狀態、凍結後踢飛滾動、雪球擊中多個敵人時的連鎖反應
- 獎勵系統: 使用單一雪球全清時掉落 10,000 分獎勵
- 視覺風格: 3D 分層雪山背景、Mario 風格關卡設計、平滑視差捲動
首次載入時的提示文字:"用 Z 凍結敵人。踢飛完全凍結的雪球!"
總使用 token:約 147,000 —— 對於這種複雜度的多檔案遊戲來說相當精簡。
這對 AI 輔助遊戲開發代表什麼
Snow Bros 的機制——凍結、踢飛、連鎖——需要代理程式實作彼此依賴的遊戲狀態:敵人可以是未凍結、部分凍結或完全凍結,而且只有在特定狀態下才會轉變為可滾動的雪球。連鎖反應邏輯則需要偵測滾動雪球與其他敵人之間的碰撞。這些都不是簡單的實作。
Gemini 3.1 Pro 能夠將整個遊戲規格保留在上下文中,並在多個檔案間產生一致且彼此相依的 JavaScript,這正是讓這一切成為可能的關鍵。最終成果不是模板,而是對提示詞中描述的精確機制所打造的客製化實作。
下一步可以試試看
加入第二個可操作角色,使用不同的投射物機制與本機雙人模式。
生成一個關卡編輯器,讓你可以在網格上放置平台與敵人,並將版面匯出為 JSON。
加入會儲存在 localStorage 的高分排行榜。
為同一款遊戲打造支援觸控操作的手機版本。
取得更好結果的技巧
-
精準描述機制。 這個 freeze → kick → chain reaction 機制之所以成功,是因為每個狀態轉換都在提示詞中被明確描述。像「酷炫的敵人互動」這類模糊說法只會產生更簡單的結果。
-
明確指出你的技術選擇。 指定使用「Three.js」進行 3D 渲染,以及「純 HTML/CSS/JS,不使用函式庫」作為結構,能讓 Eigent 得到清楚的實作限制。若沒有這些規範,代理程式可能在不同任務中選擇不同、甚至彼此不相容的方法。
-
先在瀏覽器中檢查,再逐步迭代。 一旦 Eigent 交付檔案,請立刻開啟
index.html並測試核心機制迴圈。這個階段用有針對性的後續提示詞來修正方向,會比一開始就把所有細節都寫死更快。



