浮動介面與確認

Alert Dialog|警示對話框

用於必須立刻被注意、且需要使用者回應的短訊息;它是會中斷工作的特殊模態 Dialog。

常見俗稱:警示對話框、重要警告彈窗、Alert Dialog、阻斷警示、錯誤確認視窗

60 秒決策

先確認使用者要完成的事。

適合使用

  • 訊息重要到必須中斷目前工作,並且需要使用者知悉、確認或採取下一步。
  • 內容能用短訊息說明發生的事、影響範圍與可行出口。

不適合使用

  • 只是回報成功、一般提醒或不需要立即回應的狀態。
  • 訊息太長,必須讓人閱讀多段說明、清單或文件。

畫面要說清楚的事

不要只交代外觀,也要交代資料與輸入規則。

短訊息說清楚後果

先說發生什麼、影響什麼,再給出目前唯一合理的下一步。

警示不是純紅色

圖示與顏色可以加強語氣,但文字本身要讓使用者在不看顏色時仍知道問題。

中斷要有理由

它會搶走焦點與工作流程,所以只有真的需要回應時才開。

必要狀態與回應

每個狀態都要讓使用者知道下一步。

觸發前

背景任務進行中,警示尚未中斷使用者。

警示開啟

訊息被清楚宣告,背景不可操作,焦點在最合適的回應。

已知悉

使用者關閉警示,回到原工作位置。

後續處理

若需要重試或修正,提供具體入口而不是模糊的「確定」。

操作 Demo

先知道要觀察什麼,再動手操作。

操作前先知道

  1. 同步失敗警示

    先觀察:訊息是否簡短指出尚有 3 位成員未更新,並且不讓背景被意外操作。

    操作:開啟 Alert Dialog,檢查焦點與背景,再按「我知道了」或 Escape。

    預期結果:Alert Dialog 關閉後回到開啟按鈕;使用者知道同步沒有完整成功。

Alert Dialog Demo

重要訊息需要先被讀到與回應
情境:LumenDesk 成員管理

成員管理

林子安產品設計 · 專案管理員
帳號啟用中

Alert Dialog 是需要立即回應的訊息,不是每一則提醒都要使用的高強度彈窗。

尚未開啟對話框。

同步尚未完成

有 3 位成員的權限尚未同步。請稍後重新整理,或交由管理員處理。

告訴 AI

把任務、規則、狀態與操作條件一次寫清楚。

在 LumenDesk 製作 Alert Dialog,情境是「同步失敗,尚有 3 位成員未更新」。訊息要短,清楚說明發生什麼、影響範圍與下一步;使用 alertdialog 語意、可見標題與訊息關聯。開啟後背景不可操作,焦點在「我知道了」或合理的下一步按鈕,Escape 可以關閉並回到觸發位置。若訊息不需要使用者回應,改用頁面 Alert 或 Toast,不要濫用 Alert Dialog。

驗收清單

不要只確認欄位能不能點。

  • 這件事是否真的需要中斷使用者並取得回應?
  • 標題、訊息與下一步是否在不看顏色下仍能理解?
  • 是否使用 Alert Dialog 的名稱、訊息關聯與模態行為?
  • 初始焦點是否在合理回應,而非意外觸發危險動作?
  • Escape 或關閉後是否回到原觸發位置?
  • 若不需要回應,是否改用非阻斷 Alert 或 Toast?