在从事设计之后,我一直预防自己变成用户的“奴隶”。很不幸,现在的氛围却在把一些设计师变成用户的奴隶。
网志开头的那张图,是我在项目过程中遇到的一个例子。原来的设计是这样的:
![]()
看似很小的一个改动,其实能反映出大问题。我在下拉框中放默认选中的工商银行,是因为信用卡还款的用户中工商银行占据了大半壁江山。这样大部分用户就能少操作一次,尽管这里会分散一点他的注意力,也许他会试着点一下下拉框,看看是不是有问题直接把工商银行放出来了。但完全值得,因为这个学习成本很低,用户将从中获利。
过火的设计
由于银行之间的竞争关系,在实际情况中这里不能放某一具体银行。于是我建议默认状态的下拉框什么都不放,如下图:
![]()
但交互设计师认为,这里应该设计成网志开篇那张图的样子,也就是下拉框中加上请选择银行这句话,并且用链接色。理由是,让用户知道可点击这个下拉框。于是我哭笑不得。下拉框是标准的原生控件,不仅如此,它是伴随着图形化操作系统一路发展而来,我敢说只要是用过电脑的,没有一个用户不知道下拉框是干什么的,以及它可不可以点击。
在这里加上一个链接色的文字对于让用户点击毫无帮助。下拉框里的空白是让用户明白这里是空的,需要你填写。在用户一眼扫过表单的时候,即定位到哪些是我应该填写的。如果这里放有链接色或者正文色的文字,会有一个这里已经默认填写掉了的感觉;而用户视线定位到这个下拉框的时候,又发现这只不过是句废话。。。
《Don’t make me think》教了我们许多,被很多人奉为圣经,但他全书并没有说需要这么干才是让用户不用费脑筋思考。相反,这么干了,用户才会花时间思考。设计师需要预防这种心态,过于担心用户,会毁了自己的设计,长久以往,则会毁了自己作为设计师的直觉。事实上,不能把用户当傻子来看,这不是真实环境中的情况,用户要比一些设计师想像中聪明得多,而且乐于学习。而易学性,却是现在最被忽视的。
感谢众多网友来参与这个讨论,我又延伸开去想了想,且看下面这个例子:

上图是wordpress的下拉框,它在框里默认显示的是bulk actions这个短语。为什么要这么做?因为它前面没有label,于是在这里放上bulk actions,起到告知的作用。试想如果前面有个label叫bulk actions的话,很难想象wp会在框里再放上please act…。
另外关于加上“请选择银行”,就会让用户觉得舒服的问题。我觉得这已经不是设计的问题,我的设计是要让用户用得爽,姑且不论用户看到这句话会不会对他产生触动,这句话本身是对用户的操作没有帮助,且有影响。对你的操作有影响了,还在言语上让你觉得舒服,你最后会舒服么?
最后,我固执的认为,这句话是废话,就算要放,也不能用链接色。

