应对极端并微小的错误的网页用户体验设计

用户是上帝,即使用户是无理取闹的,也是在帮助我们提供发现问题的机会。

本文所说的无理取闹的用户,其实是设计师自己。因为设计师是最无理取闹的用户(为什么呢?)

有一些极端的情况,做为真实的客户,也许一辈子也遇不到几次。

如图:

1. 你会在search bar什么都不输入的情况下就按search button吗?

2. 明知道这个输入框应该不支持字母,也不应该超过最大页码,还输入这样的数值吗?

3. 在价格区间里输入字母,比如a?

一般人都不会,设计师例外。设计师得考虑到种种极端的情况,以及在每种情况下如何让系统响应,于是他就成了最无理取闹的用户。设计师如果不考虑这种很mini也很没价值的细节,万一某天遇到一些无理取闹的客户,一试试出了问题,他会在某某blog上,写哈哈,这个很牛的网站原来会犯这种错误——我承认,这种行为一般还是所谓的设计师干得出来。

Anyway,今天,终于完成了项目的设计说明文档后,心怀对某些校验细节的纠结,我也无理取闹了一把,“骚扰”了众多网站,尝试了各种极端情况,也发现了有些貌似体验良好的网站的尴尬与措手不及。但是说真的,who cares?毕竟真实的用户不会这么做。

今天不玩大的,就玩简单的页码和价格区域的极端情况。

一,淘宝

1. 在价格区间里输入字母——淘宝即时自动清除,压根就不让你填写,比较强的是,即时我无理取闹到粘贴1A1这样的字符串,淘宝也即时将中间的A过滤掉。

2. 在页码输入框里输入字母——点击确定后,页面刷新,页码还是定位到页码1,同时,输入框里也清除掉字母。

有趣的是,即时我当前已经在其他页面,如第99页,在输入框里输入字母后,页面刷新,还是给我定位到第一页。

3. 再无理取闹一些,我在输入框里输入了200,超出最大页码,页面刷新后,淘宝仍给我定位到页码1.——貌似逻辑是输入不合规范要求的字符,统统刷新后回归页码1.

我的评价:第一种情况,方案尚可,避免出错,也不会弹出提示。第二种情况:定位到页码1就傻了,为什么不能停留在我当前的页码上。至于第三种情况,我倾向于定位到最后一页。

二,eBay

1. 在价格输入框里输入字母——点击go,出现提示,恩,看起来有点费劲。

2. 在页码里输入字母——go左点右点点来点去没任何反应,eaby是在说:你无理取闹,我干脆不理你,看你怎么办?

3. 在页码输入框里输入超过最大页码的数字——点击go后页面刷新,定位到最后一页。ebay是在说:不好意思,我们顶多就这么多。

我的评价:第一种情况,还是比较的出错提示的。第二种情况,我以为系统卡住了,等了半天。第三种情况,ebay做得还不错。

三,阿里巴巴国际站

目前没有价格区间,只有骚扰页码了。

1. 如图所示,输入字母后点击go出现警示框——而且还是感叹号。唉,一本正经的严肃的阿里巴巴。

2. 在输入框里输入超过最大页码的数字——页面刷新后,回归到第一页。

我的评价:一本正经的提示,过火了。第二种情况,页码对溢出数值的反应和淘宝一样,需要改进。这点,定位到尾页是不是更符合用户原始需求?

四,Google

 

 google没跳转到第几页的功能,就拿图一中的zip输入框尝试情况1.

1. 输入字母——点击go后,页面刷新,除了将刚才的字母清除,任何变化也没有。

2. 在价格区域输入框中输入字母,点击go后,页面刷新,清除了刚才所填的字母,还是任何变化也没有!!

看来google的策略就是:你无理取闹,我也无理取闹,你拍个巴掌回来我就拍个巴掌回去,你不理解我的响应?那你到底在期待什么结果?

也顺便骚扰了一下中国的有道购物拍拍两个网站,发现方案跳不出以上的几种。但是,还是有些细节上的差异,比如,在有道的价格输入框中,先是输入正确的数值(如1-100)后,更换为字母,页面像google一样照常刷新,但是会回归到上一次的状态(1-100).

