Jan 1, 2025

0 words
0 m

飞书快捷键规范

飞书快捷键规范

一、基本概念

快捷踺又称为热键或组合键，是一种为了实现应用程序某些特定操作的键盘组合。合理的快捷键设计能够提高用户的产品使用效率，帮助他们更快的完成任务，而无需使用鼠标或触控板来点击界面元素。


二、快捷键设计的基本原则

2.1 避开系统级快捷键

快捷键的设计不要与系统或浏览器的热键产生冲突。用户很可能已经习惯了系统级的快捷键的使用和操作，如果在自身产品层面强行劫持或覆盖，极大地违背了用户的使用习惯。

2.2 尽可能使用标准快捷键

在不同的平台下都有一套约定俗成的“标准快捷踺"，例如macOS下的应用程序全屏是：Control+Command+F，而在Windows下的应用程序全屏是：F11。所以我们在进行快捷键设计前应该对不同平台快捷键有所理解，并尽可能地与它们对齐。

2.3 权衡不同平台之间的快捷键差异

需要注意 Mac 和 Windows 之间的快捷踺差异，虽然 Mac 键盘中也包含 ControI 键，但核心的控制键应该由Control映射到Command上。虽然Mac键盘上很多功能键与Windows键盘按的功能相同，但是由于键盘布局和结构的差异，依然会有些许不同，以下是一些核心差异点：

Windows

Mac

描述

Del

Fn-Delete

删除右边的字符。在 Mac 笔记本中，按下 Fn-Delete 按键。

Alt

Option

输入特殊字符，如：→

Control

Windows

Command

执行操作或快捷键。如：按下 Command 和S建通常会存储文稿或文件。

Home 和 End

Command-左箭头

Command-右箭头

在Mac上，使用 Command 键和箭头键可前往当前行的开头或结尾，使用 Home 和End 键可前往当前文稿的开头或结尾。

Num Lock

Num Lock

Shift+Clear

在一些APP中，控制按下数字小世盘中的按踺是否会输入数字或移动光标。

Scroll Lock

Control+F14

在一些 App 中，控制按下箭头腱是否会移动光标或滚动囗。

截取屏幕

Shift+Command+3

Shift+Command+4

给屏幕拍照。Shift+Command+3 拍摄整个屏幕的图片。Shift+Command+4拍摄屏幕上框选部分。

2.4 遵循功能键的使用习惯

键盘上的每一个功能键(除去字母键以外的任何按键)都拥有其特定宝的历史和含义。在设计快捷键 时需要思考具体操作与此功能键含义的搭配度,例如Command在macOS中是包含命令的含义, 而Shift则是与切换的命令息息相关。下边中给出了常见功能键的合含义简介：

常见功能键概述

Esc键：

退出键。英文Escape的缩写，中文意思是逃脱、出口等。在电脑的应用程序中主要是退出某个程序。

Tab键：

表格键。是Table的缩写，是中文表格含义。在电脑中的应用主要是在文字处理软件起到等距离移动的作用。

Caps Lock建：

大写锁定键。英文是Capital Lock的缩写。用于输入较多的大写英文字符。它是一个循环类型按键。

Shift键：

转换键。英文是转化的意思。用以转换大小写或上符键，还可以配合其它的按键起共同作用。如：@的输入。





















2.5 好的快捷键设计应该具备隐喻效果

在尼尔森可用性原则中,第二条便是"使系统和显示世界相符合"。相应的,我们在进行快捷键设计时也应遵循这一层原则,常见的快捷键隐喻设计方 式是「将英文首字母用于快捷键组合」,例如最常见的 Control/Command+C 其实就是英文 Copy 的首字母隐喻设计,这更便于用户的记忆和学习。

2.6 当需要第二个修饰符时,尽可能使用Shift

在Windows和macOS平台规范中,两者都建议在快捷键组合需要补充修饰符时,建议将Shift 作为首选的辅助修饰符。例如:在大多数的应用程序中Command+P是显示"打印"对话框,因 此"页面设置"对话框则通过添加Shift修饰符来实现,?它的标准快捷键组合是 Shift+Command+P。作为运行于各个平台的应用程序,我们需要积极地和平台规范和习惯对齐。

