从「令人发指」的苹果来看所谓的细节设计

1

什么是细节设计?在讨论这个问题前先来看个案例。如果你手里恰巧有 iPhone 4s / 5 / 5s,请随便打开一个可以调出虚拟键盘的应用「比如短信」。注意观察键盘的最后一行,相信看这篇文章的人都是中文用户,所以在你的 Space 键「空格键」左边一定有 Globe 键「用于切换输入法的那个小地球按键」和 Dictation 键「画着麦克风的语音输入键」。然后去到 Settings「设置」- General「通用」- Keyboard「键盘」- Keyboards「键盘」,将除 English「英文」之外的输入法全部移除后再回到之前的虚拟键盘,你就会得到下面的两幅图。

2

发现不同了吗?没错,左图中的 Globe 键在右图中不见了…「废话,拖出去…」Wait!两个键盘中的 Dictation 键颜色不一样!嗯,恭喜,你终于发现真谛了。可为什么不同呢?我们再来看两幅图。

3

注意看图中 Space 键的长度。上图中的 Space 键要明显长于下图,这是因为下图中启用了 Globe 键从而导致多占据了一个按键的位置。那么在这个发现的基础上再来看 Dictation 键的颜色,你就会明白它为什么在上图中是暗色,而在下图中是浅色了。因为浅色所对应的正是 Space 键的颜色,而下图中 Dictation 键 + Space 键的长度正好等长于上图中 Space 键的长度。苹果巧妙利用 Dictation 键在色彩上的变化对于视觉的影响来填补了由于 Globe 键所占去的原 Space 键的面积。但为什么要这么做呢?

这就是为什么我在开篇时要详细写明如何设置键盘的原因,因为接下来的感受不是看图就可以体验到的。好了,自己动手试一下。将键盘设置为只有 English「英文」,以较快的速度进行输入的同时去敲击下方的 Space 键,会发现如果你习惯于左手拇指敲击 Space 键的话,那么通常范围会按压在中部偏左的区域。而当你习惯了全尺寸的 Space 键再来敲击因为 Globe 键占位而导致缩水的 Space 键时,左手拇指的落点就很有可能会是 Dictation 键的位置。那么,接下来将键盘恢复为多输入法,再用同样的速度进行输入并敲击 Space 键,你会发现即使你的拇指落点在 Dictation 键上,也不会触发该功能,而是被当作了 Space 键在使用。

当然,其实在全尺寸 Space 键的键盘上进行快速输入时,不小心按在 Dictation 键上也是无反应的,苹果对这个键本身就采用了针对快速输入下的无响应处理。那么既然本身就无响应,在缩水的 Space 键盘上也不会影响操作,为什么还要改变 Dictation 键的颜色?

试想如果用户不知道 Dictation 键有快速输入下的无响应处理,那么在缩水的 Space 键盘上进行输入,当下意识的将拇指敲击位置向 Dictation 键的方向移动时,若 Dictation 键的颜色是与 Space 键不同的暗色调,那么在视觉上将会非常抢眼,很可能会让用户输入时产生停顿,从而为防止输入错误而将本以习惯的拇指敲击位置向右移,最终影响到输入的连贯性和速度。所以将 Dictation 键改为与 Space 键同样的浅色调,会在视觉上将这个影响降到最低,始终让用户保持统一的认知感和体验感。

看完这个案例我不知道你是什么反应,反正当时的我是目瞪口呆,一点儿不亚于在《挖坟 OS X「七」- 鲜为人知的细节设计 Top 10》所提到的那个有关启用听写功能后风扇就停转的做法。那这是不是所谓的「细节设计」?当然是,甚至它已经细到了「令人发指」的地步。但你在被上述案例中苹果偏执狂式的细节处理所折服的同时,想想看大家对 iOS 的美誉只是靠这一个细节得来的吗?当然不是,而是由很多可能在你看来不值一提的细节共同赋予的。之所以会有这样的出彩设计,只不过是苹果对于产品一贯精益求精的设计理念而已。

同理,前段时间 Medium 为了让 下划线 变的更加漂亮,曾耗时一个月为之疯狂,可惜由于技术难度和实现成本的原因最终暂时没有达到预想中的效果。对此有的人为之竖大拇指,也有的人则嗤之以鼻,认为是避重就轻的资源浪费。但无论怎样,我看到的只是 Medium 作为一个新兴内容发布平台对于内容美观度尽善尽美的态度。

