新潮流: 表格变填空 – 与冷冰冰的网页对话
发表于 2010/02/25, 6个月10天之前
还记得英语考试里的填空题吧? 在考场以外,貌似填空这种模式比整齐划一的表格更让人感到亲切。
今天@lukewdesign在网站上发表了一篇短文,解释了一下填空模式表格的实验,初步发现转化率提高了25-40%,可以说是非常显著。
看了图就明白了,这个界面是与汽车经纪联系,询问汽车记录的页面。比较左面与右面的两幅图,我似乎能感觉到左面的图是冷的,右面的图是热的。
细节比较
语气变化
指示性的”联系这个经销商”,被换作第一人称“我感兴趣”。同时也避免了“经销商”这个往往给人虚伪感觉的词。
人形图标
虽然可能这个人形图标看起来不显眼,但是让人不经意间感受到似乎是在与一个人交互。注意两幅图里经销商的名字不一样,电话也不同。这是实验的设计,在不同的经销商的页面使用不同的界面,以方便比较。
主体嵌入
问答式的表格变成了一个短信的一部分,似乎让人感受不到在给出私人信息,而只是填充必要的联络方式。因而让人感觉更亲切。此外,“必填”的字样似乎也不再需要了。
一个谢谢送温暖
不过我有点搞不清楚这个是作为短信的一部分表示用户谢谢还是网页谢谢用户。
我觉得这个必将成为潮流,你觉得有什么启发么?
来源: http://www.lukew.com/ff/entry.asp?1007, Luke Wroblewski (@Lukewdesign) 是Yahoo!当前的首席设计架构师。





成为潮流那可未必。成为部分网站的选择追倒是可能的。
它有两个缺点:结构比较混乱,页面不太整洁;
用户要读句思考的地方比现有的多,对于拥有现有普通注册习惯以及思路的人来说有一点小挑战;
是的,谢谢你能提出不一样的看法。我在写“成为潮流”的时候,脑袋里想的是SmashingMagazine一类的网站撰文“Design Trend for 201x”的话,可能会包括这个方式进去。
不过呢,页面整洁度与转化率相权衡的话,似乎转化率胜出的可能性高一些。
safsdfsafsaf
Don’t make me think 左侧的不think,右侧的会think。也许在这个case中合适,不能一概而论,得量体裁衣:)
量体裁衣是对的。我个人不是特别喜欢Don’t Make Me Think这本书,因为感觉似乎把复杂的世界简化成了”made me think”和”did not make me think”的二进制世界。像你说的,根据情况应用最有效。这也是设计师的价值所在,不然大家都整齐划一的选择0或1就好了。
如果从效率上看,左边的应该高于右边的。
右边打的是温情牌
对于一个新的网络用户来说可能右边的更好一些。不过对于更多的用户来说左边的效率理应更高。
我同意这种分析方式
这个应该不会成为潮流!不直观,瞬间难以理解。
这个我也说不准,让我们一起拭目以待结果吧。hoho
能不能成为潮流难说,但起码这是一个很不错的尝试。作为一个普通的互联网用户来说我已经很厌烦那种冷冰冰的表单了!
同意。如果我是用户,看到右边的表单我会感觉这个网站很有爱。
感觉好像应该专门开个贴讨论一下设计与商业的关系。
我觉得左边和右边,两者都有其侧重的使用模式
左边:简单明了,可以标注出必填项或非必填,当用户不得不填这个表单时,用这个方式可以让用户很快过滤完不需要填的信息,快速填写,不用去把整个表单内容一一读完和填完。
右边:亲切一些,但是用户要读句,要去想。适用于那种收集用户资料,用户可填也可不填的时候,亲切的表单会引诱用户填写。
= =额,不知道说的对不对
想法很好,但不整洁,不利于人的浏览,不能在短时间内理解。
一个有一定网龄的用户80后甚至现在的90后可能都不太会喜欢右面的方式,比如网页上很长的文章需要滑动滚轮的我一般也不会坚持看完,填空的模式吸引的应该是对网络不太熟悉或者年龄偏大的用户群,当然这只是我的猜测,具体效果还要时间来证明
右边会给人比较亲切的感觉,觉得不需要填很多东西,而左边呢,就显得有点冷了,一般人都会比较反感(个人认为)。
其实左右各有各的特点与可取之处,如果保留左边的大部分输入形式的排版,然后将左边的“Comments”部分,改成右边的带有提示的文字,把上面已经输入的信息自动导入到comments的内容中,以不同颜色显示,然后允许用户自己作最后的编辑。那样会不会既能做到简,减少思考,又能做到亲切,更好地与用户沟通的目的呢?
挺有意思的,应该也是要看网站的情况及主要受众,哪些人容易接受、是否是主流人群,比如应用类的网站可能就按照左侧来显得严肃正规会更加合适,而社区类网站用右侧的对用户更加亲和等等。
感觉还是右边的好点。左边的感觉太僵硬了。
这个主意很有趣,感觉像与更人性化的电脑在对话,不过这个机器人模仿人类有点笨拙哦:)
[...] 本文来自:http://www.uxd2.com/2010/02/%e6%96%b0%e6%bd%ae%e6%b5%81-%e8%a1%a8%e6%a0%bc%e5%8f%98%e5%a1%ab%e7%a9%b… 标签: 评论 (0) 发表评论 [...]