iefen
06/10/2010, 11:19
师母阿,在我们不了解用户的情况下,担心成为用户的奴隶,也是说说的、猜猜的、想想的。。
diyism
06/10/2010, 11:54
有道理, 留”空”确实比”请选择”要好.
shimu
06/10/2010, 11:55
@iefen 单就下拉框来说,用户的习惯其实已经随着时间沉淀下来,比较明确了。往大了说,ella还是看得更远些~设计师的财富之一就是经年累月积攒下来的对用户的理解。
草根网
06/10/2010, 12:16
好文,收藏至20ju.com
someone
06/10/2010, 13:44
不认同最后的观点,道理很简单:
如果我们渴了,一个盛满水的杯子和一个空杯子,我们显然会选择前者,因为它显而易见。
一个空的下拉框,给人的感觉是里面“好像没有东西可以选“,其实也是造成了一个迟疑。
阿里飞舞
06/10/2010, 13:46
阿里飞舞-关注阿里的点点滴滴。希望可以得到您的支持(如:链接、资讯),因为您的支持就是阿里飞舞成长的动力。非常感谢!
someone
06/10/2010, 13:49
”请选择银行“,其实不是一个废话,这个文案其实也礼貌地给予”信用卡发卡行“那一个标题做了一个引导。
比如有一个客人进门,我们不能只是打个手势,连一句”请从右边走”的话都不说,那也是不礼貌的。
设计不是全然追求极致,还要做到取舍有度,温文尔雅。有一些冗余的东西还是有必要留着的。
shimu
06/10/2010, 15:26
@someone “礼貌地给予引导” 这实际上是YY,用了请字用户就能感受到礼貌了么。。。。。。。我说“请选择银行”是废话,因为下拉框本身就能表达出这个含义,多了这句话,而且用的是链接色,则干扰了用户。
如果只用“请选择银行”,不用链接色,问题也是不大的,因为这种学习成本很低。
小大脸猫
06/10/2010, 15:26
不同意最后的观点,应该加上请选择银行这句话,空的框非常奇怪,用户肯定有疑惑,如果有个提示句会更好。太想当然啦!
harvey
06/10/2010, 15:41
作为一个纯粹的用户,我自己觉得,有那句“请选择银行”是舒服的
shimu
06/10/2010, 15:45
@小大脸猫 空是因为,这里不能放select里面的option——银行。为什么要有提示句,用户为什么会疑惑?作为一个用过电脑的人,难道不知道这个select是来下拉选择的? 难道前面的label不足以让他知道这里是选银行的?
someone
06/10/2010, 15:49
其实礼貌不是因为那个“请”字,而是需要有文字来体现,不然空空的,给人的感觉就是很默然。我不是说了吗,你不能只是给别人一个手势,你还要说话,别人才觉得舒服。
当然,也不绝对,有一些交互是可以实用隐喻,或利用用户的直觉,但必须确保文案是完整的,就拿你这个例子来说:
完整的文案是“信用卡发卡行,请选择银行”,残缺的文案是:“信用卡发卡行…”。
我也不确保自己说得对,纯粹交流,呵呵。
someone
06/10/2010, 15:54
当然,文案完不完整也不绝对,要看是否有上下文关系,如果没有上下文关系,都是独立的元素,那么可以不强调文案。
mouse
06/10/2010, 16:01
公园里的长椅,人人都知道是可以坐的,但如果旁边写个“请坐”二字,那感觉就是不一样。
mouse
06/10/2010, 16:04
BTW, 楼主应该还知道,有一种下拉列表是既可以选,又可以填的吧。加上字,想都不用想就知道是哪一种了
吴哥
06/10/2010, 16:11
我觉得你这个设计太矫枉过正了。
shimu
06/10/2010, 18:40
@mouse 那不是原生的下拉列表,这篇网志所谈到的也不是那种控件。
shimu
06/10/2010, 19:00
@someone 我之所以说请选择银行是句废话,是因为下拉框它本身就表达了这个涵义,不需要再放一个文案上去,须知这是干扰,和对待客人的环境有所不同。
crossyou
06/10/2010, 21:34
那你要是空着的话,意思是说用户可以自己填写吗。
我比较同意someone的观点。
CK
06/10/2010, 21:56
把“请选择银行”改为灰色。
shimu
06/10/2010, 22:49
@crossyou 不是,这个是标准下拉框。
shimu
06/10/2010, 22:50
@CK 灰色是一种处理办法,也是很多人爱用的,不过我认为应该更彻底一点,该去掉的冗余就不该让它显示。
ppwu
06/10/2010, 23:22
我并不是很赞同楼主的看法哈,做为用户,我已经习惯了“废话”,“请选择城市”、“请输入关键字”、“请***”,看到空空的下拉框我反而会不习惯。当然,或许我已经不是“普通用户”,是另一个被用户的奴隶设计师…
collinye
06/10/2010, 23:53
我个人觉得,用户的习惯很重要,用户习惯了“请选择银行”这种方式,一看到这个就会去点,没有必要在这个时候变成空的,让用户楞了一下。
神飞
06/11/2010, 00:01
有没有找一些最普通用户来调研一下呢?
普通用户的实际观点未必是大家的经验或推测
常常是数据更能说明问题,也更能说服人~~
even
06/11/2010, 02:31
不妨用数据来说话?
L
06/11/2010, 09:20
默认工商银行这一点我会不爽,不跟大多数人一样你就当我非主流啊,受到不公T T= =爱存不存的用户似乎也不会觉得有很贴心吧
shimu
06/11/2010, 14:49
@神飞 目前没有,其实我只是这个项目里的视觉设计师,项目时间很紧,我也没想过多纠缠这个问题。其实这篇网志的目的不是讨论这里要不要放“请选择银行”,而是抛出思考这个设计的想法。
shimu
06/11/2010, 14:51
@even 这里用A/B test肯定不错。我设想了一下,判断标准用用户停留在这块表单的时间。
shimu
06/11/2010, 14:51
@collinye 有时候用户的习惯是“坏”的设计养成的。
shimu
06/11/2010, 14:52
@ppwu 你说的有道理。其实一部分文案不是废话。比如“请输入关键字”,这是对前面label(可能是搜索)的补充。
justin
06/11/2010, 15:34
当然是要放,“请选择。。。”,不要链接色。
justin
06/11/2010, 15:35
我觉得这里有个用户心理预期的问题
Jessica
06/11/2010, 23:30
首先说,非常喜欢你博客的设计,很能显现功底。就是不知道评论为什么要居中,而不是与评论列表对齐。
日常工作中,我们也面对很多这样的设计细节,确实很难白扯明白。
我还是比较欣赏什么都不放的那个方案,不是因为银行之间的竞争关系,而是会有部分不是工行的用户选错银行。
建议默认是什么银行都不选,如果用户选择过一次之后,用cookie记录一下,下次登录时默认选择上次用户选过的那家银行就可以。
小细节会反映出大问题,你的思考很不错!
shimu
06/12/2010, 00:49
@Jessica 谢谢你的喜欢,评论那块回头我具体看看,可能改过样式了。
用cookie记录是很好的办法!现在就是这么做的。
小安
06/13/2010, 08:35
我比较赞成的是灰色的“请选择银行”
我对于下拉框的理解,里面如果有灰色的文字,是提示,如果是正常格式的文字(和下拉列表里面的项一样)就是系统先默认选择了。
这已经渐渐成为交互上的通用手法,感觉现在的互联网产品已经比较少有空掉的下拉框了。
scv
06/13/2010, 09:04
矫枉过正的不是交互师,是你
shoto
06/13/2010, 09:29
个人觉得有一个请选择还是好一些。毕竟还有些新的运用网银的用户。
再一个,空的话会让我有一种可以填写的感觉,我会支尝试点击的。
shimu
06/13/2010, 11:56
@shoto 问题的关键不是在于有没有请选择,而是请选择要不要用链接色。
shimu
06/13/2010, 11:57
@shoto 你的理解是对的。
懒猫
06/13/2010, 12:29
个人觉得那个提示还是有必要的,只是颜色用灰色就好。至于博主说“下拉框是标准的原生控件…我敢说只要是用过电脑的,没有一个用户不知道下拉框是干什么的,以及它可不可以点击”,这句就是博主的个人感觉,用户体验考虑的是用户,大多数考虑,少数也要考虑,中国有四亿网民,但中国有13亿人口,每天都有新用户产生,也有那么比部分人连下拉框是什么都不知道,其实加上那句”请选择银行”,不会给谁带来困扰,反而方便了某些人,何乐而不为呢?
shimu
06/13/2010, 13:23
@懒猫 我考虑的不是13亿人口,我只考虑4亿网民。这个产品的用户就是这4亿网民里的。不知道下拉框的用户,你让他在网上转帐付款?
懒猫
06/13/2010, 14:30
@shimu 抱歉,也许我的说法让你产生了误解。事实上,我所说不是4亿网民与13亿人口的问题,问题在于不知道下拉框并没什么好奇怪的,他们更不必去考虑下拉框是干嘛的。有很多软件的下拉框做成一个可输可选的控件,而对于用户的操作习惯,作为设计师是很难把握,所以尽可能去引导他们,少走弯路,少思考。至于他知不知道下拉框,以及做什么用的根本无关紧要。
shimu
06/13/2010, 14:51
@懒猫 为用户思考,这个方向是没问题的。
有很多软件的下拉框做成一个可输可选的控件,而对于用户的操作习惯,作为设计师是很难把握,所以尽可能去引导他们,少走弯路,少思考。
这个还是要到具体环境中来看。如果我的下拉框完全能满足需求,就只需要原生下拉框了。把简单的事情搞复杂,不是去引导用户,而是把他们搞糊涂。
boing
06/13/2010, 15:58
1、个人觉得,这个问题不在于要不要在下拉框中输入文字,在于下拉箭头的颜色是否醒目,是否在提醒用户。就像wordpress的下拉框的下拉箭头,应该是默认款式的,绝对要比那个灰色的有效的多。
2、其实默认一家银行也是不错的选择。最好是广告客户的,呵呵。我只是觉得空白再加上后面的下拉箭头不太舒服,感觉有一种搜索框的效果(只有一点点吧)。
3、应该可以考虑在下拉框默认项用传统的灰色“选择信用卡发卡行”,去掉前面的信用卡发卡行。应该也是不错的吧呵呵