长春网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

首页 供求 博客 电商
黄页 排行 资讯 招聘
娱乐 设计 房屋 拍客
求职 会计 商务 软件
医药 平面 建站 短信
互动 联讯 招标 美食
网事 汽车 教育 旅游
创业 笑话 摄影 运动
传媒 搜索 装修 美容
婚嫁 女性 育儿 通讯
查看: 1614|回复: 0
打印 上一主题 下一主题

交互设计:首页设计的可用性和PET [复制链接]

Rank: 9Rank: 9Rank: 9

跳转到指定楼层
楼主
发表于 2013-3-31 11:30:15 |只看该作者 |倒序浏览

网站的首页是一个让人头疼的东西。有时它看起来很简单:首页就是网站内容的整合,一个[color=rgb(68,68,68) !important]产品经理随便从网站里拿点东西出来,就能堆出一个看上去靠谱的首页。也正因此,它往往非常麻烦:很多人都可以发表自己的见解,而这时交互设计师的一些手段(比如流程图、概念图等),在面对首页设计时也难派上用场,以致最终陷入到无尽的争执中。所以,本文希望寻找一些实用的方法一定程度上帮助设计师来决策,也让大家在争执过程也有些共同的依据。

  首页之所以难设计,我认为因为它不仅要解决用户“能做”的问题,更多时候要解决用户“想做”的问题。“能做”对应的是可用性,相对容易解决,专家评估、可用性测试可以很有效地帮助设计师;而“想做”对应的是PET(Persuation,Emotion,Trust,说服、情感、信任),可能涉及到心理学,人种学,营销学等陌生的知识,交互设计师在这方面就不再是专家了,但一些经验和方法仍可以有效,下文中会讲到。

  将可用性和PET分开考虑

  浏览首页的用户基本分为两种:有目标的用户和无目标的用户。Alan Cooper的“目标导向”理念告诉我们,用户的目标驱动任务,有目标的用户直接开始“任务”,我们只要为他们解决可用性的问题。而那些无目标的用户,他们只是随便逛逛,需要首页的PET足够好,将此类用户“转化”成有目标的用户,尽量避免他们“流失”。

  



  所以我将浏览首页的用户分为这两类,针对两类用户不同的特点来进行设计,会让我们的思路变得清晰。

  



  一些现实例子

  谷歌首页

  对于搜索型产品,所有用户都是有明确目标的,即便首页是多么“死板”,因为没有任何干扰,用户都可以迅速进入自己的任务。所以谷歌首页没有任何PET的内容

  



  赶集网(或58同城)

  这类网站的设计也完全服务于“有目标的用户”,把“无目标用户”无情地抛弃,本人觉得这种设计并不是最高效的方式,因为毕竟浪费掉了大量用户。

  



  京东商城

  对于电子商务网站,存在两种典型的用户情景:

  理性消费者,想要找的东西很明确,或者挑选的范围很小,这就要求首页有很好的可用性,帮助他找到商品,如下图中的蓝色部分就是服务这类用户。

  冲动型消费者,并不知道自己需要什么,只是随便看看有没有合适的或促销的东西可以买,这就要求首页有很好的PET,吸引用户点击,如下图中的红色部分就是服务于这类用户。

  



  倘若京东商城不考虑无目标的用户,也许首页就会长成下面这样:

  对于想找商品的用户,也许更方便直观了,而对于没有目标的用户,就只能离开了。

  



  人人网

  对SNS类网站来说,用户大多数时间是在“随便看看大家都在干什么”,当然也有时,用户来到首页进行发表日志,上传照片等目标明确的操作。

  


