谈UI的扁平化潮流与拟物化的减退

2013-5-11   

转载蓝蓝设计(   www.lanlanwork.com  )是一家专注而深入的设计机构 ,为期望卓越的国内外企业提供有效的   BS界面设计 、 cs界面设计 、  ipad界面设计   、  包装设计 、  图标定制 、  用户体验 、交互设计、   网站建设 平面设计服务

来源:http://www.woshipm.com/design/24542.html

如果您想订阅本博客内容,每天自动发到您的邮箱中,   请点这里flat design

 

前言

实际上是这一两年,我们可以发现越来越多的程序的GUI变得平面化了:google、Microsoft、facebook、甚至apple的首席设计师Jony Ive也说过苹果会开始适当扁平化一点,WWDC2013的新logo也能看出这个暗示了。 于是很多人都问,为什么会有这样的趋势了?

我认为扁平化是一个必然趋势。并不是单纯的因为审美疲劳导致的为了变化而变化,而主要是因为数码化程度越来越高的日常生活中导致的。随着时代的变化,一方面是拟物化作用越来越少而退出主流,另一方面是扁平化更适应新时代的需求。

About

我先推荐读者看一下知乎上的两篇讨论:

  • 「传 Jony Ive 正在推动 iOS 采用扁平化设计(Flat Design),这会有怎样的影响? 」
  • 「iOS 的拟物设计和 Metro UI 的 Tile 设计风格,分别有哪些优劣势? 」

首先要明确的是:
扁平化设计并不是为了拍扁而拍扁,它是一种设计理念,色块是它的外在表现形式。
同样的,拟物化也是不应该是为了拟物而拟物,立体是它的外在表现形式。
这个应该争论不多。
本文将主要从拟物/扁平设的出发点讨论他们的时代特点,而不是外在形式,请读者们牢记在心以免不必要的误解。

其次要明确的,也是很有争论的是:
拟物和扁平到底是不是对立的?

如果说扁平是一种极端,那另一个极端是什么?虽然这两者的出发点是不同但不完全相反,但似乎除了拟物没有更适合当扁平化的假想敌了。说道风格,除了flat和拟物,我也不太想得到其他词,至少从实际流行度变化来看也确实是这样的。

有人说计算器的例子,win8的计算器拍扁了,但也是依然是拟物化,布局和实体计算器一个样,所以拟物和扁平是可以共存。初看是有道理的,但细想的话我觉得这个例子没有说服力。其实数字计算机本身就是个扁平化的计算器。就算不去想实体计算器,按照信息构架从0开始设计一个计算器,很有可能也会是那么类似的结果。更不用说数字计算器光字面上就是个有UI的计算机了,只不过这个UI很简单略复古和现在的UI的概念略有差别而不一定能被我们马上意识到是UI而已。有没有人记得算盘?一个珠子代表一或五的算盘,那估计算是拟物化设计的计算器了。

而至于用色块画个温度计、用色块画个模拟时钟什么的,要我说那本质依然是拟物。而不是所谓共存的形式。

再退一步,就算拟物化和扁平不是对立的也没关系,这两者放在一起谈一谈也是有必要的。

擬物化的没落

我们先来看一下为什么有拟物化这个东西:

Jobs对界面设计的一个理想是,任何年龄的人,任何经历的人,都可以在拿到设备后的几分钟内轻松的掌握它的用法。于是apple通过利用人们的日常经验,做出拟物化的界面,从而降低用户的学习成本以及理解难度,正如《iOS Human Interface Guidelines》里提到,

「当你应用中的可视化对象和操作按照现实世界中的对象与操作仿造,用户就能快速领会如何使用它。」

最早最常见的拟物化,或许就是按钮了,突起的表示可以按的,凹陷的表示已经被按了。确实易懂。拟物化在当时那个数码设备尚未十分普及的时代,毫无疑问是效果是不错的。

但是,数码设备的普及+一个万能的手机,成了拟物化没落的起始点。

不再需要降低学習成本

前面也说了,在数码设备普及度不高的时代,拟物化是有效果的,我相信对于从未接触过数码设备的老人/小孩应该是尤其效果拔群的。

但是在人人有电脑,人人有智能机,日常和学习/办公都离不开计算机,不会用计算机就像美国人没驾照一样奇怪的信息时代,我们还有必要去那么刻意地降低学习成本生怕用户不会用么?何况大多数软件的市场本身就不把老人/小孩考虑在内。

一个先进的设备得通过模仿古老的东西让用户快速理解,是时代过渡中的一个不得已。在未来人眼中,一个温度计的app要特地设计成实体温度计的样子,一定傻/蛋疼透了。

更进一步的,拟物≠,刻意的在交互上拟物,有时候反而降低了效率。随着数码的普及,人们对产品的要求也是在变的,后面的「数码渗入生活」章节会提到。

失效

当一个数码设备可以完成听音乐、写东西、看地图、打电话等一切任务的时候,传统的东西必然会失去竞争力而逐渐退出历史舞台。那时候,就算想拟物也没东西可以给你拟了。

图标就是个很好的例子:代表「保存」的3.5英寸软盘、代表「留言」的磁带、书签……有些人年轻人甚至连话筒也不认识,认为所谓电话,就是iphone这样的一块金属。在这样的趋势下,拟物化就算依然奏效,也得谨慎选择了。

