科技: 人物 企业 技术 IT业 TMT
科普: 自然 科学 科幻 宇宙 科学家
通信: 历史 技术 手机 词典 3G馆
索引: 分类 推荐 专题 热点 排行榜
互联网: 广告 营销 政务 游戏 google
新媒体: 社交 博客 学者 人物 传播学
新思想: 网站 新书 新知 新词 思想家
图书馆: 文化 商业 管理 经济 期刊
网络文化: 社会 红人 黑客 治理 亚文化
创业百科: VC 词典 指南 案例 创业史
前沿科技: 清洁 绿色 纳米 生物 环保
知识产权: 盗版 共享 学人 法规 著作
用户名: 密码: 注册 忘记密码?
    创建新词条

最新历史版本 :费茨法则 返回词条

  • 编辑时间: 历史版本编辑者:方兴东
  • 内容长度:图片数:目录数:
  • 修改原因:

费茨法则

费茨法则是人机交互领域里一个非常重要的法则,在10年来得到了广泛的应用。

Fitts法则最基本的观点就是任何时候,当一个人用鼠标来移动鼠标指针时,屏幕上的目标的某些特征会使得点击变得轻松或者困难。目标离的越远,到达就越是费劲。目标越小,就越难点中。漂亮简单,对么?这意味着要是目标定位越容易,距离鼠标当前位置就应该越近,目标占用空间应该有更大。

Fitts花了好几页来描述这些发现,用明显数学式的严谨,用公式表达出了怎样去测量不同速度距离目标尺寸对用户点中目标的影响。目标和鼠标指针越远,尺寸越小,就越难点中目标。


 

从鼠标到达目标的时间可以用公式Time = a + b log2 ( D / S + 1 )来计算。其中

D:鼠标达到目标的距离

S:目标的宽度(尺寸)

费茨法则为人机交互提供了一个度量的法则,从而也为我们设计人机交互界面提供了科学依据,也就是告诉我们怎样设计一个界面可以让用户比较容易使用,提高用户的操作体验。从上面的公式中,我们可以得出一个结论:如果我们要想鼠标比较快速的命中目标可以采取两个措施,要么减少鼠标与目标之间的距离,要么使目标足够大(哈,当然还要有一个好鼠标,以前我用过一个鼠标突然出了问题,鼠标指针离按钮很近却费了我几秒钟才移到按钮上面去,一笑)。这里面的另一个考究就是要尽量将按钮集中在一起,同时要将经常使用到的按钮放在最醒目的位置上。

且让我们来看看几个费茨法则的应用。

1. 从WindowsXP之后的操作系统开始菜单增加一个选项,就是可以隐藏长时间没有使用的菜单,简单的考虑是从使用频率的角度出发的,实际上我认为这也是为了减少用户单击开始以后弹出菜单的长度,减少鼠标到目标菜单之间的距离。

2. OfficeXP以后的菜单也提供了隐藏菜单和工具条的功能。

3. Mac操作系统的快捷工具条上按钮很大,象StarDock公司就为我们提供了Mac操作系统工具条的实现,点击一个按钮的命中几率却是要大很多,而windows的任务栏上的按钮都是16X16的,一不小心还容易点错。

同时也让我们来看几个不好的交互设计

1. 在web页面中经常要使用到分页的功能,但是往往分页的页码显示的数字特别小,而且密密麻麻,如果您使用过asp.net提供的datagrid控件就知道其分页显示的页码是多么难用,要选中一个页码真的很难,还要小心翼翼的。

2. 在gotdotnet查询页面上也有一个分页功能,不过其提供了“next>>”的方式,点击分页不是特别困难,但是页面滚动到下面去以后如果要翻页还要将页面滚到上面去翻页,使用十分不便。

3. 在uninstall这样的工具中,界面只有一个主窗口,但是不经常使用到的按钮很大,经常使用到的按钮倒很小,如下图所示:

 

