60 秒決策
先確認使用者要完成的事。
適合使用
- 系統確實持續處理,但目前沒有可靠總量、百分比或完成時間。
- 需要比小 Spinner 更明確地呈現一段長一點的同步、搜尋或處理正在前進。
不適合使用
- 已經有可計算進度;此時應顯示一般 Progress Bar。
- 初次載入固定版型的內容;Skeleton 比一條移動線更能保留畫面脈絡。
畫面要說清楚的事
不要只交代外觀,也要交代資料與輸入規則。
明說完成度未知
文字要承認「完成時間尚未可預估」,不要讓動畫暗示一個不存在的百分比。
用線性動態表示持續處理
移動線能表示工作仍在進行,但不能被當成數值進度條。
取得資料後切換元件
一旦知道工作量,就改用帶值的 Progress Bar,讓等待資訊更有用。
必要狀態與回應
每個狀態都要讓使用者知道下一步。
尚未同步
同步入口可用,畫面說明上一次完成時間。
完成度未知
不定進度列出現,沒有 aria-valuenow,也不顯示假百分比。
取得進度資訊
若系統之後知道總量,可無縫切換為一般 Progress Bar。
同步完成或失敗
停止動態並顯示結果或重試方法,不能讓線條一直移動。
操作 Demo
先知道要觀察什麼,再動手操作。
操作前先知道
同步權限資料
先觀察:不定進度列是否承認完成度未知,且不以不真實數字取代可理解的處理文字。
操作:點選「同步外部目錄」。
預期結果:線性載入列開始移動,文字說明尚無法預估完成時間;同步結束後動態停止並回報結果。
Indeterminate Progress Demo
系統正在前進,但還不能誠實地說出百分比外部目錄同步
上次同步:今天 09:12權限資料尚未開始同步。
尚未開始這項載入示範。
告訴 AI
把任務、規則、狀態與操作條件一次寫清楚。
在 LumenDesk 同步外部目錄時,顯示不定進度列與文字「正在同步權限資料,完成時間尚未可預估」。這個元件表示工作確實在進行,但不要顯示虛假的百分比,也不要設定 aria-valuenow。若之後取得可靠完成度,可切換為一般 Progress Bar;同步完成後收起不定進度列並用 status 訊息說明結果。驗收清單
不要只確認欄位能不能點。
- 完成度是否真的未知?
- 是否避免顯示假百分比與 aria-valuenow?
- 處理文字是否說出正在同步什麼?
- 使用者是否能分辨它和數值 Progress Bar?
- 取得可靠進度後是否可切換元件?
- 完成或失敗時是否停止動態並顯示結果?