UI设计中扁平化风格的发展方向探讨

（山东科技大学 艺术与设计学院 256600）

扁平化风格是继拟物化风格以后又一席卷全球的设计风格，它的涵盖面很广，近些年在UI设计中大放异彩，各大巨头公司无一不采用扁平化的设计语言。在近些年的设计语言发展过程中我们会发现虽然扁平化风格还是占据主位，但是人们开始对其感到有些厌烦。因此越来越多的公司开始将扁平化风格与拟物化风格结合起来，追求一种轻拟物化风格以达到更好的用户体验。

一、扁平化风格继续发展的必然性

社会在进步，快节奏的生活正逐步改变着人们的审美。而用户体验也逐渐被越来越多的公司所提及，而扁平化风格正是因其简练的特点而被人们所接受的，它带给了用户更好的体验，因此在UI设计中继续发展扁平化风格也是必然的。

（一）扁平化设计风格的概念

所谓UI交互中的扁平化设计是去除设计中三维突出效果的所有风格和属性，属于一种二维设计，在拟物化设计中的一些产生3D效果的元素被移除，其核心在于抽象，极端简化和符号化。在UI交互中使用扁平化设计可以更快更准确地传达信息给用户，这也间接地促进了用户体验。

（二）扁平化设计风格的表现形式

1.在图形方面，扁平化风格多使用简单的点线面替代复杂的细节刻画，将原来风靡一时的拟物化设计进行了简化，并且通过使得其更加简洁、统一。虽然扁平化风格处理后的一些图标显得十分简单，但是他们同样也具有很强的识别性和统一性。

2.从配色上来看，扁平化设计并不局限于那个特定的色彩基调，设计师们都倾向于使用一些高纯度、高明度的颜色来进行设计，因为这些色彩都能给用户带来一种独特的感受，纯粹的亮色往往可以和灰暗的背景形成鲜明的对比，这样便可以达到一种与众不同的视觉冲击效果。在扁平化风格设计中，同类色也正成为一种流行的趋势，使用同类色进行设计的产品往往使用单一的品牌色搭配黑色或白色来形成自己的设计语言。虽然扁平化风格的配色应该是大胆的，但是在选择颜色上还是要慎重，要根据自己的产品调性以及用户情绪版来进行选择。

3.从版式上来看，正确合理的扁平化排版可以很好地促进用户体验。在进行版式设计时我们要注意空间大小的变化，可以进行适当的留白让版式充满了呼吸感。在设计之前要先把自己当成用户，从用户的角度去分析，比如用户会先看到哪里，我们就可以把关键内容放大加粗放到视觉中心的位置。

二、扁平化风格与拟物化风格的对比

拟物化原来因为它的逼真写实而风靡一时，而扁平化去除了一切拟物化三维的因素而受到人们的广泛认可。有些人认为拟物化比较写实且可玩性比较强，而有些人认为扁平化简洁的风格更利于信息的传达，更能增进用户体验。

（一）扁平化与拟物化的空间占用对比

UI设计是一种为智能设备、互联网产品服务的一类设计，因此必须从实用性的角度出发去看待两种设计风格。在图标设计中，拟物化设计因为其复杂性，所以在设计过程中必定需要多个图层的配合，加上一些描边、投影、渐变等特效，导致其设计出来的图标大小难以控制，占用了设备更多地空间。

（二）扁平化与拟物化的适配性对比

如今智能设备种类繁多，不同设备之间的适配便成了UI设计的一个关键所在。为了适配不同设备，有些时候不得不对设计进行延伸和拓展的操作。拟物化设计在延伸、拓展后会导致变形，而扁平化设计变没有上述的问题，这也间接降低了设计成本。

（三）扁平化与拟物化的交互体验对比

在UI设计中，虽然拟物化在适配性和空间占用等方面不如扁平化，但是这种设计风格也并非是一无是处。就像iOS6的原生界面设计，拟物化风格的UI设计界面模拟了真实世界的材质、细节、光影等，模拟现实世界的交互方式，使不同认知水平的用户都能迅速认出这是什么东西，认知和学习的成本很低。与之相比，UI设计中的扁平化虽然十分简约，能够强调视觉层级，让用户更加专注于内容本身，但是较拟物化设计而言，用户需要一定的学习成本，而且给人一种冷冰冰的感觉，传达情感的能力比较弱。

