最近週末花點時間寫了一個小 Side Project，主要是有時候想用 Gemini 或其他 AI 模型畫圖，但覺得總是缺一個順手的介面，所以就用 Claude Code 生成了一個基於 Nano Banana 提示詞庫的 AI 繪圖工具。
起名叫做 BANANA_R（單純隨便取的），主要就是想做一個自己看起來順眼，然後用起來比較安心的工具。
🔗 專案連結：https://bananar.zeabur.app/
為什麼要自己做？
市面上工具很多，但自己做的好處就是「安心」。
這個專案最大的重點就是資料完全本地化。我自己也很在意隱私，所以設計時確保了所有東西都在瀏覽器端執行：
- API Key：只存在你自己的瀏覽器 localStorage 裡
- 圖片資料：生成完的圖也都存在本機 IndexedDB
簡單說，就是一個純前端的介面，沒有後端伺服器會偷偷儲存你的資料。
核心功能介紹
雖然是 Side Project，但為了自己好用，還是加了一些實用功能：
1. 樣式管理 (Style Library)
常常忘記風格的 Prompt 怎麼下，所以把常用的一些風格（像是 3D、手繪、像素風之類的）整理成標籤，點一下就可以套用，不用每次重打。
這裡面的 Prompt 很多是參考 GitHub 上的 Awesome-Nano-Banana-images 整理過來的，感謝大神們的分享。
2. 本機歷史紀錄
這個是我自己最痛的需求。以前生成過的圖常常關掉網頁就沒了，或者忘了當初參數怎麼設的。
現在這邊會自動把生成的圖和當時的 Prompt 存起來，隨時可以回去翻，也可以直接點擊紀錄把舊的參數叫出來重跑。
使用注意事項
API Key 需求你的 Google API Key 必須是「付費版」（有啟用 Billing 的專案）才能使用。
因為免費版的 Key 權限受限，是沒辦法呼叫這個生圖模型 (Imagen 3) 的。如果只用免費 Key，會無法出圖喔！
寫在最後
這原本只是一個為了測試 API 功能而寫的小工具，後來總覺得好像還缺了點什麼，就這樣一個接一個把功能加了上去，最後變成了現在這種帶點遊戲感的黑底介面。
這就是一個程式設計師的日常產物，分享出來給有需要的人玩玩看。
如果你也是不想把 Key 到處貼、或者喜歡把資料留在自己電腦裡的人，應該會覺得蠻順手的。
👉 立即體驗：https://bananar.zeabur.app/
參考資料：
回報錯字、失效連結，或告訴我你想看的延伸主題。