费茨公式为我们设计交互提供了一个依据,那么是否回答了所有的问题呢?其主要缺点是:
1.其应用范围只是2D的。我觉得还缺乏一个因素就是方向的问题,对于右手使用的用户来说往左上和左下的方向一般命中要困难,因为操作不便的原因,不信的话大家可以试试,因此如果您要做的特别细致,就要考虑界面上按钮的布局了,一般按钮放在右边可能会比较好。
2.缺乏对虚拟距离的度量。从鼠标到目标是一个可以度量的距离,也就是说这个距离是连续的,然而在实际的使用中,这个距离并一定是连续的,实际上有可能是离散的。举个例子,当你操作文档的时候需要设置段落的格式,在word中提供了专门的段落菜单,在文档窗口上有,在工具条上,那么为了使用户能够快速的设置段落的格式,提供了尽可能多的入口,那么这里的目标就不是一对一,而是一对多。这里提出的另一个命题就是为了能够让用户快速的命中目标,那么你必须在程序中设置多个目标的等同目标,也就是说在一个有限的范围内,要让目标尽可能无处不在。windows shell里的sendto,提供了另外一种更为快捷的解决方案。另外一个可行性的方案就是可以让用户根据自己的习惯和喜好来DIY目标的摆放,就像windows开始菜单一样,我们可以按照自己的喜好进行分组。

目录

软件界面设计中的Fitts定律回目录

一 引子

在射击比赛中,我们常常会看到这样的情形:在裁判发出口令后,射击运动员把手中的枪慢慢抬起,逐渐瞄准远处的靶心,最后抠动扳击, 射出子弹。整个过程一般需要好几秒钟的时间。现在大胆地设想一下,如果可以改变规则,怎样才能尽可能缩短瞄准过程所需的时间呢?很显然,如果枪口原来的方向就正对着靶心,或者说靶子上所有环的圆圈都成倍地放大,那么瞄准所需的时间都可以得到缩短。

再来看汽车上的刹车踏板和油门踏板:它们相距很近,并且刹车踏板要比油门踏板大很多,那么它们为什么没有被设计成相距很远,或者将两者的大小颠倒过来呢?朴素的使用经验告诉我们,这样的设计可以使得驾驶员能够以最短的时间把脚从油门踏板移动到刹车踏板上,从而达到以最快的速度准确制动的目的。

二 Fitts 定律

表面上看,上面这两个事物似乎和软件界面设计风马牛不相及。然而,在1954年,担任美国空军人类工程学部门主任的 Paul M. Fitts 博士却发现了其中蕴涵的道理。他对人类运动操作过程中的运动特征、运动时间、运动范围和运动准确性进行了研究,提出了著名的Fitts定律。该定律指的是:使用指点设备到达一个目标的时间同以下两个因素有关:

    1.设备当前位置和目标位置的距离(D)。距离越长,所用时间越长;

    2.目标的大小(S)。目标越大,所用时间越短。

图一:  Fitts定律示意图

该定律可用以下公式表示:t = a + b log2 (D / S + 1)

其中a,b是经验参数,它们依赖于具体的指点设备的物理特性,以及操作人员和环境等因素。

结合文章开头的两个例子,我们不难发现,Fitts定律其实很容易理解的。显然,指点设备的当前位置和目标位置相距越远,我们就需要越多的时间来移动;而同时,目标的大小又会限制我们移动的速度,因为如果移动得太快,到达目标时就会停不住,因此我们不得不根据目标的大小提前减速,这就会减缓到达目标的速度, 延长到达目标的时间。目标越小,就需要越早减速,从而花费的时间就越多。

三 Fitts定律在软件界面设计中的应用

Fitts定律在软件界面设计中的主要作用是提高软件的可用性。更准确地说,它所提高的是软件可用性中的效率指标,即使得用户能够更快速地完成某个操作或任务。

