替貓老闆做管理後台 · 第 01 章

先分清楚管理者要做什麼

從每天會做的任務安排後台區域,讓管理者知道自己在哪裡,以及接下來能做什麼。

貓老闆的簡報

我每天先看待處理訂單,店員常改商品介紹,文章不用每個人都能發布。先把路排清楚。

——貓掌櫃官網的老闆「掌櫃」下需求時的原話

這章做什麼

產出角色與任務表,以及待辦總覽、商品管理、訂單管理、文章管理四個區域的頁面架構。

動手做

  1. 列三種角色的任務:管理者處理待辦、編輯者整理商品與文章、唯讀人員查資料。每項任務寫出要找的資料與完成條件。
  2. 依任務安排四個選單:待辦總覽、商品管理、訂單管理、文章管理。名稱用日常工作的說法,避免用資料表或內部代號命名。
  3. 每頁顯示明確標題與目前選單;列表到編輯頁要有返回路徑,讓管理者知道如何回到原工作。
  4. 先用虛構資料畫出原型,手機上選單可以換行或收合,不能把主要內容擠出畫面。
  5. 把角色表交給 AI,清楚標明哪些只是介面可見性;正式授權必須在後端落實,不因隱藏按鈕就視為安全。

親手試試

貓掌櫃管理後台 · 操作練習

所有資料均為虛構;變更只留在此頁記憶體,重新整理就重設。這是介面示範,沒有真實登入、訂單或後端。

商品管理

已選 0 筆(僅此頁)
虛構商品清單
名稱與編號狀態操作

可試:搜尋、切換狀態、編輯未儲存就返回、勾選停用與還原。唯讀角色只模擬操作限制;正式權限仍須由後端檢查。

圖 C7-01 切換商品、訂單和文章區域,看看標題、資料與操作如何跟著任務改變。

這樣對 AI 說

中文就可以
我要為貓掌櫃設計管理後台。請先列管理者、編輯者與唯讀角色的日常任務、資料範圍和完成條件,再安排待辦總覽、商品管理、訂單管理、文章管理四區。畫出各頁標題、選單位置、目前位置與返回路徑。先以清楚標示的虛構資料做可操作原型,支援手機及鍵盤。標示介面限制與後端授權的差別,先不要自行加入真實帳號或外部服務。

本章驗收清單

先只看選單與標題,確認能找到今天的任務。

  • 每個選單對應明確的管理任務
  • 商品、訂單和文章分工清楚
  • 目前位置與返回方式容易辨識
  • 手機與鍵盤可以切換主要區域
  • 角色可見性與後端權限沒有混為一談

這章的相關詞條

詞條頁都有可以動的示範——卡住的時候,去把名詞弄清楚,回來繼續做。

進度只存在這台瀏覽器,不上傳、不追蹤。