指尖上的浏览:如何理解用户的眼?

标签: 理解 用户 | 发表时间:2014-02-25 16:56 | 作者:
出处:http://kb.cnblogs.com/

  生活中很多人会调侃道:“每天手指在手机屏幕上滑动的距离比走路的距离还长!”随着指尖上的浏览融入到生活的方方面面,如何让用户手指滑动的更有效率,在滑动手指的同时看到更多想看的内容,而不白白滑动手指,是提升手机APP用户体验的重要方面。为深入理解人们的APP浏览行为,我们使用专门用于追踪移动设备注视行为的眼动仪对用户浏览社交APP的习惯进行了研究,试图更加直观地展示人们浏览APP的特点,以及由此引发的对于优化APP浏览体验设计的思考。

  手机与PC浏览,区别在哪里?

  我们曾先后针对QQ空间PC版和QQ空间手机版进行了眼动测试,让用户登录自己的QQ空间自由浏览好友动态,对比两次测试的结果(如下图),可以发现,相比于使用电脑浏览好友动态,用户在手机上浏览好友动态时手指滑动更频繁,经常是在滑动手指的同时浏览内容。 在进行基于电脑网页的眼动数据分析时,我们主要关注用户的注视焦点和轨迹,但对于手机来说,只分析用户看了什么和不看什么是不够的,有必要兼顾眼睛注视和手指滑动,来分析用户的浏览特征,并评估用户的浏览效率。

1

  在对QQ空间手机版进行眼动测试的过程中,我们发现,有时用户明明对某一条动态感兴趣,却只是滑动屏幕而不看上面的内容,直到把内容调整到一定范围内的时候才开始看,这种情境显然降低了用户的浏览效率,增加了手指的滑动距离,却没有因此看到更多的内容(如下图)。在该研究中,我们将这种情景称为“低效滑动”。

2

  低效滑动的情景让我们不禁思考:既然用户不是自上而下将整个屏幕的内容浏览完之后才向上滑动屏幕,那么,用户的注视范围究竟有多大?如何基于注视范围来优化设计以减少用户的低效滑动?用户的注视范围能否改变?

  指尖上的注视范围有多大?

  以QQ空间手机版为例,我们使用Tobii X120眼动仪对24名用户进行了眼动测试,让用户使用手机登录自己的QQ空间自由浏览好友动态,结果表明,注视范围的长度占手机屏幕长度(不含顶bar和底bar)的比例约为75.0%(如下图)。

3

说明:

1、每张图均由参加相应终端测试的6名用户的注视热点图叠加而成,独立版是指QQ空间的客户端,结合版是指从QQ上的入口进入看到的QQ空间;

2、在热点图中,颜色越深,代表关注度越高。对于叠加而成的热点图,屏幕背景只是为了示意屏幕的大小,热点覆盖的区域代表注视的范围,不代表实际看到的内容;

3、标注的红框是为了凸显注视范围的边界。

  有限的注视范围与图文并茂的APP设计

  在浏览一条感兴趣的动态的过程中,当用户想看的内容没出现/没完全出现在注视范围内时,会通过用手指滑动屏幕来调整这些内容的位置,定位好之后才开始浏览。因此,把用户想看的内容显示在其注视范围内,可以减少低效滑动的发生。

  图文并茂是社交APP内容的主要呈现形式,其中,图片占据了屏幕的较大面积,且扮演着重要的角色,无论是好友类动态中的生活见闻照片,还是让资讯类动态更加生动直观的图片,都是用户用来判断对动态是否感兴趣的关键要素,也是浏览感兴趣的动态时重点浏览的内容。 由于用户的注视范围有限,在对动态中文字和图片的高度进行设计时,应注意哪些问题呢?

   第一,图片为竖图时高度控制在注视范围内。在单条动态中,横图的高度通常不会超过注视范围,用户无需产生低效滑动就可以完整浏览文字和图片。但对于竖图,则高度不宜过长,应控制在注视范围内。当图片没有完全展示在注视范围内时,用户看完文字就会上滑屏幕,其间不会注视图片内容,将图片定位好后,通常是把图片的顶部与屏幕最上方对齐,才开始浏览图片,这不仅给用户浏览图片带来了麻烦,而且当用户想再次看文字的时候,还要再次下滑屏幕才能看到文字。

