本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。
我们的手和指头点在设备上的哪里?这个问题是关键,本书(本文是节选)考察每个成因,告诉你如何舒服和有效的设计布局。每当我们以不同方式拿着小屏手机,大屏手机,平板和笔记本,每种触屏都有他该有的UI是很正常的。但是这些设备同样分享了很多一致性,尤其是拇指的关键作用。不管我们在小手机还是大平板上点击,我们的拇指都使用的最多。是个事实帮我们建立了可靠的跨平台规范。本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。智能手机当然是我们持有的最多的设备。我们用在手机的时间占用超过我们的走路时间的20%,平均每天访问手机221次。让我们从最熟悉的设备开始。
握住手机
在2013年,研究者 Steven Hooker上街观察了超过1300个人点击他们的手机。他发现在几乎所有案例中,他们拿手机的姿势都是基于以下三种。49%的人使用单手操作,是最多的;36%用一只手抓住手机,用另一只手的拇指或食指点击屏幕;有15%的人采用双手操作,用两个大拇指点击。
智能手机被定义为三种手持方式,我们在这之中切换。
这个研究表明了我们大多数人使用手机的习惯:我们频繁的改变手持方式,取决于是否方便和在当时所处的情景。我们在单手和双手之间转变,或在左右手间交换,有时候是正在做某事的时候随便点击,有时候我们停下来集中全部的注意力。我们都非常的灵活。Hoober发现三分之二的单手操作都是右手,占大多数。但是远远小于占90%的惯用右手人群。这意味着我们很多人喜欢用非惯用手,比如在惯用手写作、喝咖啡、抱小孩儿或者读书的时候。所以当只有很少人一直使用同一种姿势的时候,我们才能展示明确的单手使用喜好。也就是使用大拇指的手势。当我们单手拿着我们的手机,大拇指是唯一舒服好用的手指。甚至在双手姿势的情况下,很多人还是喜欢用大拇指。在一只手持机,用另一只手点击的人中,Hoober发现他们大部分也使用大拇指。经过计算,大拇指胜出:
虽然我们经常思考“手指友好”设计,但是拇指才是最重要的。
当拇指在小屏手机上滑动,只有三分之一的屏幕真正的无效:在底部拇指的反方向。例如如果你右手持机,你的拇指自然下滑,在屏幕左下角会呈一个弧形(不要拉伸拇指或转变手机的需求)。这个弧形同样可以应用到双手持机,但是弧形更大因为拇指的移动范围更大。
但是舒适和精确并没有对应。在舒适区中,存在一个拇指点击最精确区域之外的扇形区域,由阿里巴巴的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的一项研究表明,当我们使用触摸屏,我们把我们的手臂放松的放在键盘旁,在屏幕的角落保持一个放松的手势。
平板电脑的点击区域
这种“手在角落”的姿势,定义了平板电脑拇指区域。又一次,把触摸目标放在拇指容易接触到的位置,避免抬高手臂。
在平板电脑中 ,拇指的热区在设备的底部角落,拇指热区之外的其他区域是食指热区。
不是人人都适应底部姿势。有一些人用食指点击屏幕作为主要手势。对于设计师,这样会抓不着头脑。食指的热区和拇指的热区正相反。对于食指,屏幕的中心很容易点击,角落则比较困难。
优化拇指意味着会弱化食指,反之亦然。虽然一个布局不得不获得,和其他的触摸设备一致,研究仍然给出了边界。在随着使用设备的经验增加,平板电脑用户更倾向于使用拇指,将手臂平放。
触摸屏平板电脑的专家级用户更偏向于使用拇指,甚至点击屏幕较深的位置。
通过我们审查,成因中最惊人的一致性是:
无论屏幕多大,均为拇指驱动。
拇指提供了最方便的移动范围,而出了最小的力。这种生理上的放松是贝尔实验室的研究者们在设计界面时不得不去重视的,这点同工业设计师们一致。这种人类环境学的考量会决定数字界面的布局。我们开始着手于一些关于触摸设计的普遍规律研究,然后驱动不同设备的规范。