擬物化的濫用

事实上很多拟物化设计并没有遵从拟物化设计的初衷。不给记事软件加封皮会影响用户理解吗?日历程序有个翻页动画帮助了用户理解程序用法吗?……

「所以一个使用玻璃温度计图片的天气app就是拟物化:玻璃在原来(现实中的温度计)是必要的,而在新设计中变为完全的装饰。」
~ Sacha Greif

「在现实世界中,当一个按钮按下,你能感受到它的弹性和弹力,但是在手机或者屏幕上,有物理上反馈的先天不足。你的意识知道物理性的存在而拟物化没有。所以至少对我来说,它事实上没有达到预期和让我失望的时刻。」
~ Allan Yu (svpply / eBay)

连Wikipedia也说:

「一个产品的设计元素模仿其在原始产品设计中是必要功能,但是在新的设计中变为装饰的设计元素

数碼渗入生活

人们对数码产品的印象是随着普及度变化的。

在计算机还是个普及度有限的东西,数码产品在一些人眼中是有点神秘的——「炫」「酷」「时尚」。记得十几年前看到一个逼真的金属外壳的播放器皮肤,真是觉得屌爆了!觉得计算机好帅气!于是也出现了很多向我一样的界面爱好者,着迷于华丽炫酷的界面;能画一手华丽的图标的,进一个IT大企业当个设计师也是十拿九稳的;也没人会去说一个画简洁图标的人好厉害。很多GUI设计在可以传递一种意识「这是计算机,与众不同」。
那个时代,我们是「享受计算机」,精美的GUI也是享受的其中一环。

但是现在数码产品广泛地渗入到大家的生活中后、成为日常生活不可分离的一部分后,数码产品对我们不再有神秘感。听歌得靠它、找资料得靠它、报名得靠它、找路得靠它、制定计划得靠它……计算机的使用频率如此之高,使得人们对计算机的印象慢慢转向效率、靠谱、万能。对于一个这样的生活必需品,我们需要很精致甚至华丽的外观吗?
我相信随着普适计算的渗入,计算机对人们来说会变得越来越纯粹——执行必须的任务——执行完就关掉。计算机是个熟悉的不能再熟悉的东西了,一个记事程序对未来人们来说,或许就像一个(真)笔记本对于现在的我们:它的作用就应该是那么纯粹、简单。越来越多的人会觉得「一个打字程序而已为什么要做的那么复杂?」,就像现在的我们看到一个花里花俏的铅笔会觉得「为什么一个铅笔还要做的那么复杂?」
未来的时代,人们的重心将会从「享受计算机」转变到「随心使用计算机」。GUI的设计也必然会慢慢会抛弃华丽的外皮,而专注于信息和任务本身。扁平化设计是非常适合这种需求的,当然也可以换过来说,拟物化设计在这种场景下是有点画蛇添足的。

再想一下近未来的数码社会会是怎么样的吧。康宁和微软都向我们展示过了他们的近期展望——不管是AR还是屏幕,总之是一个充满了UI的生活。不仅仅是使用情景碎片化了,连界面也碎片化了。(感谢Woeh的意见)在随便望一眼都是很多UI的时代,你能想象充满了高光、阴影的GUI的话会是怎么样的场景吗?

GUI的目标会从沉浸式转向碎片化,慢慢向平面设计、工业设计靠拢,而形成设计圈的大统一、生活「材质」的大统一。

在更遥远的未来,或许按钮不叫钮了,叫触发器之类更抽象的名字了,或者,干脆没有按钮这类东西了,因为操纵电脑不再需要手了,也许连GUI都不需要了,一切将会是信息流而已。

審美疲勞

审美疲劳虽然是次要因素,但也不可忽略。

那个时代,GUI圈有着普遍的设计美学。Layervault的Allen Grinshtein在一篇发表于HackerNews的文章中,他说:

「网页中广受欢迎的产品通常都有一些类似的设计美学,比如一些立体、内阴影、外阴影等。对设计师来说,他们会以实现这种“媚俗”的界面而感到自豪。」

论天下设计,简久必繁,繁久必简。 GUI也不例外,不管是制作方还是用户,都会审美疲劳。就算不疲劳,有些产品需要标新立异,与众不同。

最後

综上,随着时代的变迁,拟物化的「设计」属性越来越少,从而慢慢变成为一种「(视觉装饰)风格」
作为一种设计,拟物化的好处会越来越少,而随之带来的开发成本增加、审美疲劳等问题,使得用它的理由越来越少了。
当然,拟物化不会在就此马上消失,一方面风格这东西不存在好坏,总会有一部分人喜欢,另一方面个别程序需要趣味和亲和力,也确实有必要用到拟物化。而极简的设计,也会被人看腻而适当加入一些装饰元素。

最后最后,未来科技发展的实际情况也没人知道,或许远远慢于我们的预期,也有可能远远快于我们的预期以至于UI设计还没第二个轮回就直接进入意识控制而不需要UI了。我也只是发表下自己观点。观点对或不对,现在没人能下定论,也不是本文的重点。希望本文中的一些观点对读者有所启发、刺激更进一步的思考。

来源:http://www.godling-studio.com

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档