软件界面中的主要指点设备是指鼠标和轨迹球等设备,而目标则是指用户所要操作的对象,比如按钮、菜单等界面上的可视元素。从Fitts定律不难看出,要想缩短到达目标的时间不外乎两个方面:或者是缩短到目标的距离,或者是增大目标的大小。下面将结合一些软件中的例子来说明这两种方法。

3.1  缩短当前位置到目标区域的距离

右键菜单技术(或上下文菜单)是采取这种思路的一个很好的例子。为了弹出这种菜单,用户只要将鼠标指针移动到需要对其进行操作的某个对象所占据的区域中并单击右键即可。而在一般情况下,这个移动的距离要远小于将鼠标指针移动到应用程序主窗口顶部的下拉菜单区域。

图二:IE浏览器对于上下文菜单的支持

比如说,如图二所示,在浏览网站www.csdn.net的主页时,你想查看该页面的HTML代码。一种方法是将鼠标指针移动到浏览器窗口顶部的下拉菜单区并点击“查看”菜单,然后点击其中的“源文件”菜单项。然而,如果当前鼠标指针就位于所浏览的页面上,那么你可以不用移动鼠标,而是直接点击右键(假定鼠标指针不在某个超链接文字或图片上),就可以得到一个如图二所示的上下文菜单,然后在其中选择“查看源文件”菜单项。显然,后面这种调出菜单的方法更快,因为在大多情况下,这个移动距离是0(如果鼠标指针不在任何超链接文字或图片上),或者仅是把鼠标指针从一个超链接元素上移开所需的那么一点点距离。

另一个例子是Windows XP操作系统中的一个有关鼠标的设置。在系统控制面版中打开“鼠标”项,然后选择“指针选项”,如图三所示:

图三:Windows XP操作系统中有关鼠标指针位置的设置

其中的选项“自动将指针移动到对话框中的默认按钮”的作用就是,每次当一个对话框被打开后,操作系统将自动将鼠标指针移动到该对话框中的缺省按钮上面。如果用户的操作是点击该缺省按钮,那么这个设置将能使得用户不用移动鼠标(指点设备的当前位置和目标位置的距离为0)就能进行该操作,从而极大地加快速度。

3.2 增大目标大小以缩短定位时间

这方面最经典的例子是Windows操作系统和Macintosh 操作系统中的应用程序菜单区域位置的设计。实际测试和理论计算结果都表明,在使用Macintosh时,用户点击某个菜单所需的平均时间要比Windows上快0.4秒(《The humane Interface》Jef Raskin )。

图四:Macintosh操作系统中的应用程序菜单条总是位于屏幕的顶部

图五:Windows操作系统中的应用程序菜单条总是位于标题栏的下方

为什么会有这样的结果呢?如图四所示,在Macintosh中,用户当前正在使用的应用程序的下拉菜单条被设计成位于屏幕的顶部。这样当用户在垂直方向上移动鼠标指针以便定位到菜单区域时,可以等效地认为目标区域是该下拉菜单条区域和其上方,即屏幕上方的所有区域,这是因为屏幕的边界在物理上限制了鼠标指针不能再向上移动了,因此我们可以等效地认为目标区域变大了。实际上,这个等效的目标区域在垂直方向大小的最大值可以认为是无穷大。如果使用前文的公式来计算,可以看出,当S等于无穷大时,可以使得所需时间达到最小值。从用户实际的操作体验来看,他们可以用非常快的速度将鼠标指针向上移动,而不必担心滑过下拉菜单区域,因为它会被屏幕的边界挡住。

反观图五中所示的Windows操作系统,应用程序的下拉菜单区域总是位于应用程序主窗口的标题栏的下方,是一个高度大约为16个像素的条状区域。因此根据Fitts定律来看,它在垂直方向上的大小就是16个像素。同Macintosh上的无穷大相比,这样的目标区域当然就会需要更多的时间来将鼠标指针准确地移动并停止到它上面。