4

   第二,文字较长时展开部分文字,将文字和图片的总高度控制在注视范围内。对于文字较长的图文并茂动态,用户在手机上通常通过标题、图片来快速判断自己对动态是否感兴趣,而对大段文字摘要的关注度较低。有时用户没有被标题吸引,滑动屏幕直接略过文字摘要,当该条动态中的图片出现在屏幕上后被图片吸引,然后点击详情页阅读全文。因此,将较长的文字部分收起,把文字和图片的高度控制在注视范围内,可减少用户略过文字时产生的低效滑动。

5

  思考:用户的注视范围是否可以改变?

  通过上文分析用户浏览社交APP内容时的特点可知,用户的注视范围与图文并茂类动态的设计有着密不可分的关系。那么,对于不同的社交APP,用户的注视范围是固定的吗?

  在对QQ空间手机版进行眼动测试的同时,我们也针对Facebook手机版用户进行了眼动测试,让6名用户自由浏览Facebook,得到用户使用Facebook时的注视范围(如下图)。

6

  Facebook的注视范围的长度占手机屏幕长度(不含顶bar和底bar)的比例为87%,长于QQ空间手机版注视范围的长度。为了更好地分析注视范围的形成,我们也对用户浏览单条动态时的注视情况进行了研究。Facebook的动态是卡片式设计,两条动态之间的间隔较为明显,用户在浏览一条动态时,通常将其滑到屏幕顶端后开始浏览,加之文字和图片的总高度在一屏之内,用户可以在一屏内看到图片的底边,这使得用户在浏览一条自己感兴趣的动态的过程中,可以直接在一屏内完整地浏览文字和图片,很少发生看完文字便开始滑动屏幕来调整图片位置的情况,因而使得注视范围的长度增加。

   由此,我们推断,在使用社交APP时,用户的注视范围并不是固定的,通过设计上的改变可以扩大用户的注视范围,这不仅可以更好地利用了屏幕的大小,也可以减少用户的低效滑动,提高浏览效率。当然,这只是对比QQ空间手机版和Facebook手机版得到的推论,注视范围受哪些设计元素的影响、设计上的改变对注视范围的具体影响机制如何都是值得进一步深入研究的问题。    

   小结:本文主要揭示了用户浏览社交APP的特点,并试图从浏览体验的视角为APP的设计带来一些启发。针对用户的注视范围和低效滑动问题,如何通过设计上的改变来扩大注视范围、减少低效滑动,是设计社交APP中动态的呈现方式时值得思考的问题。与此同时,对于其他类型的APP(如资讯类等),用户的注视范围具有什么特点?与社交APP注视范围的异同在哪里?是否可以通过对比不同类型APP的注视范围总结出一些完善APP浏览体验设计的准则?对于这些问题,我们将会持续地开展相关研究去寻找答案。

相关 [理解 用户] 推荐:

百度解构第一季 - 理解用户搜索行为

- 山河之外 - caoz的和谐blog
       为防止断章取义,曲解个人本意,谢绝一切转载,如果您觉得此文值得分享,请把本文url分享,多谢.        2011年8月18日凌晨,我在新浪微博放了第一炮.       搜索引擎有三面,百度人看到的;架构,逻辑. 站长和营销人员看到的,流量和转化率;普通网民看到的,体验和目标;百度人自认为能看到第三面,但很遗憾,太多毕业后只在百度工作的小盆友,他们和社会是脱节的,并不真的理解普通网民的搜索体验.

指尖上的浏览:如何理解用户的眼?

