Vibe Coding

航海日誌：AI 艦隊集結，四種代碼引擎的開發實測

同一份 requirement.md，交給四種 AI 開發引擎——Cursor、Claude Code、ChatGPT Codex、Antigravity——來一場真正的「AI 效能海試」，從架構理解力、邏輯保持度到教育友善度，看誰最懂教育者的邏輯。

作為一名推崇 Vibe Coding 的教學航海者，我們不僅要能定義教學的靈魂，更要能駕馭不同的「AI 引擎」來實現它。上一次，我們透過 requirement.md 定義了機率統計網站的藍圖；這一次，我決定進行一場真正的「AI 效能海試」——我將這份需求文件，交付給四種不同的 AI 開發引擎，看看誰能最精準地將我的教學藍圖化為實體。

一、航海任務：四位 AI 副官的參戰名單

Cursor、Claude Code、ChatGPT Codex、Antigravity 四引擎的強項一覽 — 四種開發引擎，各有所長——這場海試比的是「誰最懂教育者的邏輯」。

這場實測的目的，是為了找出哪種工具最能理解「教育者的邏輯」與「互動網站的架構」。我所集結的 AI 艦隊成員如下：

Cursor AI： 目前開發流程的核心，擅長整合式開發與專案級別的語意理解。
Claude Code： 以強大的邏輯推演與程式碼結構重組著稱，是許多開發者心目中的技術極客。
ChatGPT Codex： 經典的代碼生成引擎，在邏輯嚴謹度與函式調用上具備深厚基礎。
Antigravity： 這是我最新的實驗性探索目標，試圖在非傳統的開發環境中挑戰代碼生成的邊界。

二、共同的航行藍圖：`requirement.md`

同一份需求文件交給四種 AI 引擎再三維度評測的方法流程 — 固定同一份 requirement.md 當基準，四引擎各自開發，再用三維度評測。

在所有實測中，我將統一使用以下標準需求，確保評測基準的一致性：


# 專案需求文件：機率統計教學互動網站（修訂版 v2）

## 1. 專案概述
將五大教學模組整合為統一入口網站，邏輯分離、樣式一致，部署於 GitHub Pages。
（原 C 模組「賭場優勢魔術」已刪除。）

## 2. 目錄結構
- `/index.html`：統一導航入口。
- `/css/style.css`：全域樣式定義。
- `/js/main.js`：共用互動邏輯 + 導航欄動態注入。
- `/modules/`：存放五大功能模組頁面。

## 3. 五大頁面詳細功能要求

### A. 鐘形曲線視覺化 (bell_curve.html)
- **功能**：輸入硬幣數量（1–100），計算 C(n, k) 組合數。
- **計算精度**：一律使用 **BigInt** 精確計算組合數（避免 n > 約 53 時超過安全整數而失真）。
- **繪圖**：CSS Flexbox 長條圖；長條高度採 **對數縮放**（否則中央與兩端差距達數十個數量級無法呈現）。
- **數值顯示**：BigInt 結果轉換為科學記號或 K / M / B 縮寫。
- **互動**：硬幣數 > 20 時自動啟用 dense-mode（隱藏細部標籤），優化視覺效能。

### B. 硬幣二項分配分析 (coin.html)
- **功能**：輸入硬幣數量（1–100），分析正面（H）出現次數的機率分布。
- **雙模式（依 n 自動切換）**：
  - **n ≤ 10**：實際窮舉列出每一種組合（如 HHT、HTH、THH…），讓學生「眼見為憑」（2^10 = 1024 種，效能無虞）。
  - **n > 10**：改用組合數公式 C(n,k) / 2^n 直接計算各類機率，不窮舉，瞬間完成。
  - 兩種模式數學結果一致，僅呈現方式不同。
- **視覺**：卡片式列表，具長條圖進度條回饋。