三、UI设计风格未来发展方向的探讨

随着苹果公司iOS13以及Mac Os Catalina系统的发布，我们可以看出苹果公司的设计方向已经从纯扁平化变为了轻拟物化，将扁平化风格与拟物化风格有机的结合。在iOS13的备忘录中的画笔已经脱离了纯粹的扁平化，转向了轻拟物化的风格，而Mac Os Catalina系统中启动台里面的一些图标也增强了渐变，添加了光影的感觉，更加有立体感了。不仅是苹果，微软、谷歌等互联网巨头公司对于自己产品的设计理念也不再拘泥于完全的扁平化，他们都在尝试一种轻拟物化新风格，也许这便是未来UI设计风格发展的方向。

（一）扁平化设计依旧是主流设计语言

虽然各大巨头公司不再拘泥于纯粹的扁平化，但是他们所推崇的轻拟物化风格依旧是由扁平化风格所主导的，拟物化设计在其中只是起到了一个画龙点睛的作用。扁平化风格简约的特点使它注定不会像原来的拟物化风格那样被时代所淘汰。

（二）扁平化与拟物化风格的结合

1.可以在扁平化风格中加入一些动效设计。动效设计作为拟物化风格的一部分，逐渐走进了我们的视野，它为原本单调的扁平化设计更加有人情味了。它能清楚表现出层与层的关系。在用户使用手势操作的时候，优秀的动效设计可以让用户感觉是自己控制了整个界面的动向，让用户有一种成就感和沉浸感。当界面需要弹出一些提醒信息时，加入一些动效既能很好地吸引用户的注意，又不会显得很生硬，而且还能使得界面增添一丝额外的活力，使得使用者感受到产品的生命力，也间接提升了用户体验。这都是单纯的扁平化设计所不能做到的。

2.谷歌的Material Design首先提出了界面空间的概念，它并不是完全抽象的扁平化风格，它和拟物化风格一样，学习了现实生活中诸如投影、纸张的模拟等隐喻方法，在最大限度保证可读性的基础上增添了一些我们熟悉的拟物化风格的影子，因此这也算是扁平化风格与拟物化风格的一种结合。Material Design提出了扁平化交互中Z轴的观点，众所周知，手机的界面二维的，而这种设计方法通过类似投影、动效等的一些二维的设计元素构建了Z轴（三维）的概念。不同的投影便可以使用户知道哪一个内容的层级是最高的。

3.投影本是拟物化设计所独有的，但是当许多图形胡乱地堆叠在一起，没有主次时，可以适当加上一些显示生活中才存在的投影。因为这不仅可以很好地区分视觉层级，还能让用户知晓这个内容和其他纯扁平化的内容处在不同的信息层级上，是可以点击的，从而打消了用户的疑惑提升了体验感。但是在使用投影时要注意同一视觉层级投影的方向和颜色要一致，而且只能少量使用投影，否则会导致视觉层级的混乱。

4.材质是拟物化风格才有的一种属性，纯粹的扁平化风格完全抛弃了材质这个概念。而随着iOS7引入了毛玻璃的效果，越来越多产品的设计语言中也加入了毛玻璃的效果，这给了用户一种耳目一新的感觉。在扁平化的界面风格中通过不同材质的灵活运用打破了纯粹的扁平化设计，这也是扁平化设计与拟物化设计的有机融合。

四、总结

扁平化风格发展也有几年的时间了，对于产品的用户来说，他们关心的永远是信息本身，这也是今后扁平化设计仍会是一种主流设计风格的原因。但是这并不妨碍扁平化风格与拟物化风格进行有机融合，也并不妨碍轻拟物化风格的诞生。因为人们也逐渐开始对纯粹的扁平化风格产生厌倦，两种风格有机融合而成的轻拟物风格可以更好地促进用户体验。没有永恒的设计风格，但是只要我们将用户体验放在第一位，无论怎样都先从用户的角度去考虑，不断去探索、去尝试，便可以让自己的设计永远走在时代的最前沿。