无论屏幕多大,拇指驱动的重要性不会递减

本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。


本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。

无论屏幕多大,拇指驱动的重要性不会递减

我们的手和指头点在设备上的哪里?这个问题是关键,本书(本文是节选)考察每个成因,告诉你如何舒服和有效的设计布局。每当我们以不同方式拿着小屏手机,大屏手机,平板和笔记本,每种触屏都有他该有的UI是很正常的。但是这些设备同样分享了很多一致性,尤其是拇指的关键作用。不管我们在小手机还是大平板上点击,我们的拇指都使用的最多。是个事实帮我们建立了可靠的跨平台规范。本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。智能手机当然是我们持有的最多的设备。我们用在手机的时间占用超过我们的走路时间的20%,平均每天访问手机221次。让我们从最熟悉的设备开始。

握住手机

在2013年,研究者 Steven Hooker上街观察了超过1300个人点击他们的手机。他发现在几乎所有案例中,他们拿手机的姿势都是基于以下三种。49%的人使用单手操作,是最多的;36%用一只手抓住手机,用另一只手的拇指或食指点击屏幕;有15%的人采用双手操作,用两个大拇指点击。

无论屏幕多大,拇指驱动的重要性不会递减

智能手机被定义为三种手持方式,我们在这之中切换。

这个研究表明了我们大多数人使用手机的习惯:我们频繁的改变手持方式,取决于是否方便和在当时所处的情景。我们在单手和双手之间转变,或在左右手间交换,有时候是正在做某事的时候随便点击,有时候我们停下来集中全部的注意力。我们都非常的灵活。Hoober发现三分之二的单手操作都是右手,占大多数。但是远远小于占90%的惯用右手人群。这意味着我们很多人喜欢用非惯用手,比如在惯用手写作、喝咖啡、抱小孩儿或者读书的时候。所以当只有很少人一直使用同一种姿势的时候,我们才能展示明确的单手使用喜好。也就是使用大拇指的手势。当我们单手拿着我们的手机,大拇指是唯一舒服好用的手指。甚至在双手姿势的情况下,很多人还是喜欢用大拇指。在一只手持机,用另一只手点击的人中,Hoober发现他们大部分也使用大拇指。经过计算,大拇指胜出:

大拇指驱动了75%的手机交互。

无论屏幕多大,拇指驱动的重要性不会递减

虽然我们经常思考“手指友好”设计,但是拇指才是最重要的。

小屏手机上的拇指点击区域

当拇指在小屏手机上滑动,只有三分之一的屏幕真正的无效:在底部拇指的反方向。例如如果你右手持机,你的拇指自然下滑,在屏幕左下角会呈一个弧形(不要拉伸拇指或转变手机的需求)。这个弧形同样可以应用到双手持机,但是弧形更大因为拇指的移动范围更大。

但是舒适和精确并没有对应。在舒适区中,存在一个拇指点击最精确区域之外的扇形区域,由阿里巴巴的Qian Fei的研究发现。她也发现,对于右手操作用户来说,底部和右上角是最不精确的拇指区域。

无论屏幕多大,拇指驱动的重要性不会递减

单手持机,绿色区域是单手持机用户的最舒服和精确的范围。避免触及红色区域,或者用较大的点击目标作为补偿。

那左撇子呢?点击区域翻转。但是左和右的区别并没有那么明显,因为大部分人在不同情况下,很容易换手。甚至对一只手的优化会不利于另一只手:最好的办法是,将核心功能放在屏幕的中心,无论左右拇指都可以点击。最后,顶部和底部的位置,比起左右来说更重要。不管使用哪只手,屏幕底部都是舒服的,但是顶部要求拉抻手指。这个规则适合所有手机屏幕,大屏小屏。但是当手机增长为巨大的屏幕,顶部屏幕拉伸变为一个可变化的区域。

大屏手机

在第一代iPhone后,设备都始终维持在4寸以下,便于单手操作。但是2014年中期后,三分之一的移动浏览器被大屏占领,因为大屏手机成为了市场的依靠。超大屏手机在手机和平板之间,于是phablet一词出现了,有将近7寸的大屏。

无论屏幕多大,拇指驱动的重要性不会递减

三星的galaxy w和同类设备模糊了手机和平板的界限。

