用户体验模式7 分钟阅读·Updated 2026 年 10 月·ExodeUI 团队
命令面板与嵌套导航：当 Cmd+K 击败侧边栏时
命令面板擅长什么、失败的地方以及如何与导航一起设计命令面板：搜索、模糊匹配、快捷方式和可发现性。
直接总结和定义
核心要点
命令面板（通常使用 Cmd+K 或 Ctrl+K 打开）让人们可以键入他们想要执行的操作，而不是在菜单中查找。对于频繁使用的用户来说，它速度更快，并帮助他们发现功能和快捷方式。它不会取代导航：新用户仍然需要可见的结构来了解存在的内容。最好的产品同时具备这两种能力。
为什么命令面板会传播
命令面板在开发人员工具中启动。在 Visual Studio Code 中，按 Ctrl+Shift+P 打开命令面板，通过该面板可以从一个键盘驱动的窗口访问编辑器的所有功能。 Superhuman 等产品使 Cmd+K 成为体验的中心：执行任何操作的一个快捷方式，这也教会了下次使用的专用快捷方式。 Superhuman 认为人们更喜欢搜索而不是菜单，因为只有当您已经了解菜单的组织方式时，菜单才会有帮助。
一个好的调色板需要什么
有用的调色板和令人沮丧的调色板之间的区别主要在于搜索质量：
- 模糊匹配：拼写错误和部分单词仍应找到正确的命令（Superhuman 指出“lnik”仍应找到“link”）。
- 同义词：人们输入“邀请”、“添加成员”或“分享”；一切都应该有效。
- 排名：首先是最近和频繁的命令，然后是最佳文本匹配。
- 在每个结果旁边显示快捷方式，以便人们学习它们。
- 混合对象和操作：页面、人员、文件。
- 首先是键盘，但完全可以与鼠标和屏幕阅读器一起使用。
调色板的不足之处
调色板在打开之前是不可见的，因此它无法告诉新用户该产品的用途。人们必须知道或猜测他们想要的东西的词。这就是为什么为了支持调色板而删除导航通常会伤害新用户和临时用户的原因。保持清晰的侧边栏或菜单进行浏览，并将调色板视为已经知道自己要去哪里的人的快车道。
无障碍
使用已建立的组合框和列表框模式，以便屏幕阅读器宣布结果，在调色板打开时将焦点保留在调色板内，使用 Escape 关闭它并将焦点返回到原来的位置。不要覆盖辅助技术或浏览器所依赖的快捷方式。
要记住的关键 Principle
- 调色板对于经常使用的用户来说速度很快，并帮助他们发现快捷方式
- 它们对新用户来说是不可见的，因此请保持可见的导航
- 搜索质量决定成功：模糊匹配、同义词、良好排名
- 在结果中显示快捷方式以便人们学习
- 遵循组合框可访问性模式
常见问题解答
来源
- How to build a remarkable command palette — Superhuman
- User interface: Command Palette — Visual Studio 代码文档
- Progressive Disclosure — Nielsen Norman Group