讨论:“随便看看”是不是一种用户目标?

  我觉得不是,“随便看看”不能直接驱动任务,故不能用来测试产品可用性;在可用性测试中的任务设计时,随便看看不能作为任务。“随便看看”的过程中,用户决定要做某件事了,这才是用户目标。

  澄清一些可能存在的误解

  服务无目标的用户的模块(如上面例子中的红色区域),并不是说不需要可用性,只是在设计的难度上,要把PET做好更难更需要思考,而可用性要求较容易满足。反之亦然。

  比如京东商城中的促销模块设计,是很典型的服务于无目标用户的模块,PET要求能表现产品质量好,价格便宜,买的人多,存货不多等等难以表现的信息;而可用性只要求商品易浏览,可点击等,任何设计者都不会出错。

  首页设计中如何协调可用性和PET

  在设计之前,调查分析网站用户,是“有目标”的多,还是“无目标”的多,以确定页面上两类模块的比例。

  一般网站同时兼顾两种用户。但“可用性“和“PET”这两点,存在天然矛盾,前者要求页面清晰,而从后者的角度来说,清晰意味着死板,后者要求页面丰富,而从前者的角度来说,丰富意味着杂乱。故在设计时要注意权衡。

  为解决上述矛盾,那就要求“可用性模块”和“PET模块”要明确区分,可以识别,不能相互掺杂。让两类用户能第一时间关注到需要看的部分。

  可用性是基础,一定要先做好,PET是更高要求,属于上层建筑,切不可为上层建筑放弃基础。

  设计首页的可用性

  应该尊重习惯用法的时候,不要擅自创新,如采用用户习惯的网站头,包括主导航,全局导航,搜索,LOGO。如下图。



  若有更多导航–如电子商务网站的商品分类–须在第一屏内出现,突出且易识别。导航中的信息架构,在需要时可用卡片分类法对导航内容进行分类。易迅网的商品分类导航,在左边第一屏最显眼处。



  首页整体布局规矩,使用网页栅格系统设计页面,允许页面有合理留白。、

  尽量保持页面架构简单,最好不出现两列和三列混排的设计。



  首页的模块中使用尽可能简单的列表,简单列表更容易被理解和读懂,且设计运营开发成本低。当然,“非对称列表”也有优势,见下图,设计师应该根据用户类型和设计目标来灵活运用。



  设计首页的PET

  1. 清晰表现品牌和产品服务类型。这首先实现PET中的Trust,只有用户第一时间了解网站品牌和服务(特别是一些大品牌),才能 够立即建立用户的信任。但这个实践起来却相当有难度,特别是一些全新的服务,篇幅小了说不清,篇幅大了用户直接略过。这里只能介绍一种方法来验证此目的有没有达到:

  5秒测试:

  给一个新用户(目标用户)看首页设计5秒,让它说出:

  这是什么网站?

  这个网站提供什么服务?

  首先吸引你的是什么内容?

  这个网站和类似竞争对手有什么不一样吗?

  你对这个网站和它的服务有没有兴趣?

  然后让用户仔细浏览该首页,再纠正上面的答案。

  2. 使用吸引人的图片和标题。说白了就是标题党,虽然这招定被广大设计师唾弃,但它的效果绝对不容小觑。

  3. 使用非对称的设计,有主有次,展现丰富性。但注意,非对称设计会增加认知负担,降低可用性。见上文。

  4. 利用好数字来说服用户,因为数字“不会说慌”。

  4.1 电子商务网站中,限量限时促销。如下图中的易迅网首页的截图。

  



  4.2 电子商务网站中,突出价格和价格对比。如下图中团购网站的首页。

  



  4.3 用数字来突显“丰富的概念”。如下图是网易爱拍首页的设计。

  



  5. 在首页显示其他用户的活动来说服用户(其他用户购买记录,评价,晒单等)。调查显示,让用户信任一个站点的最有效途径,就是在线其他消费者的意见。

  6. 另外,视觉设计上要符合产品和服务的定位,在情感上与用户拉近距离。

  7. 页面更新频率,用户需要适时的刺激。太频繁的更新,不仅浪费资源和成本,用户也要不断适应,增加学习成本;而长时间不更新,也会让用户慢慢失去粘性,转化率降低。

分享到: QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
分享分享0 收藏收藏0
长春网站建设

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

关于我们|手机版|简洁版|搜索|广告招商|长春网

GMT+8, 2024-11-1 07:50 , Processed in 0.049972 second(s), 15 queries .

版权所有 吉林省新格信息技术有限公司 长春网 联系QQ:5053050 微信号:13624467185

© 2008-2012 吉林省长春地区信息分享门户网站。 ICP备案号: 皖ICP备2021004516号-11
建站技术支持:长春新格

回顶部