這是什麼?
「換鈔小幫手」是一個專為農曆新年設計的網頁應用程式,解決了每年包紅包時最頭痛的問題:「到底要換幾張一千、五百和一百?」
在去銀行排隊換新鈔之前,使用者可以先將所有要包的對象(爺爺、奶奶、父母、晚輩...)和金額輸入進去,App 會自動計算出每個人需要的鈔票組合,並幫你加總好「總共需要換幾張」。再也不用拿著爛爛的紙條在櫃檯前手忙腳亂按計算機了!
特色功能
- ✨ 自動換鈔計算:輸入金額,自動拆解成 1000 元、500 元、100 元的最佳組合。
- 🚫 「不要 500」選項:考慮到習俗(或單純不喜歡),每個紅包都可以個別設定「不拿 500 元鈔票」,系統會自動全部轉成 100 元 (或 1000+100)。
- 🧾 收據式清單保存:一鍵產生精美的「換鈔清單」圖片,排版整齊如超市收據,方便存在手機隨時查看。
- 🎨 現代格調設計:捨棄傳統俗氣的設計,採用 Glassmorphism (毛玻璃) 風格,搭配 2026 馬年主題,讓工具也能賞心悅目。
- 🔒 隱私安全:純前端運作,資料只存在使用者的瀏覽器中,不會上傳伺服器。
使用的 AI 工具
- Google Gemini (Antigravity Agent):全程與 AI 協作開發。從 UI 設計發想、React 程式碼撰寫、Debug (修復截圖跑版問題),到最後的宣傳圖生成,都是通過與 AI 對話完成。
開發心得
這是一次非常有趣的 Vibe Coding 體驗!
最特別的挑戰在於「所見即所得」。一開始我們試圖直接對螢幕截圖,但發現不同裝置的字型渲染會導致「截圖跑版」或「字體模糊」。後來我們決定採用 「隱藏式專用匯出視圖 (Hidden Export View)」 的策略——在背景預先渲染好一個排版完美的表格 (Table Layout),當使用者按下保存時,直接捕捉那個完美的視圖,而不是螢幕上可能有捲軸的畫面。
截圖 / Demo
