从艺术史出发，帮你完整梳理一遍UI设计趋势

准确预判业趋势，是件很难事，所以这趋势浅析仅为个家言，分析表皮浅薄，各位看官权茶余饭后故事看吧。

我们先看「趋势」的字面意思：事物发展的方向，表示一种向尚明确的或只是模糊地制定的遥远的目标持续发展的总的。今天跟大要聊的就是 UI设计发展的向。

在了解事物发展动向前，从三个方面作为切入点，即从对过去艺术计发展的析找规律，对现在 UI 发展的析找不足 ，从而预判未来趋势。

一、近现代艺术设计发展

1. 近代艺术发展

代艺术发展要由几大设计潮流引领，依次系为：古典时期、巴洛克洛可可时期、古典义时期。

古典时期

艺术格严谨写实，追求构图的均衡与整，强调性而轻视情感，纯洁、典雅、和谐、稳重。

巴洛克洛可可时期

巴洛克：风格多变、动感、不规则，宏大、奢华；洛可可：精致、小巧、妩媚、浮华、矫揉造作。不再纯洁，开始反典主义教条。

新古典主义时期

艺术形式是对巴洛克洛艺术的反对，重新追慕古典、追求内涵，强理、构图的完整，追求以简练的形式表现高雅的气质。

2. 现代设计发展

设发展主几节点：运动、主义后主义。

19世纪下半叶，源英国的一场设计改良运动，进现代以；工业革命以大批量工业化生产导致设计水准急剧下降，设计师在看不下去，工艺美术运动，为什么从工业美术运动讲呢？因为它是现代设计的开端，承上启下，对世影响深远.

工艺美术运动

艺术特点强手工艺生产，反对机械化生产，反对矫揉造和其他各种古典、传统的复兴风，提倡中世纪风，主设计诚，讲究简单、朴、风良，提倡自主义风和东方风。

主义

打破传统，打破设权贵服务的立场，设民主化，形式提倡非装饰的简单几何造型，极简化设，主张少即多，形式追随功能，主张理性设。

后现代主义

主张多化计，不规则化，用艺术表达多种思维方式，少则厌烦，反理性主义，重形式，调历史文脉依托。

通过对以上计潮流更替析，发现艺术发展其实是一个继承、否定、再发展的过程。刚开始以模仿写实为主，模仿写实发展极致后，然就会有人摒弃、反对，逐渐开始寻求突破，形成一股新的潮流，但当这种新的潮流成为主流后（以前被做非主流）；然就会有人站出来反对这种潮流，然后继承再发展。

二、现今UI设计发展

进入21纪，随着社会发展术进步，息软件行业逐渐兴起，这要谢乔帮主给碗，正是苹果的计让全球开始重视用户体验重视 UI计，以前大家都叫美工。

1. 拟物化设计

早期 UI计都是拟物化计 ，其风格点：模拟真实物体的材质、质、细节、光亮等，交互也模拟现实中的交互方式，学习成本低，传达丰的人性化情。缺点：拟物化本身就是约束，会限制功能本身的计。

2. 扁平化设计

大看拟物设计是是很像古典义跟工革命开始那会，模拟真实，讲究设计实。但是慢慢人们审美疲劳，那么肯定会有一种设计潮流，汲取它精华再起来反对这种设计，那就是扁平设计，我们现在大环境就处在这个设计潮流中。

扁化有多优点：去掉界面冗余的装饰效果，「息」本身重新作为核心被凸显出来，计素调抽象、极简、符号化，计更简约, 条例清晰；缺点：需要一定学习成本，传达的情不丰，甚至过于冰冷。

如：早用扁平化设的之一，就微软的芒果 MetroUI；家看过于扁平效果并不太好，扁平化设很主义，推崇极简，冷冰冰，所以我们问两问题：

• 扁化就应该仅仅是扁吗？
• 扁平化之后应该什么化？

3. 3大设计语言

在回答这两个问题前，我们先分析下最具代表性三大系统最新设计语言，设计理念很要，大部分设计趋势是通理念推动。

Material Design

中文：料设语言，由 Google 推出的全新的设语言，引入电子纸张隐喻，以我们用纸张获取信息，用设备，其实都电子纸张，谷歌对纸张重新行了阐述，扁平之外，增加了很多新特性，如：https://v.qq.com/x/page/m0131l1zvvo.html