google在同样的情形下,却回归到初始状态。

映射到现实生活中的案例:

骚扰到这里,头脑里突然闪现出一幅画面,如果你有一天,很无聊,去无理取闹一下(傻子也可以啊,傻子就不能是叫做无理取闹了),去一个西瓜店,对着店主说:老板,请给我一个足球。

老板可能出现的反应和我的反应:

A. 装作没听到,没有任何反应,再喊一声,还是没反应。

——他聋了吗?还是压根没注意到我?eaby翻页就是这样干的。

B. 吼一声:你有病呀?没看到牌子上写着西瓜!

——我好害怕呀,这个老板心情不好吧?阿里巴巴翻页就是这样干的。

C. 直接给你一个西瓜。再问,还是给你一个西瓜。

——先是莫名其妙,然后,哦,原来这是西瓜店。google价格是这样干的。

D. 问你:啥?你再说一遍?我又说:请给我来一个足球,老板还问:请给你来个啥?

——哦,好吧,我服了你,我还是要西瓜吧。淘宝价格是这样干的。

E. 哦,某位同学说了,为什么不能把你要求填写的规范直接写出来呢?那就可以避免出错了呀,某些情况下是可以(若预料到50%的人会出错),但是很多时候也如同一幅滑稽画面:“西瓜店门口竖起硕大的牌子,说——本店只卖西瓜,请不要到本店买足球或其他物品”。

总结一下:面对“极端并微小的错误”时,各个网站的反应:

值得说明的是,具体设计时,肯定要“具体情况具体对待”,比如淘宝的自动纠错,固然不错,但是也只适用于字符单一限定的情况,比如价格区域不可能出现字母,所以可以即时清空。而google shopping中的zip,states那个输入框,同时存在多种字符,就不能够自动纠错(需要整体语义判断),就好象一个顾客说“老板,我要一个足球——一样的西瓜”,得等用户说完。

不弹出警示框,也不破坏页面结构,大家不妨帮google想想这个地方的校验,除了自主响应,还有没有别的方案?

校验的包容性:

任凭想破了脑袋,我们还是不能预料到所有填写出错的情况。用户输入6a我们可以清除字母,用户输入6.我们可以换算为6.0,用户输入6.6.6.呢?

这就是前几天我被问到的问题……

校验,似一道关卡,我们有原则,也有人情。这个人情就是——包容性,能不提示出错就不提示,能让用户操作不中断就不中断,甚至在一些甚为微小的出错中,我们可以直接替用户做主。

先举一个反例不够包容的校验,来自某某B2C网站:


这个网站完全可以避免弹出这个不够亲切的窗口:直接检索价格等于99或者小于等于99的产品即可。

在这种情况下,有很多网站做得相当不错,即使将价格输为前大后小,一样能够包容通过:自动转换为前小后大。他们是怎么做到的?一句话:多替用户想想,多想想细节。用户体验不是夸夸其谈就谈来的。

校验的包容以价格区间举例:

1. A输入框输入数字小于B输入框:

正面案例:淘宝和eaby、google均能够自动替换为前小后大,出现相应的区间结果。

反面案例:在amzon价格区间中输入300-100.网站照常刷新,但是结果和筛选调整停留在输入之前的状态,看来是输入无效。

2. A和B两个输入框输入.6或6.这样的字符组合:

正面案例:Amazon和eBay均会把6.换算为6.0,而.6换算为0.6进行搜索。甚至在eaby的价格输入框里输入..6这样的字符,它会自动四舍五入,以0.01进行搜索。

反面案例:goole只将6.这样的字符换算为6,但是若输入.6这样的字符就熟视无睹,不影响结果且会被清空——看来google认为不应该有那么便宜的商品。上文说淘宝是自动清空非数字字符的,所以即使小数点是价格的一部分,它也照清不误。

而顺手试了一下拍拍的表现,啊噢~

老实说,单纯从字眼上扣,我认为我可没错,我输的难道不是就是小数点和数字吗?

