5月11日,Facebook 旗下的图片社交应用 Instagram 更换了新的 LOGO,放弃了复古相机的样式,转而变成了一个典型的扁平化风格的设计。网络
笔者依稀记得这个拟物风格的logo一直坚挺的使用了5年,当别的应用都在随大流纷纷加入扁平化大军的时候,这个应用却一直保持着原来的风格,以至于我老是很容易就在手机里找到这个应用(从另一个角度来讲,人家并无把精力成天花在视觉改版上,而是专心在作产品细节,不像某些国内公司一发现数据差了就怪设计,卧槽,尼玛你不知道你产品有多烂啊~(~ ̄▽ ̄)~[] 请原谅笔者又激动了·~)。5年啊!~~绝对的持久!\(▔▽▔)/app
But,当人们习惯同样东西后,而后这个东西忽然的来了个180°的大翻身的时候~~带来的妥妥就是一片骂声和各类呐喊啊~~有网友甚至P出了一张Instagram版的呐喊·~以下图,(─.─|||| 。哈哈哈......高手在民间啊·~布局
图片来自网络学习
我们先不讨论这个设计的好坏,却是此次事件让一众人再次开始讨论起扁平化设计。字体
图片来自网络优化
而说到扁平化设计,其实笔者第一反应是乔布斯-乔帮主。由于这位神通常的人物是个钟爱拟物化设计的表明。笔者依稀记得那场关于扁平化和拟物化的口水战是多么的激烈~,如今想一想要是乔布斯发现如今的Apple已经彻底的抛弃了拟物设计,转而投入大热的扁平化设计,他会不会从坟墓里爬出来,对着乔尼·艾维(Jony Ive)和库克上演植物大战僵尸的桥段呢~~^O^动画
固然玩笑归玩笑,无论乔帮主怎么想,Apple仍是继微软后加入了扁平化的大军。那么问题来了,扁平化虽然有很多优势,但至于这么火么?~它也会像拟物化同样在不久的未来迅速被别的更牛逼的风格代替吗?就好像一个武林盟主在风光不少年后,被个忽然冒出来的小子战胜了,只好退居幕后。正所谓三十年河东三十年河西嘛~~网站
so,要弄清这个问题,仍是有必要先了解清楚扁平化的由来和它的优缺点,看看它是否是符合当下产品发展的要求.......设计
扁平化的由来3d
能够确定的是,如今这些什么app设计、网站设计的美学要求,大多都源自传统的印刷出版物和传统美学。要准确的说出扁平化来自哪里很难。不过笔者找了很多信息,发现扁平化貌似多半是被这两个设计风格所影响。
瑞士风格(Swiss Style)
瑞士风格其实也叫作国际主义设计风格,是由包豪斯时期现代主义设计演变而来的。这个风格最先实际上是德国佬弄出来的,但真正发扬光大的倒是瑞士人,因此索性就叫作瑞士风格啦,在20世纪四五十年代这样发展为主流。(话说北欧真是个神奇的设计帝国~笔者是炒鸡向往的,就是天气不要太冷就行了~)
瑞士设计风格讲究沿袭形式和功能的完美结合的理念。光这一点笔者都佩服得五体投地!并且瑞士风格并不仅仅应用在平面海报设计上,还包括家具、工业产品、汽车等设计上。
瑞士风格注重网格以及无衬线字体的使用,井井有条。在那个年代,瑞士风格一般是一张很大的图片,配上简洁、极小的字体(上图所示)。值得一提的是,最近被玩坏的Helvetica字体也是在那个时候生出来的,并一发不可收拾的被普遍使用。总之灰常牛B就是了。
极简设计(Minimalist Design)
图片来自网络
(其实我想说,极简主义不是通常的省油墨啊·~^_^||| )
另外一个对扁平化设计有深远影响的是极简设计。我想这个风格不少设计师并不陌生,由于笔者发现只要是设计师都喜欢MUJI。而MUJI正是这个风格的表明之一。
图片来自网络
所谓极简就是移除多余的元素,只留下必要的成分。几何图形、少数的元素、明亮的色彩和干净的线条主导多数极简风格设计。
须要说明的是,极简主义并不局限于艺术或设计,它是极简主义者奉行的一种哲学思想,价值观以及生活方式--“极简主义”生活方式。(对,你没有看错!这是真的已经上升到哲学领域了~( ̄ε  ̄) ,这B装得能够~~)
固然,其实极简主义原本就是设计的一个极端,不少时候极简主义给人的感受是性冷淡......过高冷了~格调有余,但亲和力就差了点啊~
扁平化设计真正应用到界面设计里,是微软早期的Zune播放器(下图)。或者不少人都木有听过这个播放器~~这也不奇怪。由于这个播放器貌似并无在大陆发售,知道的人天然少之又少。
微软一直都没有对苹果中止过斗争。2006年底,为了和苹果的iPod竞争,推出了Zune。并提出了Metro的设计风格。不过,最终这个产品由于营销问题,挂了┑( ̄。。 ̄)┍ ~
咱们姑且不说这个产品成功不成功。笔者当时是妥妥的被Zune的界面设计所震撼,倔强的认定这个设计必将影响其余设计。
而后iPhone出来后,微软又坐不住了。2010年这样,微软从当年Zune设计中积累了的经验,改良了新版的Windows Phone 7的设计,大号字体、明亮的色彩、网格、简洁和扁平的图标主宰了所有风格(固然还有流畅的动画~这个后面谈)。
当metro风格出来后,媒体和设计界在当时反响是真的火热。非常被看好的。扁平化设计也理所固然的被端出了桌面。
Apple 和 iOS 7的转变
图片来自网络
当时候媒体讨论最多的就是苹果会不会随大流放弃拟物化设计,笔者当时本身也是本身YY了蛮久的。不过最终苹果也没能抵抗诱惑,加入了扁平化大军。2013年iOS7发布后,苹果完全放弃拟物化设计。(我一直在想是否是由于乔大神不在的缘故~~否则我想扁平化也不会辣么轻松的就征服世界..)
图片来自网络
因为苹果的产品是个标杆(各大厂家的“学习”对象●▽● ),用户也都是相对上流一点的(由于真的很贵,当时笔者都没好意思买啊~~(>_<)~~),iOS7的发布使得扁平化设计一晚上爆红。拟物化设计几乎瞬间过期。因此扁平化虽然是先由微软弄出来,但倒是由苹果推向主流的。
而后就看到各类软件和App的设计一晚上之间都尼玛变了~~再后来要是设计个什么东西不和扁平化扯上边就尼玛很差意思拿出来!(当时笔者是妥妥的深有体会啊!唉...╮(╯▽╰)╭)
那些习惯了画拟物风格的设计师,顿时尼玛就傻了眼。原来画一个icon须要好几小时,如今一个新手一上来花个十多分钟就画完了(先不要在乎画得好很差)~~那种失落感,我也不知正在看文章的你懂不懂~~╮(╯▽╰)╭ 那种感受就以下面这张gif同样,很差意思。Instagram表示又躺枪了·~
扁平化设计的优势和缺点
想了想,扁平化之因此可以那么火,也确实是有诸多缘由的。至少它的优势是绝对的符合当下技术发展须要的。
优势
响应式布局
因为如今终端设备愈来愈多,而且什么奇葩尺寸都有,为了适应这些屏幕尺寸可以提供使用者优质的阅读体验,响应式的布局设计应运而生。而扁平化设计因为设计简单等特色,RD甚至能够用代码实现设计效果(由于不少时候并无渐变或是一大张图)。这样的状况下阅读体验想很差都难啊。RD看到这些设计图内心你不知道有多么的开心和温暖!~(除非交互设计得很烂哈·~这里只谈扁平化对响应式布局的好处~)
让用户更加注意内容自己,而不是别的没必要要的装饰
由于说实话用扁平化方式设计出来的做品,并无那么多吸引眼球的东西,太简单(这里主要指界面)。这样用户天然而然的更容易去关注内容自己,而忽略了这个是被设计过的。(但其实真的就是被设计过的,有句话说得好“最后的设计就是没有设计”)
感官上和实际轻量化,下降设备硬件要求
用于设计简单明了,以及扁平化设计多以明快而单一的色彩去设计,去除和减小了那些多余的元素,使得总体界面让人从感官上以为特别的轻快。从另一个层面说,因为设计简洁,以致于RD有些地方均可以不切图,而用代码直接写出。甚至一些动画效果也是能够用代码写出。这样就大大下降对硬件的要求。并且最要紧的是安装包妥妥的小了好多啊~(其实扁平化风格是代码仔的最爱才对... - -)
结构层次扁平化
扁平化设计的理念也在影响着交互方式。能够看到愈来愈多产品的交互再也不像过去那样那么多层级,而是减小概括整合起来。一目了然的同时,提高了用户体验。
缺点:
须要必定的学习成本
乔帮主之因此要iPhone走拟物化风格,其实很大缘由在于他对学习成本的极大重视,于是才会在界面中大量的使用隐喻和模仿。他对界面设计的一个理想是,任何年龄的人,任何经历的人,均可以在拿到设备后的几分钟内轻松的掌握它的用法。这也是为何当年那么多用户拿着iPhone后就爱不释手了·~说个简单的栗子:我爸历来没玩过智能手机,但当他拿着个人ipad时,我都没怎么教他,他竟然一下就会了。在这个层面上,扁平化确实有点弱哦。
可点击区域模糊
不少人(特别是没常常接触电子设备的人),第一次看到扁平化设计是有种焦虑感的,由于不少时候不知去按哪里......
表现形式单一,同质化严重,缺少个性
不少时候,扁平化设计在界面和网页设计中的表现形式少得确实有点可怜。若是去掉这个app的logo,有时候还真是很差区分,尤为是在如今这个你抄我我抄你的时代,你个人产品是辣么辣么的相近~( ˇ?ˇ )....何为个性可言啊~
高冷、缺少亲和力
扁平化设计大都用的是精简或抽象后获得元素,并且甚至有些网站的设计就是同一个颜色一大片,而后敲几个字在中间。卧槽,确实够简洁,高大上,B格大大的有。但这种风格看多了,就会以为无内容和空洞,甚至有些性冷淡。
经过上面分析扁平化的优缺点,细心的你其实不难发现扁平化的不少缺点都是能够经过一些方法去改善的。其最大的好处仍是在于,可以适应技术的发展。而且最大限度的呈现内容自己,而不是展现无用的装饰。(由于在产品设计当中,设计只是为了更好的呈现产品自己而存在的,一旦“设计过了”,就妥妥的变成了一种无用的装饰了。)
所以能够说扁平化设计是顺应时代的产物啊。而事实上发展到今天的扁平化设计确实也在不断的优化本身~使得本身更加的适应时代的发展。但其实要想真正的运用好扁平化设计,毫不是一件简单的事情。练过书法的孩子都应该知道一件事:笔画越少的字越难写的好,反而是那些笔画多的字很容易写好。扁平化设计也是一个道理,它很是能看出来 一个设计师的基本功。
运用好扁平化设计须要哪些技能
1. 排版
因为扁平化设计摈弃了不少无用的元素,让人所有集中在内容上面。这个时候对内容的合理呈现变得尤其的重要。因此排版我认为在扁平化设计当中是核心啊。
2. 配色
了解配色基本原理的都该知道,一个页面最好不要超过3种以上的颜色。颜色配的好很差,正确与否都是用户是否愿意停留在界面的关键因素,由于颜色会给人第一个感受,感受很差细节都懒得看了~
3. 字体运用
和配色差很少,字体也不能随意使用,最好都不要超过两种字体。内容绝定用什么字体。举个栗子:要表现的内容是古典的奢侈品,这时候脑子里第一反应就该用衬线复古字体。
4. 精致的图标
这里的精致包括两层含义,1.图标自己的语义 2.设计形式。就是说不管你用线的形式仍是面的形式画图标,都得让人明白你这个图标是什么意思。只为好看不求语义的icon,就是耍流氓~
5. 有趣的配图
为了下降扁平化带给人的距离感,不少时候须要经过有趣而具备亲和力的配图来拉进与用户间的距离。这样让界面和产品有了感情在里面,容易让人接受。
6. 适当的动效
扁平化加入动效是如今设计的一个趋势。为了让关键操做区域可以提供良好的操做反馈,动效的引入简直就是神助啊~~因此骚年~感受去学如今流行的Motion Graphic吧~妥妥的对你有帮助~
你会发现这些技能除了最后一项,其他的全是设计基础。若是你的基本功很差。笔者敢保证你的设计绝对是......如下省略几万字。(~ ̄▽ ̄)~
以上说了半天,想必也该知道为何扁平化设计辣么火了吧~~至于它会否被另外一个新的风格所取代,臣妾也不知道啊!!
可是若是你们对世界现代设计史有了解的话,或许你会有本身的想法。你会发现从英国工艺美术运动开始,一直到如今的现代主义设计。这中间所经历的风格都是跟随着科学技术的发展而发展的。
另外还有一个点就是所谓的 “审美疲劳”。当你一直看着简单的东西,长此以往就会愈来愈烦,你就会愈来愈想要看那些丰富多彩的东西。反之亦然。我想设计也不例外。无论是制做方仍是用户本身,都会审美疲劳。就算不疲劳,有些产品也须要标新立异,不同凡响,也必然会走向另一个极端了。微软的metro其实就是~就是为了和苹果的风格区分开来。历史上还有不少艺术运动也是如此。例如“波普”设计运动~等等......
过分解读设计趋势这个东西笔者认为意义不大的。设计的一切都是为产品服务的,不管是哪一种设计风格,只要设计师NB,都能作出叼叼的东西~。因此风格没有好坏之说。
不少时候,设计自己最核心的东西一直都没变,即更好的解决问题,风格什么的都是为解决问题而服务的~~