阴影和级：用阴影的深度来表达级，并且有个级。

Z轴理念：场立化而不局平面，增加信息纵深。

触摸波纹，流畅动画：有意义的动画指示。

卡设计，自适应局：应用卡的设计理念对局严规范，而且局以灵活的自适应到任何设备中。

iOS

由于 iOS 12 太的设新，我们主看 iOS 11，应用的圆角卡片式设，面积的背景图，效果冲击力强，点击欲望也强了，页面加入超标题栏字体，这以的小字细字体很的区别，阴影也比较高级的阴影。

圆角卡片，标题，阴影：透气的图片背景，清晰的文字阅读层级。

线性元素向面性化：线形图标改变了面形，阴影替描，不单单图标，碎片信息越越多，越越需归纳；零碎的线逐渐往整体的面过度。

Fluent Design System

软去年推出的计语言中文名：流畅计体系，集各家所长，在 UI 美学上它更是大有进步，系统包含以上五大核心素：光线、深度、动效、材质和缩放。

光线Light：通过光线的运营，界面更有质，更加未来。

深度Depth：运用深度理念，可以构造出多视觉效果，如视差、前后变换、空间运动等。

动效Motion：不言而喻，动效使页面更加流畅，也更观赏性。

材质Material：在界面中赋予材质，如毛玻璃、亚克力这的高层次的组效果，使整个页面高。

缩放Scale：Fluent Design System 主要目的是一次计，就可以用于 0D（只有语音）、1D（Surface Dial）、2D（UI）、3D（VR/AR）的种种情况；所以伸缩性比其 UI计语言都要更重要，尤其是在 VR/AR 备上，未来应用潜力巨大。

按照 Fluent Design System 这种计理念计的 UI 界面，效果确实棒！

三、现今趋势：扁平化就应该仅仅是扁平吗？

现在回答前文第个问题，过三大系统分析 ，我们发现各大互联网公司都不再拘泥于扁平，都在尝试新设计形去反扁平，这些反形，也是现在最盛设计趋势。下我们看看有哪些形：

1. 纵深

如让张页不再扁平，我觉最快最接法是增加纵深，把要信息凸显出来。增加纵深常用手段：

大阴影

越来越的设计师为卡、按钮增加大阴影，来突出级。

三维立体

打破扁平，增加立体，三维元素界面中越越多的得到运用。

2. 动视

动效视差越来越被计所重视。

转场画

实画，诠释功；观赏画，缓冲户等待焦虑。

力视

视动画结合力感应，让用户身临其境。

3. 材质

通不同材质的运用，打破扁平，苹果毛玻璃，微软亚克力材质，相信未来也有更材质加。

4. 层次

极赋视觉层次感的页面设不仅极具设感，取悦用户身，且还建立了清晰直观的视觉层级，方便用户简单速的识别读取需的页面内，从提升用户体验，降低跳出率。

大对比

素尺寸越大，越突出，越容易吸引用户的注；不过尺寸大也要有度，控制在用户能够受的范围内，Airbnb 和苹果大字号运用就比较得当。

色彩对

利颜色的强烈对，突页面层级。

适距留白

留白巧妙运用，能够常有效地突出页信息。而页内部元素，保持适距，让彼此相互联系而不「拥挤杂乱」，也是吸引用户注意不策略。

四、未来趋势：扁平化之后应该是什么化？

回答个问题前，我得大家有必要先畅想一下未来的生活方式和形势，我们先看个短。

https://v.qq.com/x/page/i01586jf3it.html

通过短片我们发现，未来科技的迅速发展人们设计审美更，随处都是屏幕，信息更繁杂，效得到普及，人怀愈重要，各种技术的普及，更多设计形式现，全息投影会。

所以暂且把扁化后的计潮流取名为：后扁化&多媒体化。

那它有什风格点呢？个人认为会有如下点：

• 扁平仍将宰，但更抽象简约
• 息为主
• 人文关怀
• 动效普及
• 多元化设计
• 虚拟全息维投影

以上为本于 UI设计趋势些感悟分享，分析不够全也不够深刻，欢迎大家留言起探讨。

注作者的微信公众号：「未知素设计」

图片素材作者：Eddie Lobanovskiy