让你忍不住买买买，购物网站会这样设计

让你忍不住买买买，购物网站会这样设计

今天分享的文章告诉你，JD.COM商城设计方案管理中心如何将眼动研究应用到具体的设计方案中，设计出更强方案的网页，会让你更加开心地去血拼。

随着“双十一”的结束，一场快乐的全员网购完美落幕。当曾经的“买买买”竞技场搬到网页上，以前的购物路线变成了今天的页面访问轨迹；试衣镜前的怒火变成了显示屏前的凝视时间...网站设计师此时已经很忙了，因为页面的布局设计是否合理，信息展示设计旁白等等都危及到用户在虚幻世界中“买中买”的感觉。

“客户关心什么？他们如何访问该页面？」

“营销信息是在左侧还是顶部？」

“你是要连续三个还是五个产品？」

为了更好地解释这个问题，我们在2014年初对导购网站进行了一次科学研究。根据眼动检测和深度访谈的方法，掌握用户访问不同导购页面的个人行为和重点内容，致力于启发导购页面的设计。

但是，科研是“导购网站”，所以我们首先建立以下问题:

1.什么是导购网站？

导购网站是电子商务中可以获取优质产品或知名品牌的网站，强烈推荐给用户，减少用户的时间。

2.导购网页的布局有哪些？

根据对几个电子商务导购页面合理布局的分析，抽象出以下几种常见的页面合理布局模式:

3.导购网站内容的关键是什么？

根据内容不同，可分为知名品牌导购(如JD.COM商城年轻化)、品类导购(如易迅菜场)、团购价导购(如美团外卖)和社区导购(如蘑菇街)1。

好了，一切准备就绪。再来看科研的全过程。

此次招募了30名喜欢“浏览”各类导购网站的用户(男:女=7:23)，通过与视觉效果和交互设计师的相互协商，选出了21个更具符号化的导购网页。为了消除内容的危害，选择了非真实网站的静态页面2进行眼动测试。

另外，测试素材图片设置为组内任意，组间任意，避免了页面访问顺序对用户造成的伤害。根据页面的内容，将待测图片分为三类(知名品牌测试页面、类别测试页面和主题风格测试页面3)，每一类页面都采用任意播放视频的方式，每一组用户看到的页面内容顺序也有所不同。

PEEP(PostExperienceEyeTrackedProtocol)用于让用户在眼球运动后回到纽约。最后，结合眼动结果和访谈内容，我们得到了以下发现。

另外，根据用户习惯的特点，我们做了用户访问导购页面的画像分析。这些内容先卖到这里，下期留着和大家分享。

导购网站还包括比价导购、打折导购、购物返利导购。但由于这些网站以文字为主，不在本次眼动研究范围内。

静态页面的定义与屏幕分辨率总宽度一致，尽可能还原用户的访问场景。

其中“主题风格检测页面”包括团购价导购页面。

根据眼动测试，我们发现，在“合理的页面布局”和“对信息素的感知”两个层面上:

不同的页面有不同的合理布局，所以因为用户视线轨迹的不同，适合承载的导购页面也不同。

在不同种类的导购页面中，用户对图片、文字、知名品牌等信息元素的认知是不同的。

下面，我们将详细分享这次调查的结果。

发觉1：页面合理布局对视线运动轨迹的危害

根据上文详细介绍的对布局合理的三类页面(web文件格式、一栏式、瀑布式)的典型用户注视轨迹的科学研究，发现这类页面能够正确引导用户从合理布局中生成特殊的注视轨迹，而不同的注视轨迹会危及用户对页面信息的认知能力、高效率和深度生产加工。

因此，根据这种独特的页面布局的有效利用，可以提高导购页面的转化率。

(1)网文件格式页面合理布局

从下面的视线轨迹图可以看出，在web文件格式页面的合理布局中，用户的视线轨迹以Z形和弓形为主。以这样的视线轨迹阅读文章效率很高，不容易因错线而错过信息。

