第 1 章 界面设计的重要性

第 1 章 界面设计的重要性

无论是何种用途的软件都会有与用户互动的“接口”,即界面。界面是否简单易懂、操作方便,很大程度上决定了软件的品质。

本章会以一些导致用户操作失误的用户界面,以及不友好的用户界面为例来说明这个问题。同时,本章也归纳了成功的用户界面所必备的设计要素。另外,减少人为失误也是用户界面设计时的一个关键要点,对此本书将进行简要说明。

1.1 用户界面中存在的问题以及对设计人员的要求

本节来看看一些不易操作以及给用户带来压抑感的界面。这些例子具有普遍性,能够充分认识到其中的问题,也就意味着迈出了改进界面的第一步。

1.1.1 不易操作的用户界面

现在,银行 ATM 机以及自动售票机等自助设备已经非常普及了。有些老年人即使没有人教也基本上能对这些设备操作自如,甚至还能用网银购物。在企业里,员工人手一台电脑已是家常便饭,工作时敲击键盘的时间远远超过了拿笔的时间。同时,各种软件的用户量也在迅速增加。

不过,计算机虽说不可或缺,但也不代表所有人都能百分百地接受。仍然有很多人对计算机见而生厌。在银行 ATM 机或车站自动补票机前,经常能看到有一些人面对触摸屏不知所措,犹豫许久之后转而求助于旁人,或者改为使用人工窗口以及人工检票口。对于这类用户,创建更加友好的用户界面势在必行。

现如今,随着计算机系统用户的不断壮大,设计人员必须了解自己创建的用户界面将会给使用者带来怎样的影响。然而,遗憾的是,现在很多人并不在意用户界面设计的重要性,使用者也不得不“兴趣索然”地操作那些并非为自己量身定制的软件。

接下来,给大家看六个案例,它们都是不易操作的用户界面。

① 怎样删除错误数据?

A 本来就不怎么会用电脑,最近工作又处处都要用到电脑,这让他感觉非常棘手。今天来了一台配置最先进的电脑,他小心翼翼地操作着新系统,结果还是录入了错误的数据。于是他返回到菜单栏,可怎么也找不到删除键。哎呀!这到底是什么烂系统啊!

图 1 不知道该怎样删除的界面

② 怎么没有进行操作确认?

B 对电脑操作得心应手,现在他正一边哼着小曲儿一边滑动鼠标呢!啊,不好!好像按错键了!咦?界面上出现了一条消息:所有数据已全部更新。不会是按错什么键坏事了吧?呜呼!

图 2 没有进行操作确认的界面

③ 为什么不能编辑?

C 一周前开始使用新系统。该系统的界面制作得非常漂亮,但使用起来却十分麻烦,弄得人心烦。C 深呼吸,重新输入数据,可文本框上的光标却不见了。是不是一定要切换到“编辑模式”呢?这个文本框看似可以编辑,实际上又不能编辑。到底是怎么回事啊?

图 3 无法编辑的文本框

④ 系统仍然在运行吗?

财务部的 D 完成了月末确认工作,执行系统月结处理。这是本月导入的新系统,他也是第一次使用月结处理功能。但是,当他单击了月结处理的按钮之后,界面上却没有出现任何变化。稍等了一会儿,好像是死机了,只好强制关机,下班回家。

第二天早上,当 D 来到办公室时,发现财务部乱成了一锅粥。好像是新系统不能运行了。不会是我昨晚强制关机的原因吧?怎么办?先假装不知道吧……啊!老板往这边走过来了!死定了……

图 4 执行状态不明的系统

⑤ 本想转入下一页操作,可是……

E 比较热衷于回答在线问卷调查。今天,他也像往常一样回答厂商的问卷。这次的问卷比较麻烦,需要填写很多内容。好不容易填完了一项,准备转到下一页时,点击“下一页”……哎呀!怎么回到了上一页!糟了糟了!好像点击的是“上一页”!慌忙中赶紧点击“下一页”,好不容易写完的内容变成了一片空白。真是麻烦,不做了!

图 5 按键位置设置不当的界面

⑥ 究竟哪里填错了?

