命令面板
Command Palette
初级通用命令面板(Command Palette)是让用户通过输入关键词,快速找到并执行应用内操作的入口。它解决功能分散、菜单层级深时找操作费时的问题,例如在项目后台输入“新建任务”直接发起创建。
你可能会说:「我想让用户按个快捷键,输入几个字就能找到功能并直接执行,不用一层层翻菜单。」
动手看看项目后台的命令面板
这是项目后台里找操作的快捷入口。先切换搜索关键词,看候选项怎样缩小;也可以悬停候选项,或用 Tab 聚焦它们。
输入意图后,导出报告和邀请成员都被过滤掉了,不必再翻菜单找“新建”。
要点命令面板怎样帮你找到操作?
- 1
把分散操作汇到一个入口
你可以把“新建任务”“打开设置”“切换项目”等操作放进同一个面板。用户不用先判断它们藏在哪个页面,而是先打开面板,再按自己的目标找操作。
- 2
输入关键词后匹配可执行项
面板会根据输入缩小候选范围,选中某一项后执行操作或跳转页面。因为用户搜的是想做的事,所以名称最好写成“导出报表”这样的动作,而不只是“报表”。
- 3
让键盘操作形成完整路径
常见流程是用快捷键打开、输入关键词、用方向键选择,再按回车执行。我们也可以保留可见的打开入口,让不知道快捷键的人能用鼠标进入;执行后,焦点要回到合理的位置。
容易混淆的地方
命令面板和导航菜单都能通向功能,但菜单持续展示产品结构,适合让用户浏览;命令面板通常临时打开,适合用户已经知道自己想做什么时快速定位。它也不等于全站搜索:搜索主要返回内容,命令面板的候选项则可以直接触发操作。一个面板可以同时提供两者,但结果类型要让用户看得出来。
什么时候用
适合用
- 做项目管理后台时,功能散在多个模块,用户常要快速创建任务、切换项目或打开设置。
- 做编辑器或设计工具时,熟练用户会反复调用同一批操作,希望少离开键盘。
- 做 AI 工作台时,用户需要从任何页面快速发起新对话、打开历史会话或切换工作区。
不适合用
- 网站只有几个主要页面,用户需要一眼看清去处;直接用顶部导航栏或导航菜单更合适。
- 用户主要想查找文章、商品等内容,而不是执行操作;用搜索入口展示内容结果更直接。
- 页面只有一个“保存修改”操作,用户就在表单旁边;放一个清楚的按钮比另开命令面板省事。
练一练选一个答案,看看解释
你在做一个项目后台:用户常从不同页面发起“新建任务”、切换项目和打开设置,同时也需要浏览项目列表。哪种方案最贴合这些需求?
让 AI 帮你做复制给 AI Agent 直接用
请为这个项目后台实现命令面板:提供可见入口和键盘快捷键,支持输入关键词筛选“新建任务”“切换项目”“打开设置”;结果区分操作与页面,支持方向键选择、回车执行和退出后恢复焦点。保留现有导航,不用面板替代项目浏览。