Archive for the ‘Interaction Design’ Category

上面这个用红色线框标记的符号大家熟悉吧,出现在各类软件界面里的删除符。

要是有人问你删除用什么图形来表示,我想绝大多数人脑海里呈现的第一印象就是这个叉叉了。

就是这个熟悉的不能再熟悉的图形,让我栽了无数次跟头。

因为只要我一想到删除,大脑就自动指挥眼睛去寻找它的踪迹。

在Outlook通讯簿里,这个图形被很醒目的和“保存并关闭”功能放在左边重要位置里。

 

这里的删除“叉叉”是指删除整个“通讯组列表”,而中间有人物Icon的删除,是指删除这个列表里的某个成员。

当我要删除某个成员时,动作已经远远快于大脑的思考,在我想到这两个不同概念前,手已经帮我作出了选择,让我连后悔的余地都没有,“叉叉”这个图形真正做到了“别让我思考”。

其实在我按这个“叉叉”后,只要跳出一个提醒确认,还是可以避免发生这类惨剧的,但Ooutlook没有。

虽然设计师将两个“删除”在图形上作了区分,但这样的做法还是无法区分它们的不同的,至少第一次使用者还是需要猜测,这个时候文字比图形更能说明问题。

比如:“叉叉”的Icon用“删除通讯组”,“人物”的Icon用“删除成员”,我想这样更容易让人区分和理解。

设计师将一个耳熟能详的图形赋予不同含义后,辅助文字的教育成本往往比图形要低的多,也更能让人理解。毕竟图形赋予每个人的想象空间是无穷尽的。

淘宝的投诉类型里有这么一条“收款不发货”。

帮助中心里是这么解释的:买、卖双方在淘宝上成交后,当卖家在收到买家汇款后没有按时履行发货义务,或买家将货款汇入支付宝账户15天后,卖家没有履行发货义务。即为“收款不发货”。

那碰到这种情况如何投诉呢?

在帮助中心里同样有解释:您已付款了,却没有收到卖家的货。建议先联系一下对方,如果联系不上建议及时申请退款,并在“我的淘宝-我是买家-已买到的宝贝”里发起卖家拒绝履行支付宝的投诉。

看了上面这段解释,相信大家都很清楚了吧,至少当时我是觉的我理解了。

最近刚好有个朋友碰到了这个问题,于是我自告奋勇帮他处理,想着顺便可以体验下这个功能。(机会难得 ^-^) 所以我就按上面的帮助顺序进行了操作。

先联系卖家,对方一看我问他发货的事就吱溜一声下线了(或许是隐身),后面几天一直未上线。那这种情况应该属于联系不上了;

于是按着上面的指导“如果联系不上建议及时申请退款”,进行了退款申请;

接着,按照上面帮助中心说的“并在“我的淘宝-我是买家-已买到的宝贝”里发起卖家拒绝履行支付宝的投诉”,我开始了投诉操作。

点击“投诉”,弹出一提醒确认框。

 

点击“确定”,接下来的页面让我傻眼了,看倌您先看看下面这个页面截图。

 

步骤说明很清楚,我现在在“1.选择投诉类型”中,但下面的两个类型根本没有操作的入口,只有两个“申请退款”按钮。

狂汗~  -_-||

没的选择,那只有试着点“收款不发货”下的“申请退款”按钮了,看下面的页面是否能走到投诉的第2步:填写投诉内。

失望啊~  那个操作把我带到了支付宝的交易管理页面。

 

在“退款管理”里,我前面提交的退款申请记录乖乖的呆在那,即没有任何可填投诉的区域,也回不到投诉的第一步。您想啊,我现在都跳到了支付宝页面,咋可能还有淘宝投诉的地儿?

于是跑回淘宝帮助中心,把那儿翻了个遍,还是没找到答案。

怒~ 明明我是按照这条帮助说明操作的,连顺序都按着上面说的做的啊,怎么就有问题?

“您已付款了,却没有收到卖家的货。建议先联系一下对方,如果联系不上建议及时申请退款,并在“我的淘宝-我是买家-已买到的宝贝”里发起卖家拒绝履行支付宝的投诉。

没办法,只能打客服热线(忽略查找热线的曲折过程,反正我现在已经记不清我是在哪找到的了)。

热线总是不好打的,快下班时分好不容易打进了,把我的问题告诉了客服MM,得到的答案简直让人吐血。

“退款”和“投诉”不能同时进行……