尽管大屏手机有巨大的尺寸,但人们仍然像小屏手机一样使用,并且仍然用以前的三种姿势。不同于小屏手机,大屏手机用户转变了姿势,开始使用整个屏幕,并需要双手操作。在另一个研究中,Hoober和Patti Shank 发现大屏手机使用者70%使用双手操作。在最受欢迎的三种姿势中,35%是用一只手抓住手机,用另一只手的食指点击。但是大拇指点击仍然保持了比例:60%的大屏手机使用者使用拇指或者双手拇指。

无论屏幕多大,拇指驱动的重要性不会递减

虽然拇指驱动姿势和食指点击差不多,但是拇指操作积累了更多活动。

大屏手机的点击区域

随着拇指越来越多的使用,拇指区域对于4-7寸屏幕来说越来越重要。大屏手机用户往往使用双拇指,这样可以对称,扩大屏幕底部的区域,并同时有一个细长的很难到达的顶部区域。尽管双拇指很普遍,但是这并不值得优化。虽然我们单手持机的姿势占25%,但单手拇指姿势对于设计师来说却异常的重要,因为单手拇指范围非常小。

让我们翻回到拇指规则:往往要为最不舒服的手势而设计,这样人们不管他们如何选择拿你的设备,都可以使用你的UI。在大屏手机上,意味着设计值应该把目标及中在单拇指姿势。

有一个惊喜:虽然大屏手机的单手拇指操作区域远远小于小屏手机,但随着屏幕增大,拇指区域却维持了大概同样大小和形状,且基于屏幕底部。除非改变一种稳定的手势,击中了爆点。在这种手势下,大部分人滑动他们在手机下方的小指使手机保持在舒适的位置,这样就减少了拇指的范围。

无论屏幕多大,拇指驱动的重要性不会递减

当手机需要小指的支持时,拇指区域的大小和形状改变。

由于拇指的局限性,屏幕上的一些狭长区域无法触及,一些单手拇指重度使用者,出现了操作被“阻塞”——必须要更高的滑动才能拓展拇指触及范围。在大屏手机中,这种姿势比传统的在手机屏幕底部滑动的姿势给人们更大的拇指范围。

无论屏幕多大,拇指驱动的重要性不会递减

大屏手机上,一个更高的单手操作会获得更大的拇指区域,但是底部的一半则无法到达。

平板:更大屏幕意味着更多的手持

当小屏手机和大屏手机用之前三种姿势时,平板则没有那么幸运。更大的屏幕意味着要用更多方法,这让事情变的无法预测。拇指规则仍然有效,但是有一个特别的问题:拇指区域并不一致,即使是独立设备。拇指区域转变取决于姿势和动作。

一般,我们典型的使用两只手控制大平板,比如ipad,利用杠杆原理,可以从半中间拿住(可以选择接近底部,超过平衡点),一些人装了像文件夹一样的外壳,用另一只手点击。更有可能,我们是坐着操作。Hoober和Shank发现88%的平板使用发生在坐态的时候。手机则为19%。坐在桌边,我们喜欢用一只手拿着平板的下方三分之一,用另一只手点击。在沙发上,我们倾向于把平板放在肚子上,或者用小毯子裹着,用另一只手点击。姿势中转变最大的,是每一种姿势往往影响我们拿设备的距离:我们倾向于在站立时拿平板距离最近,依靠时距离最远。

随着屏幕变大,同样也会越重,我们往往会把它放下。Hoober和Shank发现人们人们愿意把平板放倒,占比例为三分之二。我们有40%会把平板放平(无论桌子上还是大腿上),在站立时有22%会把平板竖直(小于7-8寸的平板非常容易拿住,69%的小平板是手持的),这些平放或者站立的姿势说明我们使用平板更像是使用传统监视器而不是手持设备——换句话说,更接近带键盘可触屏的平板电脑。

平板拇指区域

当我们拿起我们的平板,对于一只手的操作来说还是太大了,所以要使用两只手。再次,拇指很重要。我们倾向于在边缘抓住平板,在确定的位置上下移动,拇指位置在中部到顶部三分之一范围移动。这个姿势使得相邻边和顶部角非常容易点击。在手指不相邻边,顶部和底部是不友好的区域,由于需要拉伸拇指。底部尤其困难,拇指几乎没有靠近底部。有时候,那个部分甚至无法看到,因为最懒或许也是最正常的平板姿势是:放平平板,底部边沿靠近毛毯,毛衣或者腹部。

无论屏幕多大,拇指驱动的重要性不会递减

由于平板握姿在屏幕边缘,拇指区域和手机上的完全不同。

