60 秒決策
先確認使用者要完成的事。
適合使用
- 使用者需要由明確入口開啟一塊較完整的資訊,並可能在其中執行一兩個後續動作。
- 內容仍屬於目前頁面的局部脈絡,開啟後不需要停止整個背景流程。
不適合使用
- 只是兩句短提示,或內容根本沒有任何可操作與延伸閱讀的必要。
- 內容需要強制回應、高風險確認、長表單或多步驟流程。
畫面要說清楚的事
不要只交代外觀,也要交代資料與輸入規則。
入口說清楚會打開什麼
「查看通知摘要」比三個點或沒有文字的圖示更容易讓人預期內容。
內容可以多一點,但層級要更清楚
標題、摘要和一兩個下一步就足夠;別把完整設定頁縮成一張漂浮卡。
關閉規則跟內容強度一致
可輕易離開的資訊可支援 Escape 與點外部關閉;若離開會遺失工作,改用有明確取消的流程。
必要狀態與回應
每個狀態都要讓使用者知道下一步。
未開啟
觸發按鈕清楚說明會看到的內容,不讓人猜三個點代表什麼。
已開啟
浮層有標題、摘要與可抵達的第一個操作,不會遮住自己的觸發點。
完成下一步
操作後留下具體回饋,並決定是否收合面板。
輕量關閉
Escape、點擊外部或再次點觸發點能關閉;不把半完成的長表單當成輕量內容。
操作 Demo
先知道要觀察什麼,再動手操作。
操作前先知道
通知摘要
先觀察:面板是否比 Tooltip 多了資訊與下一步,但仍沒有變成一個需要填寫的長流程。
操作:點選「查看通知摘要」,按 Tab 移到「前往通知設定」,再按 Escape 或點擊面板外部。
預期結果:你能閱讀摘要並進行一個下一步;面板可被安全關閉,背景內容維持可用。
告訴 AI
把任務、規則、狀態與操作條件一次寫清楚。
在 LumenDesk 的通知設定旁建立 Popover。使用者點選「查看通知摘要」後,開啟一個包含今日待處理通知、目前頻率與「前往通知設定」動作的浮動面板。面板的內容可以操作,因此不能把它當 Tooltip;要有清楚標題、可見觸發入口、點擊外部或 Escape 的關閉規則,以及鍵盤能抵達的第一個操作。若內容已經是多步驟或高風險任務,改用 Dialog 或完整頁面。驗收清單
不要只確認欄位能不能點。
- 入口是否明說會顯示哪一類內容?
- 面板是否有標題,並只放目前任務需要的資訊與動作?
- 第一個可操作元素是否能被鍵盤找到?
- Escape 與點外部關閉是否符合內容風險?
- 內容若變成長表單或高風險確認,是否已改用 Dialog 或完整頁面?
- 操作結束後,是否給出可理解的結果?