top of page
1.png
2.png

提供平台管理人員管理點餐系統的後台網站。
以現有的點餐系統架構延伸,增加『餐盒歸還』與『團購餐點』...等客製化系統功能。

專案架構

以『環保餐盒外送點餐』為概念發想的校園用的外送系統,校方提供環保餐盒給合作餐廳,校內人士透過點餐網站點餐後,由校方接收訂單並且到合作店家取餐,集合餐點到定點給餐。要介紹的部分為校方管理人員後台管理系統網站,

3.png
4.png

系統目標

-查看所有進行中訂單

-操作訂單狀態
-與餐廳結帳

-編輯所有店家資訊

-管理素速來平台

-紀錄環保餐盒歸還紀錄

-客服聯繫

-開通餐廳帳號

5.png

負責

整合客戶需求 丨 規劃製作流程 丨 介面設計

6.png

流程規劃

7.png
8.png
9.png
10.png
Arrow 139.png

實際體驗運作流程

Arrow 139.png

流程規劃

Arrow 139.png

統一開發規範與機制

討論溝通

製作圖像流程讓團隊與客戶確認整個取餐流程

7.png

​討論溝通

透過簡報溝通,詳細的了解客戶針對系統的需求與背後的原因,確認需求後先設計出一個最小可行性的流程。

8.png

實際體驗運作流程

到校園現場場勘取餐地點與模擬現場透過掃描餐盒QRcode與排隊取餐速度與體驗感受,將設計流程與工作人員實際操作模擬。

12.png

實際操作透過QRcode貼紙掃描與尋找餐盒的時間與流程

內部團隊的訂單流程

9.png

流程規劃

此專案新增的訂單流程與原系統的訂單流程有許多不同之處(管理員會先在不同餐廳取餐集餐、消費者拿到環保餐盒後的歸還...等)。在開發流程前針對訂單狀態的變化與不同使用者(店家、平台後台管理、消費者)的訂單每個不同動作所推動的訂單變化與工程師進行確認。

13.png
10.png

統一開發規範與機制

根據三種不同的取餐方式建立了一套可以統一通用的後台管理樣式,方便日後開發的應用進行維護。

列舉出不同流程與情境,並且比對不同之處,在規劃時拆分

14.png
6.png

介面設計

營運狀況

『營運狀況』當管理人員app無法進行訂單下個動作或是客戶有取消訂單需求時,後台管理人員透過該頁面操作訂單狀態

​通用元件

針對不同狀態的訂單可動作的權限不一樣,設計在不同狀態下皆可通用的元件。在不同的狀態限制用disable的方式隱藏不可進行的動作,統一動作的元件在相同的位置。

列出每個訂單狀態與可操作的動作顯示

16.png

結帳報表

『結帳報表』管理員可篩選日期下載該時段的平台與店家結帳的報表。

17.png
18.png

1

切換訂單時間

依據會計不同的需求(需要在當下查詢客戶是否已入帳或是結帳時),切換訂單下單時間或是訂單完成時間。

18.png

2

切換時間遠近與金額大小排序

可透過時間近到遠與金額大小篩選,可快速得到該月最大單資訊與尋找訂單。

編輯菜單

針對不同店家的菜單詳情設定

可快速用手機調整店家設定

針對緊急調整的設定動作(臨時改變店家營業時間,更動菜單)特別設置使用右側選單,讓管理員即使在沒有桌機可使用的狀態下也可以透過手機調整設定。

6.png

專案回顧

這次專案最具有挑戰性也覺得最有趣的是取餐還餐流程是一個全新的流程發想,在這中間需要考量整個產品營運的商業模式去界定工作人員在不同訂單階段能做的動作權限,這中間必須與開發部門與客戶之間來回確認,有機會實際體驗與工作人員跑過取餐流程是一件非常有趣的體驗。
這次的平台管理網站是經由過去1.0版本的優化與新增客製化功能的版本,在設計的過程中發現了過去的介面設計上一些無法共用的部分,需要尋找適合的套件或是需要重新定義元件的使用,中間與開發部門的討論讓自己針對後台管理的大量資訊整合的設計方式有了許多新的設計看法。

11.png
15.png
19.png
18.png

3

快速下載結帳報表

將『店家營運報表』fix在畫面最下方,讓結帳人員無論瀏覽到那一個部分的訂單資訊,都可以快速得到結帳資訊。

20.png
21.png
22.png
bottom of page