当然我们也点击屏幕中间。屏幕增大,我们手的区域也增加。但是不同于鼠标光标,我们的手指被胳膊的拖累,不能非常有效的在屏幕上滑动。 手指要带动整个肩膀,这样做需要花更多力气。一个界面不应该要求生理运动:

将常用操作成组的放置在拇指可到达区域。

大家都愿意使用拇指。

笔记本平板电脑:在上面装一个键盘

如果按比例放大屏幕对于我们如何操作设备有一个很强的影响,那么增加键盘对于使用习惯产生更加巨大的改变,则很容易理解。我们的姿势,包括我们的手和胳膊,随着增加了键盘而改变。直到最近,平板触屏结合键盘的电脑几乎不能被辨认出来。直到win8出现。

在2012年,windows用尽全力,向世界上使用人数最多的系统的人,介绍了笔记本的触摸交互。作为结果,一个新触摸设备类型——触摸屏笔记本和平板加键盘的组合,冲击了消费市场,创造了全新的经济环境,刷新了对设计师的要求。

亮点是,平板电脑要求我们的双手在键盘和屏幕之间移动。在平板电脑一代来临之前,很多对这个概念的冲击都失败了:手来来回回要做太多工作,乃至使人变成了大猩猩一般笨重。在科学小说《少数派报告》和《钢铁侠》中也有同样的批判:”谁想要在空中不断地用他们的胳膊工作?““没人想垂直的点击屏幕。”2010年乔布斯蔑视地说。“这是个不错的dbo,但是经过一段时间你开始疲劳,再过一段时间,你的胳膊就抬不起来了。”

研究表明并不需要有这种担心。一项intel的研究表明,人们快速适应在这类新设备上触摸,选择使用触屏相对于选择鼠标和键盘,占了77%。尽管老式的光标有可用性和精确度,但人们所触屏感觉更加自然和直接。其他的研究也说明了这种情绪共鸣。其中一个研究说,当人们“触摸”一个网站而不是用鼠标点击时,人们对产品附加了更多价值。当点击被引入,冷冰冰的像素在某种程度上变得有了物理对象般的温度和情绪化投入。我们将更加深入的探讨这一话题,在第四章中,我们主要谈谈手势界面。

同样的,触摸屏不能完全取代鼠标,但是可以欢迎这种混合的附加“就像有一个额外功能的笔记本,”一个intel测试员说。通过使用平板电脑,人们可以轻松的通过触摸,键盘,鼠标和触控板操作:不管怎样,输入变得更方便了。虽然有很多批评,使你觉得这只会比大猩猩的胳膊更糟。但为什么大家的胳膊没有变得麻木?原来,人们很快就找到了如何不需要抬起胳膊使用触摸屏。John Whalen的一项研究表明,当我们使用触摸屏,我们把我们的手臂放松的放在键盘旁,在屏幕的角落保持一个放松的手势。

平板电脑的点击区域

这种“手在角落”的姿势,定义了平板电脑拇指区域。又一次,把触摸目标放在拇指容易接触到的位置,避免抬高手臂。

无论屏幕多大,拇指驱动的重要性不会递减

在平板电脑中 ,拇指的热区在设备的底部角落,拇指热区之外的其他区域是食指热区。

不是人人都适应底部姿势。有一些人用食指点击屏幕作为主要手势。对于设计师,这样会抓不着头脑。食指的热区和拇指的热区正相反。对于食指,屏幕的中心很容易点击,角落则比较困难。

优化拇指意味着会弱化食指,反之亦然。虽然一个布局不得不获得,和其他的触摸设备一致,研究仍然给出了边界。在随着使用设备的经验增加,平板电脑用户更倾向于使用拇指,将手臂平放。

无论屏幕多大,拇指驱动的重要性不会递减

触摸屏平板电脑的专家级用户更偏向于使用拇指,甚至点击屏幕较深的位置。

通过我们审查,成因中最惊人的一致性是:

无论屏幕多大,均为拇指驱动。

拇指提供了最方便的移动范围,而出了最小的力。这种生理上的放松是贝尔实验室的研究者们在设计界面时不得不去重视的,这点同工业设计师们一致。这种人类环境学的考量会决定数字界面的布局。我们开始着手于一些关于触摸设计的普遍规律研究,然后驱动不同设备的规范。

 

作者:liguoran

原文地址:http://www.ui.cn/detail/87858.html

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/30347/

(0)
CatherineCatherine
上一篇 2017-05-28 06:08
下一篇 2017-05-28 08:27

