当前位置:首页 > 经验学习 > 设计思想

Affordance(可供性)和设计

所属栏目:设计思想 时间:2013-12-26 来源: 作者:admin 点击:

iOS 键盘
为什么 iOS 的键盘如此出色,其他系统的虚拟键盘虽然在尺寸上基本超过 iOS 键盘,而它们的视觉体验还是操作体验相比之下显得像一团渣,为什么?
在比较分析之前,先说明一下,分析虽然是一个逆向过程,但在这里我认为诠释性的分析比揣测设计者的意图更有价值,当问“为什么这样设计”的时候,应该将眼界超越设计者本人的意图,即使有一些给出的理解完全脱离设计者的意图甚至与其相背。
iOS 键盘是(新一代)虚拟屏幕键盘的开山始祖,它有很多创新的设计和技术应用,在第一代 iPhone 上市的时候,Apple 做过详细全面的视频介绍,其中有一段就是 iOS 键盘介绍,土豆视频见这(Youtube 地址见这)。Steve Jobs 在 WWDC 2007 上介绍 iPhone 是从革命性的用户界面开始的,从列出 Moto Q、BlackBerry、Palm Treo 和 Nokia E62 这四台带全键盘的手机——当时被称为智能手机——开始,它们的按键和操作是不能改变的,无论你是否需要它总是在那里,而不同的应用需要不同的用户界面。iOS 虚拟键盘只在需要的时候出现,在不同的应用中使用不同的键盘,在输入网址的时候就将空格键替换成了“.”、“.com”和“/”等配合网址输入的按键。同时虚拟键盘需要解决精度以及效率问题,让人轻松快速的输入,使用放大镜进行轻松的光标再定位,比如“臭名昭著”的热词自动修正(英文),除了使用字典以及联系人等词组匹配进行修正外,还可以对输入区域进行匹配比如介绍视频中的将“ouzza”转为“pizza”,还有一项创新的设计是,根据字典来预测下一个字母,以此实时改变键盘的各字母对应的触摸区域的大小,让这些字母更容易被触发,比如输入“tim”,那么接下了“e”就比相邻的“w”和“r”的触摸区域大,因为“time”是一个常用词,而没有“timw”和“timr”这两个英文单词。



在 Apple 的获得专利中,与 iOS 键盘相关的有很多项,重要的就有根据下一个字母来动态改变触摸区域这一项,专利号 7,900,156 名称为“Activating virtual keys of a touch-screen virtual keyboard”,相应在中国的专利申请号为 200680033988 名称为“致动触摸 — 屏幕虚拟键盘的虚拟键”,专利内容就是上述实现的一个一般化,将触摸区域的改变一般化为按键如何根据触摸位置来触发,触摸位置与触发按键通过距离来确定(比如与哪个按键的距离小就触发哪一个按键),同时引入一个权重,那么上述实现中,出现下一个“e”比“w”和“r”有更大的权重,也就是“e”的触摸范围更大,这项专利例举的另一个实现,就是“删除”按键的权重设置成小的,它更不容易被触发。另外在设计专利中,有两项比较显著,一个是 D644,238 整个键盘的设计,另一个 D621,848 是关于按键被按下时挤出的那个放大的键盘指示牌。
我们先从尺寸来看 iOS 键盘的设计,上图是 iPhone 4 之后的视网膜屏幕的界面,所标注数字的单位为 px,其实就是 320*480 屏幕的两倍,前后键盘设计并没有变化,如果换算成 mm 为单位的实际尺寸,那么就类似 32 px/326*25.4=2.49 mm。这些尺寸是如何决定的,如果从设计者的角度来看,这个决定的过程既有逻辑的部分也有感性的成分,所以我们分析不能像数学一样去反推。iOS 的键盘高度为 430 px(320*480 的分辨率时为 215 px,其实 430 px 上方还有 2 px 的黑线),正好位于屏幕正中间向下偏 50 px,或许可以提出一个问题就是键盘为什么不是屏幕的一半呢?这个尺寸由其内部支撑起的,但是如果把它设成刚好一半,那么在比例上很容易体会到压抑(均分是较容易被识别)。76 px 的按键高度是 5.92 mm,52 px 按键宽度是 4.05 mm,12 px 按键间距是 0.93 mm,32 px 的按键间距以及字高是 2.49 mm,iOS 的 HIG 建议的最小可触摸操作元素是 44*44 point,转换到 mm 单位为 6.90,Windows Phone 7 的 HIG 中也说到最小触摸目标的高度是 7 mm(紧接着也说到键盘和链接可以例外,因为有额外的动态补偿)。肯定有很多人机尺寸可供参考,比如横向的尺寸,而从设计的角度除了依赖这些统计学上的数据,更重要的是结合经验和体验,毕竟在这么一个小范围内,依赖后者更迅速。我们从 iOS 键盘的尺寸上可以看出它们都是经过细致安排的,就是“尺度”。

请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

标签:

你应该也喜欢这些吧

共有 0 条评论

给个评价吧

验证码: