产品设计:iPhone物理按键背后的设计逻辑
众所周知,iphone自2007年发布以来,其卓越的颜值与体验一直是设计界的标杆。文章对iphone的设计细节进行了分析,让我们一起去探索大师级iphone设计细节之物理按键的变迁与设计逻辑吧。
从iphone历代手机按键变化看,其中最大的变化莫过于开关机键的位置变化。
从第一代iphone到第七代iphone5c和iphone5s(包括后推出的iphoneSE),开关机键一直位于手机顶部,而从iphone6开始,开关机键便转移到右侧,这其中隐藏着怎样的设计原理呢?
还有为什么iphone的五个物理按键安排在不同的空间位置呢(暂不考虑取消Home键的iphone8之后的系列手机,下面不再赘述)?为什么设计师要把静音键和加减音量键设计成造型不同的按键?
让我们一起去看看吧~
(说明:由于本文花了较大篇幅论证,难免会有许多赘述,为了节省读者阅读时间,只需看结论的朋友可以直接略过正文查看文末小结。)
01 iPhone开关机键为什么由顶部改到右侧?
首先让我们看看历代iPhone机身尺寸。
由下表可以看出,从第一代iphone到第五代iphone4s,机身高度非常稳定,基本维持在115~115.5 mm。到了iphone5、iphone5c、iphone5s、iphoneSE,机身高度基本维持在124mm左右。到了第八代iphone6及后续手机(iphoneSE除外),手机高度均大于等于138.1mm。
相信聪明如你已经想到了,iPhone手机开关机按键的变化与iphone机身尺寸有关。
①当机身小于等于124.4mm时,开关机位于手机顶部;
②当机身大于等于138.1mm时,开关机位于手机右侧。
由于手头设备有限,小编便只测试一下小尺寸的iphone4(115.2x 58.6x 9.3 mm)和大尺寸的iphonexs(143.6x 70.9x 7.7 mm)来说明吧。
①iPhone4的开关机按键测试:右手单手操作,当手指从滑动手机状态切换到关机按钮,食指可较容易按到顶部的开关机键;
②iPhoneXS的开关机按键测试:右手单手操作,当手从操控手机屏幕切换到iphone4对应的顶部按钮位置时(xs开关机键实际在右侧),由于机身高度较高,需要将整个手上移,手指才能按到原顶部开关机键位置。从滑动屏幕到切换到原顶部开关机按钮,iphonexs相较iphone4更难触达。
右手单手操作,右手大拇指从屏幕切换到实际右侧开关机键,只需大拇指从屏幕上移动到手机右侧面开关机键,按下按钮即可。通过对比,我们可以看到此时右侧的按钮相较于之前的顶部按钮更易操作,而且位置非常适合大拇指操作。
结论:
①基于手的尺寸考虑,随着iphone机身尺寸增大,开关机按键也由顶部改变到右侧;
②为了方便用户从滑动屏幕到开关机的自由切换(开关机按键使用场景一般为滑动屏幕、关机或开机、滑动屏幕),按钮设置于右手(毕竟右撇子远大于左撇子)更易触达的顶部或右侧。
02 iPhone五个物理键位置为什么这样安排?
1. 使用频率与按键对应面位置的关系
①Home键 使用频率最高——位于手机A级面,即手机正面屏幕下方接近人操作位置,是人使用手机时最易触达的位置。(好吧,不妨脑洞大开想想如果放于屏幕上方会怎样?)注:一般CMF对A级面的标准比其他面(B级、C级面等)的工艺要求更严格,这也是为什么很多产品的分模线一般位于产品的侧面或底面。
②解锁开关机键 使用频率第二高——对应B级面,位于手机顶部或右侧面,右手操作时相较于左侧更易触达。
③静音、加减音量键使用频率第三高——位于手机左侧。右手操作时相较于右侧或顶部更难触达。
小结1:按键使用越频繁,对应操作位越易触达。
2. 为什么iphone把开关机键与声音控制键(三键)分别放置于不同的两个面上?
我们来对比一下华为手机。华为系列手机开关机键和音量键均位于手机右侧,右侧上方放置两个音量键,右侧下方为开关机键。(下图为P30)
我们也同样发现小结1的规律,使用相对频繁的开关机键位于更接近右手触达的操作位——右侧面下方,音量键则位于离右手更远的右上方。
由于三个按键位于同侧,小编在使用多次后,每次使用时仍需思考哪个才是开关机键,哪个才是音量键。显然把这三个键统一放在右侧,手机整体可能更美观,但是体验感相对较差。
究其原因,三者仅有同侧位置区分,而这细微差距不足以产生条件反射。
小结2:通过对比发现,iPhone把这两类按键安排在不同的侧面,体验感更好,使我们不需思考就能条件反射地知道该按哪个键——异侧位置区分>同侧位置区分。
3. 静音开关键、加音量键、减音量键
由于三者同属声音控制键,所以我们很容易理解设计师把他们统一安排在手机左侧的原因。
但是问题来了,既然都同属声音控制键,为什么静音键不设计成和加减音量键一样的按钮呢?即按一下开,再按一下关?我们知道mac键盘上也是有静音键的(第一排右二)。
这其实和刚刚我们分析华为手机右侧选按键的原理一样,如果三个按钮造型相同,区别太小,仅同侧物理位置区分,此时需要思考才能选对。
但同时我们又不能把三者分开,因为三者同属声音控制键,这时不同的造型便是设计师的最佳选择了。因为不同的造型可以使静音键更易区分(造型维度&位置维度)。
我们看到Mac键盘上的静音控制键除了位置区分,还有按键上的图标区分,键盘面是人眼极易触达的面,这时图标区分是有效的,但音量键则位于iPhone侧面,眼睛较难触达,所以此时图标区分就显得不那么奏效了。
那么问题又来了,既然这样, 为什么加音量键和减音量键设计师要用一样的按键呢?
这是因为,音量的加减与物理空间的上下对应,使我们不需要想就知道上面是加,下面是减。还有就是如果都设计成不一样的键,iPhone 还是我们那个颜值爆表的她了吗?
小结3:
①静音键之所以与加减音量键同属一侧,是因为三者均为声音控制键,相同类型的按钮应安排在一起,方便用户查找。
②静音键之所以与加减音量键造型不同,是因为不同的造型可以使静音键更易区分(造型维度&位置维度),降低用户选择难度。
③加减音量键造型相同,且位于左侧上下位置。造型相同是基于颜值和加减音量键的心理等价性考虑。上下位置区分是因为加减音量与物理空间的上下对应,使我们不需思考就知道上面是加,下面是减。
03 总结
iPhone物理按键背后优秀的设计逻辑:
①基于手的人机尺寸考虑,随着iphone机身尺寸增大,开关机按键也由顶部改变到侧面;
②为了方便用户从滑动屏幕到开关机的自由切换(开关机按键使用场景一般为滑动屏幕、关机或开机、滑动屏幕),按钮设置于右手(毕竟右撇子远大于左撇子)更易触达的顶部或右侧。
③使用越频繁的按键,操作位置越易触达。
④把开机键与声音控制键安排在不同的侧面,体验感更好,使我们不需思考就能条件反射地知道该按哪个键——关于区分,我们讲到了位置区分、造型区分、图标区分,设计时我们需要根据具体情况灵活运用。
⑤静音键之所以与音量键同属一侧,是因为三者同属声音控制键,相同类型按键应放置在同一区域,方便用户查找。
⑥静音键之所以与加减音量键造型不同,是因为不同的造型可以使静音键更易区分(造型维度&位置维度)。
⑦加减音量键造型相同,且位于左侧上下位置。造型相同是基于颜值和加减音量键的心理等价性考虑。上下位置区分是因为加减音量与物理空间的上下对应,使我们不需思考就知道上面是加,下面是减。
⑧五个物理控制键的位置造型安排是基于体验和颜值的综合考虑。
欢迎吐槽~
本文由 @洛小梅 原创发布于人人都是产品经理,未经作者许可,禁止转载。
题图来自Unsplash,基于CC0协议。
作者暂无likerid, 赞赏暂由本网站代持,当作者有likerid后会全部转账给作者(我们会尽力而为)。Tips: Until now, everytime you want to store your article, we will help you store it in Filecoin network. In the future, you can store it in Filecoin network using your own filecoin.
Support author:
Author's Filecoin address:
Or you can use Likecoin to support author: