Theme B · Prototype v2

霽光 / Clearlight

淺色精品科技感:大量留白、精準排版、真實攝影主導;後台採 Stripe 式密度。本原型共 39 頁,所有導覽、側欄、按鈕、麵包屑皆可點擊,表單有驗證,表格可排序與批次選取,手機框內 App 可操作。

Design tokens
字體
Inter Tight(標題)· Inter + Noto Sans TC(內文)· JetBrains Mono(編號/金額)
字級
12 / 13 / 14 / 15 / 16 / 18 / 20 / 24 / 32 / 40 / 56 / 72
間距
8pt 系統:4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96
圓角
4 / 6 / 8 / 12 / 16 / 24 / pill
陰影
4 階,1px 描邊 + 低不透明度投影
01 · 前台(消費者網站)

18 頁

開啟前台
01
首頁Hero、分類、精選、流程、業者、社團、保險、App
02
商城列表分類/價格/品牌篩選、排序、分頁
03
認證業者列表地區、專長篩選、評分
04
業者商城頁自訂頁首、介紹、作品集、商品、評價
05
商品詳情圖庫、規格、施工說明、評價、Q&A
06
下單表單姓名、電話、地址、Email、車型、時段、備註
07
下單成功訂單已送交平台專員+後續流程
08
車友社團動態牆、社團列表
09
貼文詳情內容、留言、回覆
10
車險試算車輛、車主、險種選擇
11
試算結果六家方案比較、明細
12
登入/註冊Email、Apple、Google、驗證錯誤
13
會員中心:我的訂單列表、狀態篩選
14
訂單詳情狀態時間軸、專員、施工資訊
15
我的提問已回覆/待回覆
16
我的車庫車輛、保險到期、施工紀錄
17
業者入駐申請多步驟表單、資格說明
18
搜尋結果商品、業者、貼文混合結果
02 · 平台管理員後台

12 頁

開啟管理員後台
19
儀表板KPI、趨勢圖、待處理事項
20
訂單管理列表篩選、排序、批次操作
21
訂單詳情指派業者、抽成計算、狀態更新、聯絡紀錄
22
消費者管理列表、LTV、標籤
23
消費者詳情購買紀錄、車庫、提問
24
業者管理入駐審核、抽成率設定
25
業者詳情合約、抽成、績效、工單
26
商品審核待審佇列、差異比對、退回原因
27
Q&A 監看逾時未回、檢舉、違規字詞
28
車險試算紀錄試算、轉投保追蹤
29
報表營收、抽成、業者排行、匯出
30
系統設定權限角色、審核規則、通知
03 · 業者後台

7 頁

開啟業者後台
31
總覽工單、提問、商品表現
32
我的商城頁編輯所見即所得區塊編輯器
33
商品管理列表狀態、審核、批次上下架
34
新增/編輯商品圖片、說明、規格、加購、審核規則
35
Q&A 回覆待回覆佇列、回覆範本
36
平台派工單只見施工資訊,不見抽成
37
帳號設定店家資料、人員、通知
04 · Mobile App

1 頁(兩支可操作手機)

38
App 展示頁iOS 與 Android 並排;Tab 可切換,可下單、追蹤訂單
Theme B · 霽光 Clearlight · 原型 v2 · 2026-10-01前台管理員業者App