所谓「细节设计」只是一个广义上的概念,想要对它下一个确切的定义是不现实的。就像一千个哈姆雷特那样,不同的人对于「细节」的理解也是不一样的。对产品而言,几乎每个层面都可以谈论细节,而这些细节又决定着整体。只不过在这些细节中,有的流于表面易被发现,有的默默无闻深藏功名,有的只是锦上添花让产品脱颖而出,有的却是雪中送炭救产品于水火中。对设计者而言,细节取决于对产品的态度,同时体现出的还有设计者的品味和对自身的要求。所以,既无需把「细节设计」上升到决定产品命运的制高点,也无需为孰优孰劣的做法而争得面红耳赤。用心去做产品,细节就会无处不在。

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

(0)
iouedioued
上一篇 2014-10-09
下一篇 2014-10-11

相关推荐

  • 阿里巴巴技术架构首次曝光 | 站在双11的肩膀上看阿里云企业级互联网架构

    2015天猫双11全球狂欢节以912.17亿元的答卷完美收官。 双11当天14万笔/秒的交易创建峰值和8.6万笔/秒的支付峰值双双刷新了世界纪录,相比首届双11,订单创建峰值增长了350倍,支付峰值增长了430倍。 天量数字的背后…

    2015-11-18
  • Axure手机多屏幕滑动原型案例下载

    网络中有价值的Axure原型案例不多,给客户做的原型或者自己公司内部的几乎没有人愿意共享出来,这很正常。建议刚刚学习Axure的小伙伴儿们不要到找人索要原型,换位思考一下,你付出劳动制作好的成品也不会随意送给…

    2015-01-04
  • 教你读懂UI设计的心理学!

    来源:阿里妈妈MUX 作者:阿里妈妈MUX编译   作为UI设计师,对待用户就像对待婴儿,知道如何通过界面设计诱导用户非常重要,这就需要了解心理学方面的知识了。今天分享一篇日本设计师的好文,结合心理学与设计,…

    2014-09-27
  • Microsoft将向合作伙伴开放 Windows Holographic,官方放出的宣传片

    Microsoft将向合作伙伴开放 Windows Holographic,以下为官方放出的宣传片,巨硬爸爸一出手果然不同凡响。 【微软向合作伙伴开放 Windows Holographic,打造混合现实新时代】魔术师妙手生花,孙悟空腾云日行万里,…

    2016-06-03
  • 『小米只卖产品 不卖节操』雷布斯站在巨人的肩膀上做了什么?

    文章来自设计癖 2014 年 12 月 9 日,小米又一次涉嫌抄袭。这一次的对象,是日本巴慕达公司的 AirEngine 安之风空气净化器。同样的专利许可授权纠纷,同样深表遗憾的回应。巴慕达与曾经的魅族、年初的 Pressy 以及…

    2014-12-27
  • [自译]Medium的Title,Subtitles&Headings的改进介绍

    我们的目标是创造一个能够提供最佳写作体验的空间,让故事的讲述者能够触及到他们的听众。现在,我们很高兴地展示我们在标题方面的提升,这个改变微小而又重要,我们认为你每次在发布文章后,都会会欣赏它。

    2016-08-10
  • 对话界面的现在与未来

    计算机与人类并不使用同一种语言。所以为了之间的交互成为可能,我们依赖于图形化的用户界面(GUIs)。但是GUIs同样有着天然的屏障:人们必须去学习如何使用他们。他们不得不去学习一个汉堡icon隐藏着一个菜单,这是一个button触发一个操作。但是随着技术的发展,语言识别和处理效率的提高改善,我们当前的交互方式正在变得更直观,简单而又高效-通过对话界面

    2016-07-20
  • 【译文】雨天里的交互细节

    最近出现了很多智能手机用的天气应用。但是在以前,这些应用其实都不是很必要的,我们只要知道早上出门带不带雨伞就好了,所以如果天气应用可以直观地告诉我们这一点就好了。就像妈妈一样,在你早上出门的时候帮你…

    2015-10-30
  • 产品设计师的自我重启

    有几个月没喝威士忌了,半年都有了,今天又捡起来了。这两周因为喵的事焦虑万分了,恢复的不太稳定,几乎每天都有不同的状况,让人揪心。揪到后面自己也不好了,各种代表焦虑的梦算是梦了个一溜够。那么让自己放松…

    2014-12-13
  • 网页的交互设计and界面与用户体验案例:Nike Tech Pack in store app

    第一段是动效的视频,请注意观看交互效果与配色设计。 图片都可以点击放大,更清楚哦。 原文地址:https://www.behance.net/gallery/26097251/Nike-Tech-Pack-in-store-app 多个作者: Shakir Dzheyranov / Detail …

    2016-01-10