3. A和B均输入一样的数字,如100.

正面案例:ebay、淘宝、amazon均是直接用price=100进行搜索。

反面案例:google,它直接说没有找到任何结果。这一点我理解google,因为它都是采集的产品,都是价格区间,也许找不到完全符合价格等于100的产品,但是是否也可以按“小于等于100”来搜索?

4. A输入框输入数字,B输入框留空。

基本上都算是正面的例子,各个网站都是按照大于等于A输入框中的数字进行搜索。反之,若在B输入框中输入数字而A留空的话,也是按照小于等于B输入框数字进行搜索的。

校验的“万全之策”

当然,任凭我们怎么绞尽脑汁,也不能完全预料到用户会如何输入,比如我干脆输入.6.6.6..6,你能怎么办?聪明的eaby都傻眼了,只能提示说:

但是也可以用:只留两个小数位和只保留第一个小数点的方式进行包容,我们的前端就这样做了,他们技术很牛。

但是,包容总是有一定的限度,必要的时候还是得严肃一些,不然不但让我们这些设计者牺牲了大量的脑细胞去想这些也许不可能出现的意外,还会让系统有很大的压力。

所以,我们可以预测到一些情况,如上文输入框A和B的故事,给出转换的方案。然后,在这几种情况外,需要给出一个统一的方案:如淘宝的清空战略,又如ebay的红色提示,再如google的“自主响应”战略。具体问题具体对待了。用户体验是保障大多数用户体验良好,不是极少数,必要的时候牺牲一下这极少数的用户体验也未尝不可。

所以我才反对在用户还没输入的情况下就严肃地提醒:请在价格区间里输入正常的正数数字(半角),格式如……,这就好比是在西瓜店门口竖着一个硕大的牌子,曰:本店只卖西瓜,请不要来本店买足球等其他物品,让那99%的本来就是要来买西瓜的人觉得莫名其妙,破坏了大多数的“正常用户”的体验。

时间: 2024-09-21 06:10:53

应对极端并微小的错误的网页用户体验设计的相关文章

网页用户体验设计:精简模式的播放器设计

网页制作Webjx文章简介:视频网站播放器的精简设计. 播放视频时去掉播放器多余的边框减少干扰是体验中很重要的一步,于是有了播放器的精简模式,而当显示器的分辨率越来越大时,一般精简模式提供的1倍.0.5倍的尺寸大小显然有些不合适 边看视频边做其他事情是很多人在上网时会做的,而播放视频时去掉播放器多余的边框减少干扰是体验中很重要的一步,于是有了播放器的精简模式,而当显示器的分辨率越来越大时,一般精简模式提供的1倍.0.5倍的尺寸大小显然有些不合适,这个时候我们需要手动播放器的边角或是边框来放大播放

网页用户体验设计:有趣的下拉刷新

