現場的問題
一份訂單,三趟路。
用傳統桌機 POS 的餐廳裡,同樣的場景整天上演:服務生在桌邊用紙筆記下點單,走回櫃台排隊輸入,再走回桌邊確認。高峰期這些來回累積起來,直接拖慢點餐、出菜與翻台 —— 而一旦斷網或停電,櫃台那台桌機會讓整家店跟著停擺。Mobile POS 要解決的正是這兩件事:讓點餐和結帳發生在桌邊,並讓系統在網路不穩時依然可靠。
Overview
上線三個月內,64% 的結帳從櫃台移到了桌邊。
Mobile POS 讓點餐、送廚、結帳都發生在桌邊,而不是櫃台。整個產品圍繞一個核心問題:如何把桌機 POS 的核心流程裝進一塊手機螢幕 —— 讓服務生單手、快速、不出錯地完成桌邊工作?
限制條件:手機螢幕承載不了桌機 POS 的完整功能;交互體驗對標 Toast GO。
關鍵取捨:只把高頻的桌邊流程搬上手機,其餘功能保留在櫃台桌機 POS 上操作。
問題
一份訂單要走三趟 —— 點餐和結帳被綁在櫃台,斷網時整家店跟著停擺。
方法
只把高頻桌邊流程搬上手機,用交互原則、色彩語言和組件系統,做到「盲操作也不出錯」。
成果
上線三個月,64% 的結帳離開櫃台 —— 再也沒回去。
Process
為誰而做
受過訓練的服務生,靠肌肉記憶操作。
Mobile POS 的用戶是受過培訓的餐廳服務生,但工作環境是高壓的:噪音、趕時間、客人直視、站立、單手持機。因此設計目標不是「第一眼看懂」,而是訓練後能盲操作、高峰期不出錯 —— 操作位置固定、路徑最短、風險操作有防護。這允許比消費級產品更高的資訊密度,但對操作一致性的要求也嚴苛得多。
研究
對標、盤點,以及看真實的手。
- 對標 Toast GO —— 隨時可查看的桌餐帳單(按支付狀態分頁),成為訂單歷史功能的重要參考
- 盤點桌機 POS 的完整功能清單:哪些必須搬上手機、哪些留在櫃台
- 觀察員工在真實門店的用法 —— 通常左手拿設備、右手操作、站著使用
決策一
功能取捨 —— 什麼值得裝進口袋。
我們按「桌邊發生的頻率」篩選:點餐、結帳、訂單管理等高頻流程完整搬上手機、一步直達;低頻或複雜的功能被有意捨棄,保留在櫃台桌機上操作。代價是功能不完整 —— 但 Mobile POS 的定位從來不是取代桌機,而是把值得隨身攜帶的那部分做到極致:服務生手裡的設備越輕,桌邊的服務越快。
決策二
一塊螢幕,兩種觀眾。
Mobile POS 有一個桌機永遠不會面對的時刻:結帳時,設備會轉向顧客。螢幕的觀眾從「受過訓練的員工」瞬間切換成「零培訓的顧客」—— 而且顧客是在服務生站在身旁的社交情境下選小費、簽名。因此員工側介面追求資訊密度與效率,而顧客面向的支付與小費介面刻意做到極簡、金額清晰 —— 經過多輪評審打磨,避免顧客在壓力情境下產生困惑或尷尬。
決策三
為「被打斷」而設計。
辦公軟體假設用戶能專注走完一個流程,餐廳現場恰恰相反:點單點到一半,隔壁桌呼叫、廚房傳話、顧客改主意都是常態。因此所有核心流程都要能安全中斷、隨時恢復:未提交的訂單保留在原狀態,服務生處理完插入事務後從中斷處繼續,而不是從頭再來。
決策四
顏色是比文字更快的資訊通道。
高壓環境裡,「找資訊」的成本必須壓到最低 —— 因此一套色彩語言貫穿整個系統:
- 桌台狀態 —— 空桌、用餐中、超時各有專屬狀態色:掃一眼讀完全場,不必逐桌閱讀
- 菜品品類 —— 海鮮、飲品、招牌特色各有專屬顏色:在上百道菜的按鈕網格裡,「找菜」從逐個閱讀變成掃視定位 —— 先鎖顏色,再讀菜名
- 數字鍵盤 —— 從線框改成色塊,直覺上就是可點擊的
交互原則
貫穿每個畫面的規則。
- 操作路徑最短,不做多餘的操作
- 需要輸入的地方,一定自動喚起鍵盤
- 拇指移動路徑最短,盡量做到單手操作
- 重要且不可撤回的操作刻意增加難度 —— Void 與 Discount 需要 PIN 驗證:在所有原則都追求最短路徑的系統裡,這是唯一一處反向設計,用「慢」換「安全」
- 按鈕位置與狀態保持一致,降低尋找成本
落到細節:抽屜改成拇指可達的彈窗、Confirm 與 Done 的文案分工、精簡備註輸入路徑 —— 小改動,卻決定服務生在忙亂環境中能否快速準確地操作。
設計系統
把決策鎖進組件。
面對幾十個功能頁面的移植工作,逐頁繪製既慢又無法保證一致。因此我為 Mobile POS 搭建了組件化的設計系統:
- 組件變體:按鈕、輸入框、彈窗、列表項的 Variant 體系,覆蓋尺寸、狀態與使用場景
- 語義化色彩:顏色按用途定義,Light / Dark 雙主題共用同一套組件結構
- 交互規範內建於組件:新頁面使用組件就自動繼承規範,不靠設計師自覺
頁面設計從「逐頁繪製」變成「組裝組件」,設計與工程之間有了單一可信來源。
Solution
跟著服務生的完整服務動線。
01 帶位與桌台管理
桌台視圖還原門店實際佈局,列表視圖快速檢索訂單;選定桌台後,所有操作都歸屬這張桌子,訂單不會張冠李戴。
02 桌邊點餐與客製化
客人話音剛落,訂單已即時送進廚房 —— 加料、忌口、特殊要求當場錄入。
03 上菜節奏控制(Delay Send)
客人想先吃前菜、後吃拉麵,但拉麵出餐更快。服務生可為指定菜品設定延遲送廚,讓廚房按客人期待的節奏出菜,而不是按出餐速度。
04 前廳後廚即時聯動(KDS)
訂單從桌邊發出,直接出現在後廚螢幕;出餐狀態同步回傳手持端 —— 前廳後廚不再靠口頭傳話和紙本單據。
05 桌邊結帳:拆單與彈性支付
一桌多人可拆分帳單分別支付;非接觸卡、數位錢包、禮品卡、會員積分折抵全部支援。小費選擇與支付在同一流程內完成。
06 掃盤結帳
針對迴轉壽司業態,每個盤子帶有可掃描標識。服務生用 Mobile POS 對著一疊盤子掃描,即可一次核算用量並直接結帳 —— 徹底取代人工數盤。
+ 全天候可靠
主動線之外:訂單歷史按 Open / Authed / Closed 分頁,可直接編輯、支付、退款、補印;Light / Dark 雙主題應對午市窗邊與晚市酒吧區的光線差異;離線可靠性讓核心點餐與結帳在網路不穩、甚至系統宕機時繼續運作,恢復後自動同步 —— 回應「問題」裡櫃台停擺的另一半承諾。
Impact
結帳離開了櫃台 —— 再也沒回去。
上線後最直接的變化發生在結帳環節:三個月內,64% 的結帳從櫃台桌機轉移到桌邊的 Mobile POS 完成。服務生不再為結帳來回奔波,客人從示意結帳到離店的等待時間被實質壓縮。掃盤結帳則把迴轉壽司的結帳從人工數盤變成掃描即完成。
行業參考(非本案實測):手持 POS 配合合理的流程設計,通常能帶來 15–35% 的翻台效率提升 —— 而介面設計正是這一切落地的前提。如果服務生在桌邊手忙腳亂,客人只會要求回櫃台結帳。
64%
結帳移到桌邊完成
上線三個月內,相對櫃台桌機 POS 的統計
0
人工數盤
迴轉壽司結帳變成「掃描即完成」
15–35%
翻台效率提升 — 行業基準
手持 POS 搭配良好流程設計的研究區間,非本案實測
Reflection
原則先於畫面 —— 而「不出錯」比「好看」重要。
把桌面系統搬到手機上,最大的陷阱是逐頁「縮小」而不是重新「設計」。先確立原則,幾十個頁面的移植就從「重新爭論」變成「套用原則」。而在高壓使用場景裡,「不出錯」遠比「好看」重要:那些評審會上看似很小的改動,實際決定了一線人員高峰期能否盲操作。
如果重來一次,我會更早推動在真實門店做小規模實地觀察與測試 —— 強光下的可讀性、油手指的誤觸,只有真實環境才會暴露。