導覽與資訊架構

Command Palette|命令面板

用鍵盤開啟、可搜尋的全域指令入口,適合工作區裡較多且高頻的命令。

常見俗稱:命令面板、命令選擇器、Command Palette、快捷指令、Ctrl K

60 秒決策

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

適合使用

  • 工作區有較多跨區域、高頻指令,熟悉使用者希望直接用鍵盤搜尋。
  • 同一面板可搜尋並執行命令、跳到工具或建立工作,而不是只選一個資料值。

不適合使用

  • 只有幾個固定的表單選項,使用者需要看見目前選取值。
  • 核心流程全藏在快捷鍵裡,滑鼠與新使用者找不到相同入口。

畫面要說清楚的事

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

可見入口配上快捷鍵

Ctrl/Cmd + K 能加速工作,但也要提供「開啟命令面板」按鈕。

搜尋的是命令與目的地

每一列用動詞開頭,例如「建立任務」;不能看起來像單純資料篩選器。

目前項目和結果數要清楚

鍵盤上下移動時有可見選取狀態,零結果也要說明下一步。

必要狀態與回應

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

關閉

頁面照常操作,按快捷鍵或可見按鈕才開啟命令面板。

搜尋與目前項目

開啟後焦點進搜尋框,篩選結果並讓鍵盤知道目前會執行哪一項。

零結果與離開

找不到時保留查詢與清楚訊息;Esc 關閉後焦點回到觸發位置。

操作 Demo

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

操作前先知道

  1. 快速啟動工作區指令

    先觀察:同一面板可搜尋建立、切換檢視與邀請成員等跨區域工作。

    操作:按 Ctrl/Cmd + K,輸入「邀請」,用 Enter 執行;再開啟並按 Esc。

    預期結果:搜尋結果縮小、執行結果有回饋,關閉後焦點回到原本開啟位置。

可操作 Demo

Command Palette 讓熟悉鍵盤的人快一點,新使用者也要有入口。

LumenDesk/行銷網站改版

任務資料列的指令,不能假裝成狀態選項。
專案內有 12 筆任務

工作區快速操作

從同一個入口搜尋並執行多個命令
Ctrl / ⌘ K
不用先記得每一個頁面在哪裡。鍵盤熟手可以搜尋命令;其他人可直接按這顆按鈕。
建立任務切換看板檢視邀請成員

按 Ctrl/Cmd + K 或按鈕即可開啟命令面板。

告訴 AI

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

在 LumenDesk 建立 Command Palette。使用者按 Ctrl 或 Cmd + K,或按下可見的「開啟命令面板」按鈕後,開啟有名稱的對話框並將焦點放入搜尋框。可搜尋「建立任務」、「切換看板檢視」、「邀請成員」等工作區指令;方向鍵移動目前項目、Enter 執行、Esc 關閉並把焦點還給原本觸發位置。不要把它當作只列出兩三個資料選項的 Select。

驗收清單

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

  • 是否有可見入口,也支援 Ctrl/Cmd + K?
  • 搜尋結果是否是可執行命令,而不是假裝成選項欄位?
  • 開啟後焦點是否進搜尋框,Esc 是否回到觸發處?
  • 方向鍵、Enter、零結果與目前選取是否都有明確回饋?
  • 是否沒有把所有主要流程強迫藏在快捷鍵裡?