扁平化设计是极少主义思潮下的产物，所有的设计元素均用简洁的形式来诠释。然而，要想真正做好扁平设计并非易事，因为你在保证视觉输出的同时还需要专注功能性。

那么，就让我们来看看扁平设计中需要注意哪些内容。

无形设计——去除所有不必要的装饰

设计是为内容服务的，将不必要的设计隐去从而突出用户关心的内容，这一点是很重要的。因为，一旦用户过多地关注到设计本身时便有可能分散他们的沉浸式体验。设计的目的主要是为了帮助用户快速方便地理解相关信息和进行必要的操作。因此，你的设计需要隐去所有不必要的视觉装饰从而将功能最直观化地暴露给用户。

Dropbox 的注册页设计让用户专注于内容

明快的色彩——色彩是扁平化设计一个非常重要的方面

色彩的选择是扁平化设计中非常重要的一方面，它直接决定了你的网页或app想要传达给用户的感觉。扁平化设计中的色彩相对于其它设计风格来说一般更明亮和鲜艳。

Rovane Durso

小建议：

＊Material Design 和 Flat UI Colors中有非常好的色彩建议；

Flat UI Colors

＊当你在调色的时候最好将色彩的纯度稍稍降低因为这样可以让你的设计看上去更加具有美感，同时也避免了太过鲜亮的颜色让你的用户造成视觉疲劳；

舒服的颜色可以让用户专注于内容本身而不会分散用户的注意

thehypeagency

＊当背景比较暗时不妨选择较明亮的颜色，这样可以突出你想要突出的内容；

明亮的颜色搭配稍暗的背景可以形成深刻的视觉印象

triplagent

＊确保你的色彩是可以被用户所理解的，这一点非常重要。

注重字体的选用——突出你的重点

文字可以帮助用户区分页面中重要的部分。运用简洁化的字体，因为这样易于阅读同时也很方便下载，而这些都与极简化设计匹配。

简洁的字体可以传达出自信和清晰

Cienne

小建议：

＊可以考虑在扁平化风格的网站设计中加入无衬线字体，并利用字体的变化营造干净、简洁、现代的感觉；

＊字体的气质要与你的整体设计相匹配，一个好的字体可以提升整体的设计质感；

动效——动效体现“用户为中心的设计”

动效与扁平化设计是非常匹配的。当用户使用app或者浏览网页时，他们通常有如下问题：

＊“这个页面中最重要的地方在哪里？”

＊“我接下来应该怎么做？”

＊“我如何知道我已经完成任务了呢？”

诸如此类的问题可以推动设计师运用动效设计去增强用户的使用体验。动效设计提升了体验感知并且提供了一些答案：

＊动效可以吸引用户的注意并且提示用户通过点击或者其它操作后接下来会发生什么；

＊动效帮助用户对界面进行定位并且帮助用户区分各个是图中的重点内容；

＊动效帮助建立有效地视觉反馈；

动效可以模拟一个3d的感觉，它通常以多种形式出现，如页面转场，小动画，甚至还有文字；

动效可以传达互动同时可以方便用户去理解它们

Anish Chandran

插画——插画时扁平化设计的一个重要延伸

随着扁平化设计变得越来越图层化，插画也变得与扁平化设计越来越匹配。

图片比文字更能增强用户的体验，合适的插画可以将一些很抽象的概念变成易于用户理解的图形信息从而达到有效传达信息的目的。

Intercom利用插画引导用户得到有效信息

扁平设计2.0——对于用户来说交互应该是直觉性的而非刻意需要解释的

对于设计师来说，设计一套扁平化设计最大的挑战来自于如何使用户得到很好的交互体验，用户需要知道页面中那些部分是纯内容哪些部分是可以点的。现在越来越多的设计师意识到这个问题。因此，在这样的情况下，扁平化2.0设计应运而生。

扁平化2.0设计是极简主义下的更好演绎，扁平2.0利用阴影和边缘去传达交互性。阴影和渐变帮助用户理解哪些部分是可以点击哪些则不能。因此，用户体验得到了提升。

阴影帮助用户了解页面中各元素的层级关系：在一些场景中可以帮助区分两个物体之间的不同点，帮助用户感知哪个物件是在上一层级

Google

下面的例子可以帮助你了解运用细微的阴影是怎样提升CTA(call-to-action)按钮在页面中的层级：

总结

扁平化设计兼顾功能和美观，它让我们更进一步地接触到数字化设计，而数字化设计最终将实现功能与美观的和谐统一。