客戶背景與挑戰
一間典型的小店：有固定客群、有複雜客群，但資源只有一個人。
- 店名
- 吾喵 CAFÉ
- 類型
- 咖啡廳（內用為主、外帶為輔）
- 規模
- 6 桌・單人經營
- 建置方式
- 方案 A 套版客製
實做功能
依店家實際動線挑選、開啟的模組，不是全開。
前台掃碼點餐
客人掃桌上 QR Code 直接進點餐頁，選分類、加購、填備註，送出即成立訂單並自動帶入桌號。介面以手機操作為設計基準。
CSV 訂單匯出
每月一鍵匯出訂單明細，對帳、報稅都方便。資料隨時拿得走，屬於店家自己。
訂單看板
吧台即時顯示新訂單與桌號，出餐後一鍵標記完成，不靠記憶力。
Telegram 推播
新訂單推到手機，離開吧台也知道有單進來。
會員集點
熟客用手機號碼集點，滿額可折抵，回購率提升。
營收 / 熱銷報表
日營收與熱銷排行一覽無遺，進貨與菜單調整有依據。
菜單自行維護
新品上架、價格調整、售完下架，老闆自己點幾下就完成。
行動優先介面
老闆與客人都是一手手機就能完成，不需要另外學系統。
付了錢一定會出單，線上線下永遠對得上
客人最在意的兩件事：付了錢不能漏單、手快按兩次不會被扣兩次；再加上線上改的價格，POS 那邊一定跟得上。
金流狀態同步
付款成功才出單，逾時與退款都有明確狀態，帳不會對不上
- →訂單與金流狀態一對一對應 待付款／已付款／已退款，各自都有畫面與後台標記，不會出現「客人付了錢但系統沒單」。
- →付款確認回呼＋防重複下單 回跳網址帶簽章驗證；同一筆付款重複回呼只認第一次，連點兩次送出也沿用原付款連結，不會重複扣款、重複開單。
- →付款成功才觸發出單流程 Telegram 推播、看板進單、POS 同步全部等付款確認才動作；未付款的單不會混進待製作。
- →金鑰不進網頁 LINE Pay 金鑰放在伺服器環境變數，瀏覽器原始碼裡看不到，客人也無法從前端竄改金額。
- →測試模式與正式模式切換 開發時可切到沙盒測試環境，不會真的收款；正式營業前才關閉。
POS 雙向串接
線上線下同一份資料，一人顧店不必重複操作
- →線上訂單自動寫入 POS 每筆成立的訂單自動成一張銷售收據，不用再手動輸入一次。
- →商品一次對應，價格雙向同步 從 POS 拉商品清單逐一對應（只需設定一次），後續網站改價可同步回 POS。
- →離開吧台也能回寫狀態 推播訊息附「開始製作／完成」按鈕，點一下就改寫網站後台的訂單狀態——手機與後台永遠一致。
- →Telegram 推播＋逾時自動結案 訂單進來手機就響；內用單逾時或到了打烊結單時刻，系統自動標記完成，不會卡著等老闆回來。
- →外送運費與品項對接 運費品項、付款類型 ID 都能在後台指定，POS 收據自動對得上。
這套系統幫你的店做到哪些事
從客人打開手機，到月底對帳，整條流程都有人接住。依你的店的需求挑選開啟，不是全部都開。
客人點餐到出單
最不能出錯的一段：下單、付款、進單、出餐，每一步的狀態都對得上
- 01線上點餐與購物車 七大分類、溫度甜度等規格加購、麵包三選一、套餐組合與優惠規則、備註與桌號自動帶入——客人自己就能點完，不用等你放下手上的事。
- 02結帳與金流狀態同步 未付款／已付款／失敗／退款一一對應，重複點不會重複扣款，付款成功才通知出餐。客人付了錢，單子一定跑不掉。
- 03後台登入與權限分級 系統管理者／店長／店員／會計各看各的，員工不必共用一個密碼；有人離職停用帳號就好，不用全面換密碼。
- 04訂單與訂位資料管理 訂單列表、歷史留存、區間篩選與 CSV 匯出，月底對帳、報稅都拿得走；線上訂位含日期時段、剩餘名額自動計算，公休時段自動鎖住。
- 05POS 雙向串接 線上訂單自動寫入 POS 成銷售收據，商品設定一次就好，之後網站改價會同步回 POS——線上線下是同一份資料，不會兩邊打架。
多賺一點的擴充模組
把空檔時段、回購與外送，都變成收入
- 06手作課程報名 多場次、多日期、開放報名與自動下架，後台新增即同步到官網，不用再逐一通知。
- 07會員集點與核銷 LINE 集點卡自動同步、核銷扣點、結帳直接折抵，熟客愈來愈常回來。
- 08場地租借 非營業時段也能收費，不開店的時間照樣有收入。
- 09配送與外送運費 運費品項對接 POS，收送範圍自己設定，訂單金額算得清楚。
讓客人願意上門
除了菜單頁，再附一頁式形象官網，讓第一次來的客人先認識你的店
- 10品牌官網 品牌故事、豆單風味牆、店內快照、主廚筆記、來店資訊、周邊景點，手機與桌機都好看。
- 11主頁內容後台化 文案、區塊順序、照片牆都能在後台改，不必動程式、不必重新部署。
- 12結帳後引導 完成頁推薦主頁或 LINE 官方帳號，把一次消費變成長期回訪。
- A費用固定，不用被抽成 點餐、訂位、會員、課程都在自己的系統裡，沒有每筆訂單抽成，也沒有月租年年漲的風險，成本自己抓得準。
- B資料是店家的 訂單、會員、備份檔都能匯出帶走，換系統不必從零開始。
- C速度快、故障率低 整站跑在 Cloudflare 的託管服務上（含資料庫與自動排程），台灣訪客連線快、掛掉機率低，長期成本也抓得住。
- D之後要長大不用重做 點餐、後台、課程報名都在同一套基礎上，日後想加功能或接新的通路，是往上加而不是推倒重來。
- E後台自己就能改 菜單、價格、標籤、課程、文案、照片——老闆不必再找外部處理。
| 類別 | 模組 | 對店家的實際價值 |
|---|---|---|
| 核心 🔥 | 線上點餐＋金流狀態同步 | 整套系統最核心的一環，客人下單、付款、出單都靠它 |
| 核心 🔥 | 後台登入與三層權限 | 所有後台功能的安全骨架，員工不必共用一個密碼 |
| 核心 🔥 | 訂單／訂位資料管理 | 營運數據來源，能做統計、對帳、熱銷分析 |
| 核心 🔥 | POS 雙向串接 | 商品從 POS 匯入、價格同步回 POS，線上線下不打結 |
| 擴充 ⚡ | 課程報名、場地租借 | 把非營業時段也變成收入，不開店的時間照樣能收費 |
| 加值 📄 | 品牌官網前台 | 讓第一次來的客人先認識你的店，願意走進來 |
解決了哪些痛點
同一間店，同一位老闆，流程改變前後的差別。
尖峰時段漏單
客人口頭點餐，老闆忙著做飲料，轉頭就忘記細節，客人等到脾氣上來。
訂單自己跑進看板
白紙黑字寫在看板與手機通知裡，備註、桌號都在，不會漏、也不會忘。
一人分飾多角
點餐、出餐、結帳全擠在同一個人身上，越忙越亂。
點餐交給客人
客人自己下單，老闆專心出餐與把關品質，壓力小很多。
改菜單要找人
換季調價還要另外聯絡處理，常常拖好幾天，新品也來不及上架。
後台自己改
品項、價格、售完開關，後台點一點就完成，當天就能上架。
平台抽成與月租
用大型訂餐平台，每月固定支出，旺季利潤被吃掉一塊。
系統自建、零月租
一次建置費，之後沒有長期月租，成本固定可控。
Demo 連結
點進去看實際操作畫面，比什麼文案都有說服力。
一頁式形象官網：cerulean-druid-7f1d9d.netlify.app/home
前台線上點餐：cerulean-druid-7f1d9d.netlify.app
※ Demo 為外部連結，本頁不嵌入任何點餐功能，僅提供連結。
同場另外接的一頁式形象官網
除了點餐系統，我也替同一家店做了一頁式的品牌官網——讓客人不只想點餐，也想認識這間店。
- 01把店的個性講清楚 自家烘焙、雙貓店貓、手沖與甜點，一頁看完，不用點進任何連結。
- 02豆單就是菜單 單品豆風味牆、店裡吃什麼、店內快照，讓人先被吸引再來點單。
- 03不只賣咖啡 手作課程、場地租借、主廚筆記，把店能賺錢的路徑都放進來。
- 04手機優先 以手機閱讀為基準排版，桌機再自動展開成兩欄。
- 05與點餐系統同源 同一套建置、同一個網址底層，維護一次兩邊同步。
實機畫面
以下全部是吾喵 CAFÉ 線上正式站的實際畫面，不是示意圖、不是模擬資料。
老闆用的後台
訂單、報表、菜單、營運設定都在同一個後台；手機、平板、桌機都能開。
※ 以上皆為線上正式站的實機截圖，顧客姓名、電話、訂單編號等個資已遮蔽。