### D. 賭場連續下注模擬 A — 固定平注 (sicbo.html)
- **功能**：固定金額連續下注模擬。
- **使用者可設定參數**：初始本金、每把固定下注額、模擬次數（1–1000）。
- **下注標的**：大 / 小，賠 1:1（開豹子兩邊皆輸，每把勝率約 48.6%）。
- **停止條件**：本金歸零即破產停止。
- **統計**：即時記錄總局數、豹子出現次數、總損益。
- **繪圖**：D3.js (v7) 即時走勢圖，正損益綠色、負損益紅色。

### E. 賭場連續下注模擬 B — 馬丁格爾 (sicbo2.html)
- **功能**：馬丁格爾策略（輸了下注額加倍，贏了重置回初始下注額）。
- **使用者可設定參數**：初始本金、初始下注額、賭桌上限、模擬次數（1–1000）。
- **下注標的**：大 / 小，賠 1:1（同 D）。
- **策略與停止邏輯**：
  1. 本金歸零 → 破產，模擬停止。
  2. 當「應下注額」（加倍後）超過賭桌上限 → 標記為「策略失敗」事件（可重複計次）。
  3. 觸發策略失敗後不停止，改以賭桌上限金額封頂繼續下注。
  4. 封頂下注若贏了 → 重置回初始下注額，回到正常馬丁格爾循環。
- **統計**：同 D，另計「策略失敗（撞桌限）次數」。
- **繪圖**：D3.js (v7) 即時走勢圖（同 D 配色規則）。
- **與 D 對照**：參數介面與邏輯與 D 對齊，僅差「下注額變化方式」（D 固定、E 加倍），供教學對比。

### F. 真實骰子遊戲體驗 (sicbo3.html)
- **功能**：模擬真實賭桌介面，支援完整賠率表。
- **本金概念**：遊戲開始先設定本金；押注扣錢、中獎加錢；直到破產或重玩為止。
- **下注介面（全部注區）**：
  - 大、小
  - 單點 1–6
  - 指定對子 1–6
  - 任意豹子
  - 指定豹子 1–6
  - 兩點組合 domino（15 種）
  - 總和 4–17
  - 採清楚的分區排版處理密集度。
- **同時下注**：可同時在多個注區下注，一次擲骰一起結算。
- **互動**：點擊下注區即時回饋（active class）；90ms interval 擲骰動畫；依賠率表結算。

## 4. Sic Bo 標準賠率表（Wizard of Odds / 拉斯維加斯常見版本）
適用於 D、E（僅大/小）與 F（全部）。

| 下注類型 | 說明 | 賠率 |
|---|---|---|
| 大 (Big) | 總點 11–17，開豹子輸 | 1:1 |
| 小 (Small) | 總點 4–10，開豹子輸 | 1:1 |
| 單點 (Single) | 押某點，出現 1 / 2 / 3 顆 | 1:1 / 2:1 / 3:1 |
| 兩點組合 (Domino) | 兩特定數字同時出現 | 5:1 |
| 指定對子 (Pair) | 指定點數出現至少兩顆 | 10:1 |
| 任意豹子 (Any Triple) | 任意三顆同點 | 30:1 |
| 指定豹子 (Specific Triple) | 指定點數三顆同 | 180:1 |
| 總和 4 或 17 | | 60:1 |
| 總和 5 或 16 | | 30:1 |
| 總和 6 或 15 | | 18:1 |
| 總和 7 或 14 | | 12:1 |
| 總和 8 或 13 | | 8:1 |
| 總和 9 / 10 / 11 / 12 | | 6:1 |

## 5. 統一標準
- **導航欄**：所有頁面引入共用導航欄，由 `main.js` **動態注入**（改一處全站同步），可連回首頁並跳轉其他模組。
- **路徑處理**：部署於 GitHub Pages（子路徑），統一使用**相對路徑**：
  - 首頁引用 `css/style.css`、`js/main.js`；模組頁引用 `../css/style.css`、`../js/main.js`。
  - 導航連結依頁面層級帶對前綴（首頁不加、模組頁加 `../`），由 `main.js` 自動處理。
- **D3.js**：統一使用 v7，CDN 引用維持穩定。
- **檔名統一**：模組檔名統一拼法 sicbo / sicbo2 / sicbo3。