Human Interface Guidelines: Prefer the Shift key as a secondary modifier when a shortcut complements another shortcut. Windows Design Guidelines: Use Shift key combinations for commands that extend or complement the actions of the standard shortcut key.

2.7 好的快捷键设计是容易操作的

快捷键的设计同样需要考虑用户的任务流。例如"复制"和"粘贴""行为通常是绑定在一起的(你 也可以亲切地称呼它们为"情侣键"),用户在完成复制操作后,很快会进行粘贴的操作。因此在进 行快捷键设计时会选择C和V两个紧邻的字母键作为组合,在面对此类高频操作时,用户单手点 按即可快速完成。

2.8 快捷键的可见性设计同样重要

单单给出快捷键的按键组合并不是结尾,快捷键设计的最后一步是是根据上下文显示快捷键的设计。通常来看可以使用四种方式来展示快捷键。

  1. 统一收录进一份全局快捷键列表,并通过模块或功能进行分类展示。此类列表通常会放置于产品的帮助中心页面中。

  2. 应用内部的模态弹窗列表。通常在产品内部也会有一个随时可以以触发的全局模态快捷键列表,用于用户在产品中随时唤起和查阅。

  3. 基于软件情景的快捷键显示。可以通过Tooltips的形式在各个功能入口处展现快捷键组合,此部分内容在Lark部分入口已经包含,但绝大多数还未统一。

  4. 应用菜单栏的列表显示。在苹果系统中,选择应用程序后菜单可以显示具体操作,并且会在操作后方搭配相应的热键组合。

2.9 清晰定义快捷键的响应范围

快捷键根据其功能的响应范围可以分为三种:"全局级"、"应用级"、"控件级",三种级别的触发与响应范围都不相同:

  1. 全局级别响应:全局级快捷键可以在操作系统的任何位置唤起,所以无论用户的鼠标焦点在哪里、无论运行任何程序,按下此快捷键时都能够产生作用。例如macOS 中唤起 Spotlight快捷键"Command+Space"便是一种全局快捷键,无论用户在任何场景下都都能随时唤起。

  2. 应用级别响应:绝大多数快捷键都属于应用级快捷键,它只在当前活动的应用程序中起作用,若此应用处于不活动状态或后台运行,该快捷键就不会产生效用。例如在Excel程序中,同时按下Ctrl+9会立即隐藏当前选中的行,而在Word应用程序中,这个快捷健就不起任何作用了。

  3. 控件级别响应:此类快捷键只在应用程序中的某些控件上起作用,若焦点离开控件,此快捷键将不会发挥效用。例如Slack应用程序中,选中某条会话后唤起MoreActions面板,可以使用Pin的快捷键P,但是如果没有唤起MoreActions面板,此快捷键不起乍角。

2.10 键位组合的描述要清晰明确

为了方便用户识别和理解快捷键键位描述,我们在撰写时应该将功能能键的名称全部写出,或是使用通用符号来代替。同时在多个修饰符的描述中,应该遵循平台既有的描述逻辑顺序。例如在macOS平台中,如果在快捷键中使用多个修饰符,请始终按以下顺序列出它们:Control→Option→Shift→Command。


三、快捷键设计的基础逻辑

第一步：确认是否为「已存在的系统级快捷键」

首先确认是否为已存在的系统级快捷键。如果是则遵循系统规则，直接和系统对齐的。例如复制、粘贴、全屏化等等的操作，Mac和Windows都有详细的定义，Web浏览器也应该是和系统对齐的。

第二步：确认是否已存在「行业定义」

如果不属于系统级快捷键，查看行业产品对快捷的定义，若不和咱们已有的热踺组合冲突，则采用行业的热键组合。这边主要会看Slack、Teams、Jira等等的企业协作产品，其它业务线同样可以参考自己业务领域的龙头产品，例如Gmail、Zoom等等。

第三步：从新定义功能快捷

如果既不是系统快捷键，也不是行业快捷键，此时就是需重新编写一个功能快捷键组合。这种情况比较少，但是需要尤为谨慎，可以思考两个问题：是否真的需要此快捷键，为什么行业竞品都没有添加？添加后是否有较大收益，将此修饰符留给其它高优功能是否更合理？评估后若确认添加，则要遵循上述的基本原则来指导我们的快捷键设计。