文章描述:下拉刷新这一部分的细节设计,可以是传达产品价值.推广品牌理念的一个机会,精心做一些特别一点的设计,就可以让大家记住你.所以,我们可以在以后的产品设计中,把握好产品大方向的同时,兼顾一些这种小细节设计,把我们的品牌元素和产品价值的东西能够成为产品的一些 5月22日,Twitter正式宣布获得了下拉刷新的技术专利,这项专利是在一年前提出的,虽然公司一再说明此项专利只用于保护自己,不会用来发起诉讼,但无疑这还是对行业来说是一个威胁. 下拉刷新这个操作最早由Tweetie创始人洛伦•布里切特(

以用户为中心的设计:网页确认框的用户体验设计

文章描述:以用户为中心的设计:网页确认框的用户体验设计. 确认框,顾名思义,对关键的用户行为进行确认,比如"询问是否删除","告知已删除".根据网上的观察,发现有的网站对确认框的设计缺乏合理性.本文谈谈自己的思考. 类别 根据触发目的,确认框分为两类:询问和告知. 询问 转推的确认框 询问,类似 Javascript 里的 confirm(),即:是否去做? 告知 Flickr 的告知 告知,类似 Javascript 里的 alert(),即:做的状态. 必要性

触屏手机网页产品设计用户体验设计经验分享

文章描述:历时数月,连番经历了多个基于触屏手机原生浏览器的网页产品设计与开发.对触屏手机用户体验设计有了进一步的认识,也颇想分享些心得. 历时数月,连番经历了多个基于触屏手机原生浏览器的网页产品设计与开发.对触屏手机用户体验设计有了进一步的认识,也颇想分享些心得. 上篇包括以下一些内容: >>精神与基础 何谓高端--高端设计精神 平台间平衡 不同分辨率及比例间移植 浏览器框架 >>设计"泛"过程 移动场景下的用户需求 少即是多的设计原则 界面气质 -------

起底六种最常见的用户体验设计错误

  越来越多的同学开始着迷UX/UI设计,这个领域的高手和爱好者也越来越多.于是大量新的想法.设计流程.设计手法以及形形色色的"原则"开始出现在这个领域当中,用良莠不齐这个词来形容UX领域其实非常恰当.用户体验设计需要你作出艰难的决定,成为优秀的设计师并不容易,你需要从错误中不断汲取经验教训,成就自己.人们总是犯着类似的错误,新的思路听起来很不错,但是并不足以成为用户体验设计的标准,但是也正是这些错误的修正,造就了真正优秀的设计. 许多概念看起来炫酷,但是稍加推敲就会发现它的谬误.还有

《众妙之门——用户体验设计的秘密》一第2章 设计“好脾气”的网页2.1 巴赫和他的十二平均律

第2章 设计"好脾气"的网页 众妙之门--用户体验设计的秘密 Rob Flaherty 科技在进步,网页设计的技巧也在进步.新的科技带来了新的挑战,因此,也需要新的解决方案.有时,人们面对崭新的未知领域,实在是毫无经验,只能根据直觉去打造解决方案.而有时,人们在新领域面对的问题有过去的影子,可以从历史和别人的经验中找到答案. 相对其他设计那漫长而又荣耀的历史,网页设计的历史有限,因此能给出的经验也相对有限,人们不得不借鉴这段有限的历史去解决近乎无限的问题.虽然也可以学习图形设计和视觉传

从文字着手 切实提高网页用户体验

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 如今百度越来越重视用户体验这已经是一个不争的事实,一个网站如果想要获得高质的流量以及较低的跳出率,就必须重视用户体验,这也就是为什么网页用户体验优化成为SEO必须掌握的技能之一.可是有些站长会说自己也知道用户体验的重要性,但是却不知道该从何下手,仅仅是做好网站的内链以及开设几个订阅按钮吗?当然这也是其中的一些方法,笔者也是赞同的,不过,大家要

网页设计技巧:用户体验设计和UI设计

网页制作Webjx文章简介:最近由于自己要做一个小网站,但是还苦于找不到一个合适的美工和设计,只能自己上了.于是便看了一些关于用户体验和UI方面的书. 最近由于自己要做一个小网站,但是还苦于找不到一个合适的美工和设计,只能自己上了.于是便看了一些关于用户体验和UI方面的书. 这个就当是个读书笔记吧. 1.常规的页面布局 常规上来说,我们把网页布局按照分栏的多少分为一栏式,二栏式和三栏式. 对于一栏式页面布局来说,一般在页面上放置一个具有冲击力的图片或者Flash来给用户留下深刻的印象,但是,这样

让你的网站受大众欢迎 设计网页的用户体验设计

在一般设计网页的时候,你必须要注意几个问题,第一就是你必须要规避你自己的喜好,你要知道你喜欢的东西并不一定谁都喜欢,比如网页构成色彩,你喜欢大红大绿,并且你的网页充斥着这样的颜色,那么你一定会丢失掉很多你的潜在客户,原因很简单... 站在浏览者的角度考虑,你是喜欢漫天广告的网页,还是有更多实质内容的网页? 显而易见,你一定是选择后者,这是人之常情,这就是最简单的用户体验(User-Experience,简称UE),也是最直接影响你的网页浏览度的因素.很多时候,用户体验直接影响到你的网站是否成功.