F 正一边抱怨“界面这么琐碎,真是烦人”,一边录入数据。好不容易写完了,点击“确定”,界面上却跳出了报错信息:发生错误,无法录入。可是填写的信息这么多,到底是哪里出错了呢?真是烦死了……

{%}

图 6 出错处不明的界面

对计算机用户而言,这些小灾难都是因界面设计不够合理所导致的。然而,设计人员肯定不是因为对用户怀有恨意才做了这样的设计。那么,为什么在操作时会发生上述问题呢?

所谓界面(Interface),是指在“物体”与“物体”之间起连接作用的部分。本书所讨论的是用户界面 1,它是连接人与计算机的桥梁。当然,将人与计算机这两种截然不同的物体强行联系在一起,本来就不是那么容易的事情。

1机器的用户界面也称为人机接口(Man machine interface)或人类接口(Human Interface)。

{%}

图 7 用户界面是用户与计算机之间的桥梁

计算机通过影像和声音向用户传递信息,而用户则使用键盘、鼠标及触摸屏等设备对计算机传达指令。这种通过用户界面缩小人机距离的方法,随着软硬件的发展也将不断进步。目前,GUI(Graphical User Interface,图形用户界面)的应用最为广泛。GUI 是指采用图形方式显示的计算机操作界面,用户直接或通过鼠标等设备向界面发出指令。与以前的 CUI(Character User Interface,字符用户界面)相比,GUI 大大缩短了用户与计算机之间的距离。

但是,在使用 GUI 系统时,前文提到的“小灾难”依然时有发生。究其原因,大多是由于向用户提供信息的方法没有遵守人类认知事物的基本原则。

1.1.2 界面操作时产生的压抑感

所谓“拙劣的界面”,指的是无法满足必备功能的、无法输出正确结果的,或者需要花费大量人力与时间才能达到目的的界面。简单来说,如果用户在操作时经常出现失误,我们只能认定这个界面是拙劣的。一款精心设计的软件,如果用户在操作时感到压抑,那么它的界面设计也是拙劣的。

那么,用户到底在什么时候会感到压抑呢?接下来,我们就列举几个不友好的用户界面的例子,加以说明。

例 1. 急于使用计算机,启动时却长时间显示标题画面。

例 2. 选择数据时,每次都必须按 Enter 键。

例 3. 为了实现某项功能,必须反复进出深层菜单。

例 4. 没有必要的解说每次都要播放动画。

以上几种界面操作上的不合理性,都会给用户带来压抑感。

另外,在软件界面中还存在一个重要的问题,那就是颜色与版面设计等也会在无形中给用户带来的压力。

本书创作的一大目标,在于归纳整理给用户带来压抑感的界面缺陷,并探讨设计时如何使这种压抑感消失。在探讨的过程中,会涉及认知科学的相关知识。认知科学研究的是人类通过视觉、听觉等五感进行信息处理并认知事物的过程。这里所说的“认知”是指,人类有意识或无意识地利用知觉、记忆、思考、学习、推论等各种途径来判断或解释认知对象的过程。

关于认知科学所包含的内容,可以参考《认知科学》一书,在书中记载了许多日常生活中简单易懂的例子。下文摘取部分精华内容。

例如,你走到十字路口,那里有一个信号灯。即使你当时正在思考其他事情,也可以潜意识地做出判断:红灯亮了,就会停下。这个判断过程应该是先看一眼信号灯,然后发现红灯亮了,最后停下。我们学过的“红灯停、绿灯行”这个常识在这时起关键性作用。另外,我们还会凭借生活经验,将与红绿灯信号相关的所有知识从记忆中提取出来,加以利用。如果这样思考的话,无意识的行为也可以被当成充分的理性行为。该理论也同样适用于动物界的各种行为。

摘录于《认知科学》(新曜社,大岛尚编,1986 年)

将认知科学的思考方式引入到心理学领域,就形成了认知心理学。本书将简要介绍 SE 及程序员需要了解的认知科学与认知心理学知识。通过熟练地应用这些研究成果,设计更加友好的用户界面,是本书的基本目标。

1.1.3 对界面设计人员的要求