四、附录

平台规范摘录

Microsoft热键的设计准则

  • 将快捷方式与CTRL键配合使用即可代表较大的效果,例如CTRL+S可用于保存当前文档

  • 将「SHIFT+组合键」用于扩展或补充标准热键的操作

Apple热键的设计准则

  • 当快捷方式补充另一个快捷方式时,建议将Shift键用作辅助修饮饰符。例如,Command-P在大多数应用程序中显示"打印"对话框。"页面设置"对话相庭的标准快捷方式通常是Shift-Command-P,它可以补充打印。

  • 谨慎使用Option(Alt)键作为修饰符。

  • 尽可能避免将Control键用作修饰符。Control键已在整个系统中广泛使用。为避免可能的冲突,请仅在必要时使用它。

  • 以正确的顺序列出修饰键。如果在快捷方式中使用多个修饰键,请始终按以下顺序列出它们:Control,Option,Shift, Command。避免使用已有的热键组合。

Atlassian热键的设计准则:

  • 使用两键热键。比如转到项目热键先按g再按p。

  • 多使用渐进式热键。您可以将一个字母的快捷方式用于大多数常见操作(c表示注释),以及两个

  • 字母热键,用于较不常见的操作(gp用于转到项目页面)。

参考与引用文献

  1. MicrosoftTeams快捷键

  2. Slack快捷键

  3. macoS快捷键

  4. Keyboard Shortcuts Creation

  5. UX Guidelines for Command Names and Keyboard Shortcutts

  6. 语雀快捷键的体验设计

  7. 标志的源起(二) Command


五、高频问题Q&A

1、如何让用户感知到快捷键的存在?

此问题属于快捷键的可见性设计范畴。在基本原则第九条中描述了关于于用户主动查看快捷键的种种方式。同时,我认为用户学习一个快捷键的最佳路径一定是从自己的作任务流程中进行学习,所以Tooltips的快捷键展示就显得格外重要了。例如在使用快捷键的场景中,如果用户并不知晓这一快捷键,则触发截图的唯一路径是通过鼠标点击截图icon,通过悬浮于icoon上显示快捷键的按键组合,用户便可以很轻松的学习和记忆此快捷键。

2、为什么主端只有Mac快捷键,Windows则是空缺的?

快捷键的梳理工作是从一端开始而逐步辐射到其它各个端的。一般来讲是从Mac开始,进而针对Windows做适配和映射。主端方面目前的精力在Mac部分的梳理,)后面会适配到Windows平台。

3、为何快捷键组合中,有些是功能键+字母,而有些只有字母呢、能做统一么?

其实是其实在快捷键组合中,字母是否添加修饰符并不是强制的操作,力大家看可以看看Gmail或者Slack等的快捷键设计,其实两种快捷键组合都会包含,这么做有以下优势势:

1.可以扩展可用快捷键的键位,以防和其它热键冲突。比如一个A字母就能产生:A、Shift+A、Command+A、Shift+Command+A....

2.方便用户记忆。一个字母的快捷键是非常容易记忆的。

3.快捷键组合不盲目追求视觉视觉的"一致性",而是把效率和易用度放在首位

4、如何判断某个快捷键是否适用于iPadOS?

首先要对iPad妙控键盘有所了解,iPad快捷键的支持我们基本把最大大的关注点放在妙控键盘上,其它第三方键盘可以往后放一放。通常来讲,我们的快捷键都支持适配到iPad端,但以下情况中需要再考量:

1.妙控键盘缺少此按键。例如ESC键便是秒控键盘所缺失的,所以取消/关闭的快捷键要考虑迁移到其它热键上,或者暂不支持

2. Lark iPad端缺少PC上所对应的功能模块。比如PC的大搜目前在iPad是缺少的,此时快捷键理应也暂时搁置

5、如何评估此功能是否需要增加快捷键?

设计前可以询问自己下列问题,如果都确认则可以考虑添加:

1.行业竞品是否有增加此快捷键?

2.此功能的使用频率是否高?

3.此功能的是否足够重要?







Table of Contents

基本概念

快捷键设计的基本原则

快捷键设计的基础逻辑

快捷键设计的基础逻辑

快捷键设计的基础逻辑