实际上,苹果公司已经为这个设计申请了专利。这个例子也给我们这样的启发:除了鼠标指针的当前位置之外(即上下文菜单的情况),屏幕的四边是最好的定位区域,用户能以最快的速度准确地到达那里。

图六:在Lotus Notes 中,用户可以点击邮件所在行的任意位置来选中该邮件

对图一进行仔细分析不难看出,如果目标区域是一个长方形,那么长方形的宽度会对鼠标指针在水平移动时的时间产生影响,而其高度则会对鼠标指针在垂直移动的时间产生影响。在以上有关Macintosh和Windows应用程序菜单位置的例子中,两者的主要区别是目标区域的高度。下面介绍一个有关目标区域宽度对于操作时间产生影响的例子。仍以图五所示的Windows中的文件管理器为例:在右边的文件或目录详细信息列表区域中,当用户想要选中某个文件或目录以便对其进行操作时,用户必须点击该文件名字所占据的那一小片区域才可以,而点击该文件名所在行的其它列,比如大小、类型和修改日期,都无法将其选中。相比之下,在图六所示的Lotus Notes的邮件列表界面中,为了选中某个邮件进行操作,用户可以点击该邮件所在行的任何位置(即图中的长方形框)来将其选中,这极大地方便了选取过程。

除了菜单之外,另一个显著的例子是各种按钮的大小,包括对话框和工具条上的按钮。例如,在图二所示的IE中,工具条上的所有按钮都做得比较大,其中“后退”按钮最大,这使得用户能够很容易地点中该按钮。类似地,图七的WinZip的工具条中的所有按钮也都做得很大。

当然,增大按钮大小的做法并不是在所有的情况下都是可行的,因为屏幕空间是有限的。如果功能太多,就不可能在有限的空间里以较大尺寸显示全部按钮,这是一个需要做出权衡的问题。

图七:WinZip中的工具条按钮比较大

四 Fitts定律在Web页面设计中的应用

在今天的大多数Web页面设计中,从Fitts定律的要求来看,有一个非常明显的糟糕设计:即大多数搜索结果页面上的指向某个结果页面的超链接的设计。下面以Google的搜索结果页面为例说明:

 

图八:Google的搜索结果页面上的指向不同页面的超链接难以点击

在图八所示的这个搜索结果页面的底部,用户可以通过点击链接文字为“1”,“2”到“10”的那些链接来直接跳转到特定的页面。这里的问题在于这些超链接的可点击区域太小,只有一个数字的大小,因此很难快速将鼠标指针准确移动到它们上面。在某些情况下,这种设计可能会带来很大的使用困难。例如,鼠标可能由于内部进入尘土而导致滚轮滚动不畅,又或者,一些老年用户或者存在运动机能障碍的用户在精确控制鼠标方面有困难。这些都将导致用户更难于点击某个想要浏览的页面的链接。

其实,正如上面的搜索结果页面所示,在这个数字链接区域的左侧和右侧,有很大的空白区域被浪费了。完全可以把数字链接区域做得比较宽,尽可能充分利用整个页面的宽度,从而使得每个数字链接的可点击区域变得很宽,如下面的设计原型所示:

图九:一种更容易点击的搜索结果页面中的超链接设计

五  总结

Fitts定律是界面设计中的一个非常重要的指导原理,它能够帮助设计人员对界面上的各种视觉元素的设计进行评估,从而发现一些当用户使用指点输入设备进行操作时的可用性问题。更进一步,设计人员还可以根据该定律的要求,通过采取增大目标区域或减小当前位置到目标区域的方法来改善界面在这方面的易操作性,提高用户的操作效率和使用满意度。

参考文献回目录

http://www.cnblogs.com/yanrongpi/archive/2009/02/17/476361.html
http://blog.sina.com.cn/s/blog_4caba12a010008cp.html

→如果您认为本词条还有待完善,请 编辑词条

标签: 费茨法则 Fitts’Law Fitts定律