软件随想录(local.joelonsoftware.com/wiki)-2000年04月18日 使用介面设计手冊第四章 - User Interface Design for Programmers

2000年04月18日 使用介面设计手冊第四章 - User Interface Design for Programmers Chapter 4

 

The Joel on Software Translation Project:使用介面设计手冊第四章

From The Joel on Software Translation Project

Jump to: navigation, search

程序员的使用介面设计手冊 第四章：情境支持与隐喻

作者：周思博 (Joel Spolsky)
译：Paul May 梅普华
Tuesday, April 18, 2000 A part of Joel on Software, http://www.joelonsoftware.com

要发展一个程序模型与使用者模型一致的使用介面并不容易。有时候使用者可能对程序运作并没有具体的期望。这时候你得想方法提示使用者，告诉他们程序如何运作。对图形化介面来说，要解决这个问题有个常见的隐喻作法。不过隐喻并不是都一样的，而且要先了解隐喻为何有用，才能知道自己是否用了好的隐喻。

最著名的隐喻就是Windows和麦金塔所用的「桌面」隐喻。桌面上有些小资料夹，资料夹里面有些小文件。你可以把资料夹和文件拖来拖去。你可以把文件由一个资料夹拖拉移到另一个资料夹里。就这种作用而言这个隐喻的确有用，因为这些小资料夹图案真的会让人们想到真正的资料夹，并且让人们了解可以把文件放在里面。

下面是由Kai's Photo Soap撷取的画面。你能猜到要如何放大吗？

这不是很难吧。放大镜就是真实世界的隐喻。大家都知道该怎么做，而且也不会担心放大功能会改变影像的大小，因为放大镜并不会改变东西的真实尺寸。

即使是不甚完美的隐喻也比完全不用隐喻好得多。你能找出在Microsoft Word里要如何放大吗？

Word的介面中有两个小放大镜，不过其中一个是在「预览列印」钮上(原因不明)，而另一个则是在「文件引导模式」按钮(不知道是啥)。要改变放大倍率的正确方法是用写著"100%"的下拉清单。这里并没有要用隐喻的意图，所以使用者比较难猜出要如何放大。这并不一定是缺点；考量到Kai有那么多的画面空间，放大对文书处理软件来说可能并没有那么重要。不过可以确定的是Kai使用者中，会用放大功能的使用者比率一定比Word使用者高。

不过选得不好的隐喻可比完全不用隐喻更糟糕。记得Windows 95的公事包吗？这个可爱的小图示在每个人的桌面上霸占约一平方吋的空间，一占就是好几年，直到微软搞清楚没人要它才消失。而没有人要用是因为它用的隐喻不好。这应该是个可以把文件放进去带回去的「公事包」。可是当你要把文件带回家时，还是得把它们拷进磁片。所以啰，你究竟是把文件放在公事包还是放在磁片里？我不确定。我搞不懂公事包，我从来都不会用这个东西。

情境支持(Affordances)

设计良好的对象一看就知道要怎么用。有些门在大约手的高度装有大片金属片。对这片金属片唯一能做的是就是推它。以唐纳.诺曼(Donald Norman)的话来说，金属片对应产生(afford)推。别的门会有个大圆把手让你只想去拉。它们甚至还暗示你该如何握住把手。所以把手就对应产生拉的动作。它让你想要去拉。

其他对象的设计没这么好，所以你就不知道该怎么做。CD盒就是个很典型的例子。你必须把大姆指在正确位置然后向某个方向拉。可以盒子的设计本身完全没有指示要怎么做。如果你不知道诀窍会很沮丧，因为根本打不开。

要建立情境支持的最佳方法就是在「负空间」配合人手的形状。我们仔细看看(优越的)柯达DC-290数位相机的前后盖：

前方有一个大橡皮把手，看起来可以把右手手指很舒服放在这里。后方左下角的设计更是聪明，这里有一个超像姆指印的凹洞。当你把左手拇指放在这里，左手食指会很舒服的弯到相机前方镜头和另一个橡皮块间。它提供了一种舒适的感觉，就像在吸吮大拇指(并把手指沿著鼻子弯起来)。

柯达的工程师只是试图诱使你用双手握住相机，这样可以确保相机更稳，而且也能避免手指乱放不小心遮到镜头。这些橡皮并没有其他功用，唯一的作用就是鼓励你正确地握住相机。

良好的电脑使用介面也会应用情境支持。大约十年前起大部份的按钮都变成"3D"的。加上各种灰阶色调后，按钮看起来会突出屏幕。这不光是看起来酷而已。它的作用非常重要，因为3D按钮对应产生了推的动作。它们看起来就是突出来的，会让人感觉要操作的方法就是去点它们。不幸的是，现在很多网站(没有注意到情境支持的价值)偏好看起来比较酷而不是看起来可以按的按钮；结果就是有时候会找不到该按哪里。看看下面这个网页橫栏：

"

"GO"和"LOGON"按钮都有突出，看起来就像可以点的样子。SITEMAP和HELP按钮看起来就不太像能按。事实上它们和不能按的QUOTES标签长得一模一样。

大约四年前，很多视窗开始在右下角长出像是把手的三条小凸纹。看起来像是刻在滑钮上增加摩擦力的东西。它对应产生拖拉动作。它只是在叫你拖拉它来改变视窗大小。

最后要说一个最好的情境支持范例，就是众所周知的「活页式对话框」。记得旧式的Mac控制面板吗？

它的想法是让你从左的列表(可卷动)选一个图示。点了图示之后画面右方就会改变。虽然原因不明，不过这种迂回方式对原本设计的程序员来说非常合理，可是很多使用者完全搞不懂。很少有人知道如何卷动列表显示其他图示。不过比较严重的是，大多数人都不知道图示和右边对话框是有关连的。因为图示看起来只是个选项。

这种介面从大约1992起就开始消失不见，取而代之的是一种叫活页式对话框的新发明：

活页式对话框是个很好的情境支持。从图案上可以很清楚地知道你有六个活页；也很明确地呈现你在哪一个活页。当微软开始测试活页式对话框的使用性时，数值由约30%(旧式麦金塔作法)变成100%。也就是说每一个受测者都能理解活页式对话框。这个隐喻实在是非常成功，另外Windows还內含支持活页式对话框的程序代码，而且可以免费使用。实在很难想像还看得到应用程序没有运用这个功能。这些程序因为不想赶时髦，结果却产生了真正可度量的可使用性问题。

下一章：一致性及其他怪东西

这些网页的內容为表达个人意见。
All contents Copyright 1999-2002 by Joel Spolsky。All Rights Reserved.