天~ 这样还把两件事放在一起说,但就算放在一起说,也应该慎重考虑一下语序用词。即使觉的说辞上不好表达,还是可以在可否操作上加以区分。

个人认为系统应该判断如果买家提交了“退款申请”,那么“投诉”应该不可点,不要可点却不可用,这样会把用户忽悠晕的。

如果非得让用户点进去的话,换个说辞,或在下面的页面里加上说明(比如:退款结束后,才能进行投诉)是非常有必要的,否则就是把用户带进了死胡同。

这个想法我是反映给了客服MM,不知道将来是否会对这个问题进行改进。

我们都不希望碰到投诉这种事,但这个功能真的很重要。
 

以前看到 andy的关于“Quiet Structure”觉的很不错,于是今天到她的个人站点上逛逛,发现不少好的文章,今天介绍的是她关于“ebay”homepage的分析。

整片文章观点认为ebay首页信息不够清晰、内容重复、 最主要的内容没有突出— “The result is a main page that does not do its job very well and which fails to represent the brand as it should。”

可能作者是一个ebay“高级用户”,更倾向于个人定制homepage——也是现在很多网站推出服务。因此其中一些观点有些偏激,不过从不同角度分析ebay的设计问题。

1. ebay首页的内容按重要性划分:

eBay today

作者认为“find my category to buy, sell something, login or register”是homepage的核心任务 ,而整个页面显示核心部分的内容并不是“核心任务”。

Most important features of the page

2. 作者“category”在两个区域显示浪费空间——“search bar”和“左侧导航”

The most important area of the page

3. 作者根据自己想法设计简单的原型:

Here's a design and layout revision suggestion

前不久看到过一遍将导航趋势的文章(现在找不到了):基本说现在的导航越来越商业化,广告的成分越来越多。纯导航正在减少。amazon是典型例子,从以前按类目导航演化成现在引导性广告性更强的导航。这个观点和andy观点还是不同的。

为了降低用户注册难度,国际站的主注册表单一直在改进。主注册三月至今发生了两次较大的变化,现在对表单调整的地方分解如下:

1.  两步并一步

2.  精简了非必填字段

3.  更改了校验视觉样式

4.  利益点,引导意图

5.  放大校验码

6.  简化agreement部分,弱化其他视觉干扰

7.  信息布局划分

8.  文案表述

9.  数据跟踪

就上述几点做详细的解释: 

1-根据国际站的商业需求,需要照顾中国供应商的leads获取,但为了改进表单和降低用户注册的门槛,将分为两步的表单合为一步,但会在表单上做一个明显的提示,引导中供leads[如下图]

改版前的两步注册
 

2-对表单字段做了精简,保留了用户基本信息字段,将原有的字段移到后续需要行为操作表单时填写

 
3-对操作区域做了高亮显示;填写输入时出现tips提示(帮助和e.g.);出错时有更正提醒(在视觉上用叹号的提醒icon,替换了原先略有挫败感的小红叉icon);填写正确有成功的提示(鼓励用户继续进行下一步的填写)[如下图]

 交互提示
4-多次数据证明需要告诉用户一个明白的逻辑:为什么要join Alibaba.com,所以在新表单发布上线1周左右,在右侧添加了注册的benifits

5-如果说表单让人觉得麻烦,那另一个拦路虎就是表单校验码!尤其是对于我们的那些上了年纪、电脑基础相对薄弱的目标用户群;考虑安全问题,不能去除的前提下做了一些清晰提示的小改动,使用了全站统一的校验图片、刷新的提醒……当然这些还不够,追求安全和易用的平衡下不断完善
 

6-将原来的Agreement和Policy的位置移到提交按钮下方,强化引导提交行为,相对弱化Agreement和Policy的引导
 

7-内容上将用户信息定性划分了三个部分;体现在布局上——三块信息,缩短所有字段堆砌,导致冗长的心理感觉;视觉上提醒用户有行为进程,表单不会太长能尽快填完(如下图)
 区块划分

8-一直被忽略的文案是最终的赢家,文字传达的好坏在人的心理影响上起到了很大的作用,非严肃的公文书面用语会让用户觉得轻松一些,降低完成难度
 

9-数据跟踪是我们改进表单的根本依据,所以我们有了水晶观察者,在水晶球后观察用户的困难然后像魔法师一样给他们切实的帮助
后续还将就校验框架的交互表现做专题描述,以及表单改进后的阶段数据观察,敬请期待!