相关推荐

  • iOS和Android规范解析——标签导航和分段控件

    从今天开始,将介绍iOS和Android设计规范中关于导航的部分。今天要介绍的两个控件,经常容易混淆以至于用错。请各位读者仔细阅读,防止以后用错。

    2017-08-04
  • 请记住,视觉设计远不止“好看”这么简单

    设计师和理发师其实有点像,理发师基本分为三种:一种是只会搞基础发型的,比如寸头、中规中矩的长发、老太太卷头等;一种是只会剪流行发型的(这种发型师还很容易 摇身一变成为造型大师,告诉你你应该改变,应该剪目前最流行的某款发型,但实际上可能是他只擅长这款发型);还有一种是最可遇不可求的,他根据你的脸型、 性格等,用最简单的手法量身设计发型,让顾客的气质度立刻得到提升。

    2017-06-03
  • 订阅渠道

    一些第三方媒体渠道大家需要的可以订阅我是UE网最新文章,订阅阅读交互设计教程文章 微博:http://t.im/iamuewb 微信:http://t.im/nw5y 网易云课堂:http://t.im/iamue 网易云阅读的:http://t.im/iamue1 或者:ht…

    交互设计 2015-06-30
  • 走心的收纳设计

    走心的收纳设计

    IxD案例 2017-03-13
  • Axure RP 8.0安装教程

    Axure RP 8.0Win版/64位下载地址:https://pan.baidu.com/s/13eqSe3IeqvnyqjBYxIEqZA密码:2gkwAxure RP简介:Axure RP是一个专业的快速原型设计工具。使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师、UI设计师等,另外,架构师、程序员也在使用Axure。适用系统:win7,win8,win10安装有问题或需要远程安装请联系:...

    2018-04-30
  • 【干货知识】最全面的交互设计原则和理论汇总(下)

    【点击上方蓝字↑↑↑关注「艺恋优梦」获得每晚推送】防错原则:防错原则认为大部分的意外都是由设计的疏忽,而不是人为操作疏忽。通过改变设计可以把过失降到最低。该原则最初是用于工业管理的,但在交互设计也十分适用。如在硬件设计上的 USB 插槽;而在界面交互设计中也是可以经常看到,如当使用条件没有满足时,常常通过使功能失效来表示(一般按钮会变为灰色无法点击),以避免勿按。如上图所示极客公园的评论功能快,在留言框没有内容或邮箱格式不正确的时候是无...

    2018-04-11
  • UED内功心法口诀篇

    本文约5000字,阅读需15分钟本篇思想可能给你带来的价值何为UED?在产品定义阶段,它是一种关乎如何解决问题的思维模式,在产品迭代期,它又是一种关乎如何思辨方案真实体验水平的科学验证。更具体一点,到底是什么样的思维模式和科学验证,近一年的时间我们通过大量案例逐渐将其解构出来,并将导图成“UED内功心法”,期望能够帮助交互设计师在具体实操过程中有的放矢,更有针对性地发挥设计的价值。心法口诀第一式:目标用户锁定招式1:找出契合业务的目标族...

    2018-02-02
  • 用通俗的方式告诉你什么是交互设计。

    通常来说,拥有成熟产品的大型互联网公司都会设有交互设计岗位,这个岗位在近几年的招聘市场上也越炒越火。不同于视觉设计师有可视化的作品展示,交互设计师的工作大多无法直观可视化或出于保密性难以对外展示,所以在大众心目中始终是神秘的存在。所以今天就来给大家分享一下我作为一个交互设计师眼中的交互是什么样的。文章的目的是帮助对交互设计不太了解,但工作相关或对此感兴趣的人对交互设计进行基础入门的了解,所以采用了尽量平实简单的描述方式,以帮助大家快速理...

    2018-04-03
  • 基础知识小科普!4个最常见的APP概念区分及比较

    @凌霜设计 :现在关于移动应用的概念有许多:Native App, Responsive Web, Web App, Hybrid App,搞清楚这几个概念的区别和各自的优劣对于设计师来说很重要,这篇文章较为全面地探讨了这几个概念,值得初学者阅读,…

    交互设计 2015-09-15
  • 设计师设计出来的一个日本县长靠卖萌年赚12亿美元

    导读:一个县长靠卖萌年赚12亿美元,关键TA还是被设计师们设计出来的。。 ​ 说到这里后,小编又想起了未曾如约露面的那个春晚吉祥物康康(网友称猴赛雷)了。。。 ============================= IAMUE(https://ww…

    2016-02-18