因此，web文件格式页面设计方案可以展示更多的信息，更有利于用户的信息搜索。但它的缺陷是图文太小，用户对信息的认知能力压力很大。

(2)一栏式页面合理布局

在一栏的合理布局下，用户的注视轨迹以Z型和F型为主。Z形轨迹在阅读文章时是高效的，而F形轨迹则表明用户在阅读文章的整个过程中具有较强的主观性，此时的信息解决能力较强。

因此，一栏式页面的合理布局适用于必须强化用户认知能力的页面(如根据对页面的访问权限打造企业形象的认知能力)。

但一栏式合理布局的不足之处在于展示的信息太少。在导购页面信息量较多的情况下，非常容易造成页面过长导致页面周转率过高的问题。

(3)飞瀑流式的页面合理布局

瀑布布局下，用户的注视轨迹以S形为主，阅读文章流畅。但由于用户选择“只离远点”的原则阅读文章，很容易漏读。

因此，瀑布式页面的合理布局适合在社区型访问页面中使用，这类页面通常信息量较大，使用瀑布式布局的访问体验更加流畅。但缺陷是不能彻底关心信息，非常容易漏看信息。

关于瀑布页面合理布局的建议；

发觉2：不一样种类的导购页面中，信息原素的认知度有一定的差别

在整个眼动测试过程中，我们还发现不同种类的导购页面在用户对图片、文字(包括商品主要参数、折扣授信额度)、知名品牌(包括品牌名称、知名品牌logo)的在意程度上存在一定差异。

下面就来详细介绍一下在这种别样的导购页面下，用户关心的是什么。

(1)知名品牌营销类导购页面

知名品牌营销的导购页面可以分为“品牌营销”和“品牌折扣”两大类。这两类页面的用户对页面信息的认知有什么区别？

“品牌营销页”一般会详细介绍知名品牌和配套产品，所以用户更容易被图片吸引。但在“品牌折扣”页面，宣传策划的重点是品牌特卖，所以用户关注的是知名品牌和折扣信息，对实际产品图片的认知略弱。

(2)品类营销类导购页面

在一般的品类营销页面，用户更关心的是产品图片。然而，在3C数码科技品类营销页面中，用户对商品主要参数等文本信息的认知度较高。因此，在3C数码科技的营销页面设计方案中，应突出宝贝描述的文字管理。

(3)小区类导购页面

社区导购页面一般以图片为主。我不知道在这里的众多图片中，用户对哪张图片更感兴趣。什么样的图片应该突出显示或者不要忽略？

在科研社区的导购页面，相比服装类目的图片，用户更关注这些展示搭配实际效果的图片。

这也体现在行为经济学中“使用权依赖”的情况上:展示匹配的设计效果图，有时会让客户觉得自己已经拥有了产品的“虚拟使用权”，以至于在同样的标准下，用真人版拍摄的产品比没有真人版的卖得更好。

(4)团购价类导购页面

在团购的导购页面中，商品类产品和服务类产品的导购页面的用户侧重点有所不同。

在产品指南页面下，用户更关注产品图片，但在服务产品指南页面，用户对产品的文字描述认知度很高。

使用建议:

基于以上发现，我们对导购页面的类型和关键信息元素做了如下总结。

根据用户的这种关注，在以后的页面设计方案中，大家要注意展现和突出用户关心的信息元素，提高用户获取信息的效率，也有助于提高网站的转化率。

写在最终得话

根据这个眼动研究，我们发现，未来导购页面的设计要根据导购的类型，合理布局不同的页面，突出不同层次的业务内容。期待你的科研，能帮助网络时代的“导(设)、买(计)、小(人)、大(工)”设计出吸引更多用户的“买买买”游乐园。

下期我们将分享导购网站用户的个人行为画像，详细介绍不同类型用户在应用导购网站时的“重要个人行为”和“页面偏好”。请注意！