要想设计出友好的用户界面,需要考虑图形图像设计、操作方法设计以及通知的内容等诸多要素。具体来说,包括以下几点。

  • 配色

    指界面中的颜色搭配。配色既要让用户看着安心又要便于读取。

  • 版面设计

    版面设计要舒服,这对用户体验十分重要。反之,不舒服的版面设计会让用户产生焦虑感。

  • 形状

    某些形状会让用户感到不舒服,甚至还会认为这款软件缺乏准确性,因此在形状的选择上有必要再三斟酌。而最理想的状态则是:即使用户没有学习过具体的操作方法,也能够通过界面上控件形状来操作。

  • 设置

    用户界面的设置,势必会影响用户的操作。设置的顺序、方向等也非常重要。

  • 操作方法

    如果操作方法难以理解或无法统一,也会让用户感到困惑。因此,一定要统一操作方法。

  • 反馈方法

    必须将处理结果以简单易懂的方式传达给用户。报错信息的显示方法与信息内容,也必须关联到下一步的操作。

如果是软件包或者用户较多的系统(如联机银行系统),对用户界面的设计常常与专业设计师共同完成。即便如此,要想设计出易用的用户界面,负责人本身也必须先学习相应的知识和技术。此外,也可以根据系统规模、开发方式的不同,给予程序员适当的设计权限。在这种情况下,即便是技术人员也应该具备上述技能。

或许,在这里归纳出来的内容,有的是大家认为理所当然的,有的是在现阶段还不明确的。而本书将对这些要素产生的背景、原因,以及其与日常生活和习惯的关联性加以说明,并会详细介绍将其运用到用户界面的方法。第 2 章和第 3 章将会分别针对界面的设计效果及用户的操作方法进行具体阐述。第 4 章会归纳和总结系统中一些典型问题。

1.2 人为失误的增加及其带来的影响

在现代社会中,随着计算机的不断普及,系统故障带来的影响也越来越大。而用户的操作失误,是无论在系统开发时进行了多么严格的测试,也是无法避免的。这种因用户操作失误导致的过失,称为“人为失误”。

本节将对人为失误进行简要说明,同时还会介绍几个系统操作中的事故案例。

1.2.1 什么是人为失误

在核电站、航天飞机或电车事故等的相关报道中,总是能听到“人为失误”这个词。“人为失误”,顾名思义,就是“由于人为原因造成的失误”。核电站、航天飞机等一旦发生机械或系统操作问题,会直接关系到人身安全,“人为失误”这个词就是在应对此类事故的过程中出现的。目前,医疗、汽车及铁路等领域也正在积极地研究应对措施。另一方面,随着计算机的普及,不仅是与生命安全息息相关的机械操作系统,在金融、流通等领域也急需找到应对人为失误的办法。

但由于人为失误包含了所有由人为原因导致的操作失误,所以需要考虑到多种不同的失误情况。在对人为失误进行研究时,可以对这些失误进行大致分类。例如,从人为操作的角度出发,可以分为疏忽(slip)、疏漏(lapse)、错误(mistake)三大类。

【根据人为操作进行分类】

  • 疏忽 由于看错或者想错,进行了不当的操作而导致的失误。

  • 疏漏 由于忘记要进行操作而导致的失误。

  • 错误 由于操作本身出错而导致的失误。

另外,也可以将整个操作过程分为输入、传播和输出三部分,分阶段对人为失误进行分类。

{%}

图 8 操作过程中出现的人为失误

【根据操作过程进行分类】

  • 输入过程 通过视觉及听觉所获取的信息错误。包括看错或听错等。

  • 传播过程 与人类思维相关的失误。包括判断错误、记忆错误等。

  • 输出过程 系统或机器的操作失误等。

上文列举了两大类人为失误,这些虽然都是在研究机械操作的基础上整理出来的,但在研究计算机操作时也完全可以照搬过来。例如,在操作系统时,输入过程是读取显示器上的内容,输出过程则是通过键盘或鼠标进行操作的过程(这些是从人类的视角进行的观察。对计算机而言,输入和输出的过程正好与之相反)。近些年来,随着网络的使用日益频繁,影响范围可以在短时间内急速扩大,发生的故障也越来越严重。十年前,通过软盘将某一系统中生成的数据发送到其他终端时,操作过程中的分工十分明确,一般还需要准备每个操作步骤之间用于确认的单据等。而现在,大多是联网系统,一个小小的失误也会导致错误的数据瞬间就传送到了其他系统上。

