一款節奏明快的瀏覽器物理合成遊戲。讓胖嘟嘟的動物落下、碰撞、合體，再用 Combo、關卡、道具與即時對戰把簡單規則延伸成不同玩法。
🎮 直接試玩： https://chubby-animal-merge.pages.dev/
我喜歡「規則很快就懂，但每次堆疊結果都不同」的物理小遊戲。Chubby 從相同動物碰撞合體的核心開始，慢慢加入關卡成長、Combo、危機道具、AI 自動玩家與 P2P 對戰。
我也希望它打開網址就能玩：不需要安裝、不需要帳號，手機可以觸控，電腦可以用鍵盤。原始碼保持在容易閱讀與修改的 HTML、CSS、JavaScript 結構，方便想研究瀏覽器遊戲的人一起交流。
- 物理合體：相同動物碰撞後進化成下一階，尺寸、反彈、摩擦與堆疊都由 Matter.js 處理。
- 24 階進化資料：前段動物可直接落下，後段角色需要持續合成解鎖。
- Combo 與關卡系統：連續合成會累積 Combo；分數提升後進入新關卡並改變遊戲節奏。
- 四種難度：簡單、中等、困難、超難會調整接觸容差、自動投放時間、反彈與粒子推力。
- 危機道具：炸彈需要快速集能；鐵砧可以在堆疊失控時提供不同解法。
- AI 自動遊玩：AI 會掃描可投放位置、估算合體價值與堆疊高度，並在危急時判斷是否使用道具。
- P2P 即時對戰：使用 Trystero 建立房間，不需要自建遊戲伺服器；雙方可同步分數、關卡與干擾狀態。
- 開發者面板：重力、摩擦、彈性、Combo 時間、動物尺寸與各階權重可即時調整並保存於瀏覽器。
- 手機與 PC 共用：滑鼠、觸控、A/D、方向鍵、空白鍵與 B 鍵都有對應操作。
- 靜態網站交付：不需要前端框架或建置步驟，可直接部署到 Cloudflare Pages。
A/D或←/→：移動投放位置Space：投放動物B：啟動炸彈；啟動後連按Space集能- 遊戲結束後按
Space：重新開始
- 移動滑鼠或手指：選擇投放位置
- 點擊或觸控：投放動物
- 介面按鈕：切換 AI、道具、難度、P2P 與其他功能
| 問題 | Chubby 的處理方式 |
|---|---|
| 合體遊戲容易只剩隨機落下 | 依目前盤面取樣多個 X 位置，估算碰撞、合體價值與落點高度，讓 AI 與玩家都有策略空間 |
| 自動玩家過早浪費炸彈或鐵砧 | 將危險線、持續時間、預估上緣與 Combo 機會一起納入判斷 |
| P2P 需要後端會增加部署負擔 | 使用 Trystero over Nostr 建立房間，遊戲狀態透過瀏覽器點對點同步 |
| 一個按鍵在不同畫面容易衝突 | 空白鍵依狀態分流為投放、炸彈集能或重新開始；炸彈啟動後重複按 B 不會誤觸 |
| 網站更新後可能混用新舊腳本 | 所有執行資源使用同一版本識別，HTML 與腳本要求瀏覽器重新驗證 |
- Vanilla JavaScript / HTML / CSS
- Matter.js 2D physics
- Canvas 2D rendering
- Trystero P2P（Nostr strategy）
- LocalStorage 設定與最高分保存
- Playwright CLI 自動玩家測試
- Cloudflare Pages
需要 Node.js：
npm install
node serve.js專案本身是靜態網站，不需要打包即可執行；npm install 主要提供 CLI 自動玩家使用的 Playwright。
index.html 畫面、樣式與 P2P 模組入口
constants.js 動物資料、難度參數與 Canvas 繪圖
game.js 物理世界、輸入、合體、關卡與對戰狀態
ai.js 瀏覽器內 AI 自動玩家
devboard.js 即時參數調整面板
audio.js 遊戲音效
serve.js 本機靜態伺服器
cli-play.js Playwright CLI 自動遊玩入口
作者：Ivan Wang
我喜歡把簡單的互動規則一路做成完整、可以公開試玩的作品。歡迎直接玩玩看，也歡迎交流瀏覽器物理、遊戲 AI 或 P2P 實作方式。