- - 博客园_知识库
  生活中很多人会调侃道:“每天手指在手机屏幕上滑动的距离比走路的距离还长. ”随着指尖上的浏览融入到生活的方方面面,如何让用户手指滑动的更有效率,在滑动手指的同时看到更多想看的内容,而不白白滑动手指,是提升手机APP用户体验的重要方面. 为深入理解人们的APP浏览行为,我们使用专门用于追踪移动设备注视行为的眼动仪对用户浏览社交APP的习惯进行了研究,试图更加直观地展示人们浏览APP的特点,以及由此引发的对于优化APP浏览体验设计的思考.

一切从用户出发,重新理解“增长本质”和“会员体系”

- - 36氪
编者按:本文来自微信公众号“ 九合创投”(ID:jiuheguancha),36氪经授权发布. 在移动互联网的下半场,新的平台红利不断出现,快速变化的流量入口对创业公司提出了前所未有的挑战:如何理解增长的本质. 如何运营社群、建立高粘合度的会员体系. 2019年11月7日,在九合创投第三期“私董会”的闭门会上,前阿里、百度产品设计总监相辉、前雅虎中国、腾讯产品总监、滴滴顺风车事业部总经理Jelly Huang,和今日头条创始团队成员陈韬,分别围绕增长的本质、会员体系与服务设计等问题进行了深度分享.

泛型理解

- - ITeye博客
泛型不是协变的,例如下面的代码不是正确的. 之所以声明泛型方法,一般是因为您想要在该方法的多个参数之间宣称一个类型约束. 例如,下面代码中的ifThenElse()方法,根据它的第一个参数的布尔值,它将返回第二个或第三个参数:. 注意,您可以调用ifThenElse(),而不用显式地告诉编译器,您想要T的什么值.

理解inode

- - haohtml's blog
inode是一个重要概念,是理解Unix/Linux文件系统和硬盘储存的基础. 我觉得,理解inode,不仅有助于提高系统操作水平,还有助于体会Unix设计哲学,即如何把底层的复杂性抽象成一个简单概念,从而大大简化用户接口. 下面就是我的inode学习笔记,尽量保持简单. 理解inode,要从文件储存说起.

理解OAuth 2.0

- - 阮一峰的网络日志
OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛应用,目前的版本是2.0版. 本文对OAuth 2.0的设计思路和运行流程,做一个简明通俗的解释,主要参考材料为 RFC 6749. 为了理解OAuth的适用场合,让我举一个假设的例子. 有一个"云冲印"的网站,可以将用户储存在Google的照片,冲印出来.

用户及用户特征

- Nick - 所有文章 - UCD大社区
要创建1个可以与用户有效交流的网站,必须考虑到与你交流的用户. 理解用户的需求对我们决定网站内容、信息量、用户以及内容结构至关重要. 用户不是被动的接受网站提供的信息,所有人都会不断的地根据自身经验和猜测来理解. 自己在屏幕上看到的内容,即使我们认同是相同语言,但是每个人的理解含义不会完全相同. 我们都会根据自己的知识和经验来理解所看到的内容,(如果你不住再伦敦,就不知道Oyster卡,Oyster卡是乘坐公交交通时用的旅游储值卡).

用户体验

- tal-rasha - 博客园-首页原创精华区
    用户体验是一个很大的话题,先从一个故事说起.     周末参加了两天的PMP培训,听课期间注意到老师的一个细节,在讲选择题的时候,选项A、C读音正常,而“B”老师读为Boy,“D”老师读为Dog.     刚听到的时候大家莞尔一笑,以为这是个善意的玩笑.     很快,我想明白了,B和D的发音类似,容易混淆;Boy和Dog是简单的单词,发音能够明确区分,也没有类似Bog和Doy的读音混淆.

用户研究

- - 技术改变世界 创新驱动中国 - 《程序员》官网
介绍自己的设计流程时,设计师通常都说它是“以人为中心”或是“以用户为中心”的. 笼统地讲,这表示设计师经常要考虑所设计产品的潜在用户,尽力为这些人创造出最好的产品. 这个问题看似简单,实际上却不好回答. 好的设计通常都是从用户研究着手的. 我们如何才能发现人们想要实现的目标. 虽然这样做有时会得到一些有用的信息,但一定要小心地评估人们给出的答案.