CASE STUDY · BUSINESS APPLICATION

早餐店解決方案|線上點餐與自動列印出餐紙

為基隆在地傳統早餐店「美味香」量身打造。從深入真實小本營運場景出發,克服缺工與多工混亂,以零抽成、免裝大型 POS 的敏捷架構,實現 QR Code 掃碼、語音提醒與自動出單。

角色職責 UX/UI 設計 · 開發
服務對象 基隆「美味香」
核心技術 Next.js · Supabase
成果指標 漏單率歸零

情境與痛點

真實世界的微型餐飲困境

不是每家店都需要龐大的企業軟體,小本經營有其獨特的生存法則與硬性限制。

🏪

情境:小本經營與毛利限制

基隆在地傳統早餐店,主打銅板平價美食,毛利率低。市售主流外送或線上點餐平台每筆抽成高達 20%~35%,且伴隨昂貴的硬體月租與合約綁定,微型店家根本無法承受。

問題:缺工與尖峰多工混亂

餐飲基層員工極難招募。早晨尖峰 7:00~9:00 上班族湧現,現場人員只有兩三人,必須一邊煎台顧火、一邊招呼現場排隊、一邊接聽訂購電話,還要手寫算錢,極度容易漏單、做錯餐或手忙腳亂。

🎯

期待:輕量、自動化、零干擾

導入桌邊掃碼與外帶線上預約;拒絕沉重昂貴的 POS 系統,改為純網頁輕量架構;整合熱感出單機直接列印出餐廚房單,並於新單送達時以語音蜂鳴通知現場,免去盯螢幕的負擔。

架構與安全機制

雙軌權限與現場防呆架構

針對油煙廚房現場與店長管理維護,設計清晰分離的權限與操作模式。

現場設備 · 員工端

現場專用 Windows Pad

店內煎台旁配備一台觸控 Pad,在充滿油煙與快節奏的環境下運作。以「極簡防呆、不犯錯」為 UX 第一準則:

  • 專屬帳號密碼登入:免去個人綁定困擾,值班人員快速簽入。
  • 資料嚴格限縮:僅開放查看「當日現有」與「明日預約」訂單,隱藏歷史財務與營業機密。
  • 觸控特大操作鍵:接單、完成出餐一指搞定,適應指尖戴手套或沾附水分情境。
  • QZ Tray 靜默列印:本機橋接 Epson 熱感出單機,按下確認即刻出單切紙。
  • Web Audio 即時聲效:新訂單推送即發出清脆提示音,不漏接任何外帶預約。
管理者後台 · 店長專用

雲端 Admin 營運後台

店長可使用手機或筆電隨時登入,進行菜單定價、促銷與系統參數控管:

  • Google OAuth 企業級認證:透過 NextAuth 整合 Google 帳號授權,杜絕密碼外流。
  • 彈性菜單與價格管理:支援分類、品項、加料價格即時修改,秒級同步前台。
  • Vercel Blob 圖片管線:拍照直傳雲端儲存,提供一鍵清除錯圖與快取刷新。
  • Uber 式上架/先隱藏切換:當日某食材售罄(如蘿蔔糕),後台一鍵切換下架隱藏。
  • 出單小語與祝福詞設定:自訂熱感出餐紙底部的溫馨小語(如「祝您有美好的一天!」)。
  • 行事曆與營業時間:整合政府行事曆,自訂國定假日、彈性補班與店休排程。

用戶旅程設計

零摩擦的端到端體驗

顧客只要 3 步即可完成點餐;現場人員無須分心抄寫,專注於出餐美味。

1 STEP 01

桌邊/外帶 掃碼即開

顧客用相機掃描桌上貼紙或外帶立牌,系統自動代入桌號,免下載直接瀏覽菜單。

2 STEP 02

視覺化選餐與加料

熱門品項附高畫質照片,飲料冰塊、加料直覺點選,購物車三欄對齊金額清楚明瞭。

3 STEP 03

語音提醒+自動出單

顧客送出訂單瞬間,店內 Pad 響起提示聲;QZ Tray 自動列印出廚房單與客聯。

4 STEP 04

即時取餐進度

顧客手機自動跳轉狀態頁,掌握「製作中」或「已完成」,免去大聲呼喊桌號。

線上正式站

美味香早餐點餐系統

目前正式上線運行,歡迎直接體驗顧客點餐流程。

前往客戶網站
返回我的專案列表