随着用户对计算机的操作越来越熟悉,人们对键盘和鼠标的操作速度也越来越快,甚至在开始操作前都不会认真阅读信息,而这些行为无疑都增加了人为失误发生的几率。另外,随着系统操作越来越熟练,操作时心理障碍降低,很多时候也都无意识地省略了对用户界面以及处理内容的再确认。

其实,用户一边打着瞌睡一边还能顺利进行操作的系统是不存在的。尽管用户认真操作,可在操作的过程中也难免发生错误。实际上,与其说“只要认真操作就不会出错”,还不如说“如果不认真就会发生失误”。

对于那些一旦操作失误就会带来较大损失的系统来说,即使代价是牺牲用户在操作上的便利性,也应该尽量以安全性为主(即安全性与便利性的权衡)。即便是那些危险性较低的系统,也应该在考虑便利性的基础上确保安全性。因此,在研究人为失误时,必须透彻地理解认知科学的基础,即人类的动作、认识、学习等要素。在设计系统时,不仅要解决上节中提到的“拙劣的用户界面”这一问题,设计出可以减少人为失误的用户界面也十分重要。

1.2.2 由人为失误引起的重大事件

本节将向大家介绍几个在使用计算机时,由人为失误引起的重大事件。

  • 瑞穗证券错误订购案

    2005 年 12 月,瑞穗证券股份有限公司在操作嘉克姆公司(现 J-COM Holdings 股份有限公司)首次公开发行的股票时,因操作失误,将“每股 61 万日元”的指令错误输入成“1 日元 61 万股”。事发后,瑞穗证券立即采取措施取消订购,但却因东京证券交易所的系统问题无法取消。最终导致瑞穗证券股份有限公司遭受了数百亿日元的经济损失。而且,61 万股是嘉克姆公司发行总股份数量的 10 倍之多。

  • 购物网站标价错误

    2003 年 10 月,丸红股份有限公司旗下的购物网站因操作失误,将价值 198000 日元的电脑错误地标价为 19800 日元。面对网络上蜂拥而至的订单,丸红公司最终接受了 1500 台订货。在与买家几番交涉之后,丸红表示“不能违背消费者的意愿”,只能将错就错,按错误的价格出售。究其原因,仅仅是因为在向网站录入价格时发生了操作失误。

  • 电子钱包重复扣款

    2008 年 10 月,日本的新闻媒体报道了便利店电子钱包重复扣款的事件。所谓电子钱包,就是持卡人预先在专用 IC 卡或手机中存入一定的金额,这样交易时就无需使用现金了,只需在专用刷卡机上轻轻一刷即可完成支付。使用电子钱包进行支付时,如果收银员没留意顾客已经刷过卡,又重复操作一次的话就会导致重复扣款的发生。这种情况大多是因为店员的操作失误或经验不足。由于使用方很难把握自己的消费记录,并不知道被扣了两次钱,所以还不太清楚损失的实际情况。

  • “紧急地震快报(警报)”的误报

    2009 年 8 月 25 日,日本气象厅向千叶县、茨城县、东京都 23 区、神奈川县东部、琦玉县南部发布了错误的紧急地震快报(警报)。误报的原因是由于千叶县南方总市的观测点向外界发送了异常的振幅数据,所以才导致气象厅误报可能会发生 5 级以上的大地震。但调查结果显示,厂家在维修震度计的功能软件时,对并非维修对象的紧急地震快报处理系统也进行了调整,结果导致软件发生异常,发出了错误的数据。厂家与气象厅的沟通不够、气象厅的管理体制本身的问题、厂家和气象厅的负责人没有提前对系统进行测试并确认相关检修顺序等诸多因素交织在一起最终导致了误报的发生。

以上事件说明无论使用什么样的系统,只要是人为操作,失误总是在所难免的。所以说,在构建系统时,必须将“人类是会犯错误的”作为前提。对于系统中人为失误的应对措施,4.1 节将会做详细介绍。

目录