夾錢，香港人嘅世紀難題
八個人食飯，埋單 $2,347。有人淨係飲咗茶、有人叫咗支酒、有人中途走咗、加一服務費點攤…… 最後一定係有個人攞住張單撳計數機撳五分鐘，全枱人等佢，計完仲有人嗌「唔啱喎」。
分帳 App 大把，但要全枱人都裝同一個 App、註冊、開群組 —— 為一餐飯搞咁多嘢？自己整一個：打開網頁，逐碟餸輸入邊個有份食，一撳列出每人俾幾多，send 個截圖上群組就收錢。
成品功能預覽
- 👥 輸入所有人名（例如：明、欣、Jason、阿May）
- 🍜 逐項輸入：項目名、金額、剔選邊幾個有份
- 🧾 加一服務費自動攤分（可以自己較百分比）
- 💸 一撳出結果：每人應俾幾多，列到清清楚楚
- 📋 「複製結果」掣，即刻貼上 WhatsApp 群組
第一步：複製 Prompt 俾 AI
開啟 ChatGPT、Claude 或 Kimi，成段複製貼上：
【角色】你係資深前端工程師，擅長設計簡潔實用嘅生活計算工具。
【任務】生成一個「飯局AA制分帳器」網站，單一 HTML 檔案，可直接開啟使用。
【目標用戶】香港人，同朋友食飯夾錢用
【功能規格】
- 第一步區域：輸入參與者名單，撳「加入」逐個加，顯示成一排人名標籤，可以刪除
- 第二步區域：逐項消費輸入——項目名稱、金額、剔選邊幾個參與者有份（預設全剔）
- 消費項目列表顯示喺下面，可以刪除
- 服務費設定：一個輸入框較百分比（預設 10%），自動按每人消費比例攤分
- 撳「計算」後顯示結果：每個人名 + 佢有份嘅項目小計 + 服務費 + 應付總額
- 結果底部顯示全單總數，方便對單
- 「複製結果」按鈕：將結果變成純文字（例如「明：$325.5（項目 $296 + 加一 $29.5）」），方便貼上 WhatsApp
- 金額顯示到小數點後一位
- 用 localStorage 記住人名單，下次開唔使再入
【設計要求】
- 簡潔風格，流程由上至下好清晰
- 手機優先設計（響應式），喺餐廳用電話撳為主
- 人名標籤用彩色圓角設計，每人一隻色，結果都跟返隻色
- 按鈕要夠大
【技術限制】
- 單一 HTML 檔案，內嵌 CSS + JavaScript
- 唔使用外部圖片或框架
- 支援離線使用
- 程式碼要有中文註釋
【輸出】
請輸出完整 HTML code，我會直接儲存為 .html 檔案使用。
第二步：儲存做 HTML 檔案
1
複製 AI 輸出嘅完整代碼
由 <!DOCTYPE html> 到最後 </html>，一行都唔好漏。
2
記事本貼上，另存新檔
檔名 split-bill.html，儲存類型揀「所有檔案」，編碼 UTF-8。
3
雙擊開啟，模擬一餐飯試計
入幾個名、入幾碟餸、撳計算 —— 對一對總數同你入嘅項目夾唔夾。
第三步：放上手機，飯局實戰
將個檔案 WhatsApp 俾自己，手機瀏覽器開啟 → 「加到主畫面」。埋單嗰陣攞出嚟，逐碟輸入，一撳出數，「複製結果」貼上群組 —— 全個過程一分鐘，仲型過係咁撳計數機。
成班固定朋友成日食飯？人名單會自動記住，下次開直接用。想再勁啲，同 AI 講「加個記錄功能，儲低每次飯局邊個俾咗未」。
按需要微調（直接同 AI 講）
- 「加個『邊個先找咗數』功能，自動計其他人要過數俾佢幾多」
- 「結果加埋 PayMe / FPS 收款提示字眼」
- 「有人中途走咗打八折計，加個折扣選項」
- 「加個旅行模式：多條數夾埋一齊，最後總結邊個欠邊個」
常見問題 FAQ
Q：同 Splitwise 之類嘅 App 有咩分別？
A：Splitwise 要全枱人裝 App 開帳號先入到數。呢個係你一部機搞掂，計完 send 個結果就得 —— 一餐飯嘅場景，快就係王道。長期旅行夾錢先考慮嗰類 App。
Q：加一服務費點攤先公平？
A：預設係按每人消費比例攤（食多啲俾多啲加一），呢個係最公平嘅做法。想平均攤都得，同 AI 講「服務費改為按人頭平均攤分」。
Q：啲數會唔會儲上網俾人睇到？
A：唔會。所有計算喺你部機嘅瀏覽器做，人名同金額都唔會離開你部機 —— 食咗幾多錢飯，得你知。
總結
夾錢唔再係飯局嘅尷尬位。自己整嘅分帳器，規則自己定 —— 唔均分、加一、有人早走，全部一撳計清。想再玩多啲計數工具？睇埋 匯率換算器 同 BMI 健康計算機 教學。