浅论扁平化设计

《浅论扁平化设计》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、浅论扁平化设计摘　要：扁平化设计逐渐应用在插画、VI和UI设计等许多领域中,变得非常热门。扁平化设计不但需要掌握一些美学设计技术与原则,还需要根据不同的情况用动态思维去思考,让设计的各元素形成高度统一;也揭示了无论何种视觉风格,精准的信息表达和好的交互体验才是在插画设计的根本,从而可以设计出让用户满意适宜的设计。1．什么是扁平化设计现代生活的影响关于“扁平化”设计扁平化设计是今天一个非常热门的话题，英文名为“FlatDesign”，它完全属于二次元，在实际当中，“扁平化设计”一词所指的是放弃一切装饰效果，如阴影、透视、纹理、渐变等一切装饰效果，凡是能做出3D效

2、果的元素一律不采用，所有元素的边界都干净利落，没有任何羽化、渐变或投影，通过抽象、简化、符号化的设计元素，从而打造出一种看上去更“平”的界面。近几年来尤其在手机上体现得淋漓尽致，更少的按钮和选项使得界面干净整齐，使用起来格外简洁，简单直接地将信息展示出来，减少使用者认知障碍的产生。越来越多的网站及移动终端设备的界面开始应用扁平化设计,扁平化界面设计通过对图形、文字、色彩等视觉符号的应用,激起用户内心的触动,使用户在愉悦、满足的情绪中认识、接受信息.作为信息载体的视觉符号,不仅是对现实事物的再现和模拟,也是对意义表达的转换和信息传播的延续.Layervault的

3、设计师AllenGrinshtein曾经在HackerNews的一篇文章当中说：“长久以来，网站的界面风格似乎都在遵从着同一种设计美学，大家都在用斜面、渐变、阴影一类的效果来突出界面元素的质感。对于设计师们来说，制作这类‘可爱’的元素简直变成了行规甚至是荣誉。不过对于我们，以及为数不多的其他一些设计师来说，这种惯用的方式并非一定正确。”.2.关于扁平化与拟物化风格的讨论。有不少朋友来发表各自的看法，说明这确实是大家都蛮关心的设计问题。大家的观点虽然不同，但都有一定的道理，都能看出发表论调的设计师的思考和激情。我要说的是，在我看来这个事情里的的确确不应该存在哪个

4、强于哪个的争议，因为它根本就不是个非黑即白非美即丑泾渭分明的问题；脱离了实际产品的上下文环境，脱离了产品功能与目标用户群类型之间的关联，所谓好与不好的命题压根就不成立。说的具体些，远的不讲，单说Beforweb这边的视觉风格，除了每篇文章的图标以外，可以说是所有插图都的扁平化了，但如果有人说我是扁平风格的卫道者的话，我会很不开心，因为我只是在自己觉得合适的地方使用这种风格而已。我喜欢iOS里很多拟物拟真风格的界面，最典型的包括语音备忘录、iBooks、iPad里的日历等等，它们的界面让我觉得亲切自然，让我可以在冰冷的电子设备当中找到现实生活的真实感，就这么简单

5、。下面截图来自我平常自娱自乐时会用到的一些音乐方面的iOS或OSX应用。它们的功能的确非常棒，我着实在这些东西上花掉不少钱，但如果它们的界面没有采用如此逼真的拟物化设计，如果他们只是干巴巴的功能和数据陈列或是Metro风，我是绝不会在它们身上花半毛钱的。曾经看到过一句话，大意是，Metro风格让人看到未来，而拟物化则让人感觉像是回到家里一样。说的挺不错的；人不可能一直呆在家里，也无法始终飘逸洒脱的在外面寻求新鲜与未来感。我喜欢听真人使用真实乐器演奏的音乐，但这不妨碍我偶尔听听电子的东西。从扁平化风格出发，慢慢引出相对“公允”的看法，我个人觉得比那些单纯强调某种

6、风格的文章要有点意思。如今，关于“扁平化”与“拟物化”孰优孰劣的争论在圈子里此起彼伏的。我个人总是会被极简设计所吸引，所以扁平化的界面设计风格确实是我的菜。设计的好坏不是“美学”可以决定的.对设计风格的选取最终还是要取决于具体产品的实际情况。在我个人看来，相比于拟物化而言，扁平风格的一个优势就在于它可以更加简单直接的将信息和事物的工作方式展示出来，减少认知障碍的产生。3。潜移默化的扁平化去外面看上几眼，四处转转，你会发现他们所追求的这种于简约当中体现出的视觉美感。看到我们一直以来习惯了的那些视觉风格正在越来越多的网站和移动应用产品插画中被潜移默化的颠覆着，下面

7、是其他一些例子：新版的Squarespace几乎完全采用了扁平化的视觉风格，只在一些细节当中使用了相对传统的方式突出了重要的交互元素。试用一下你就会发现，其实他们的产品在功能逻辑上还是蛮复杂的，但这一切都隐含在简约直白的界面背后，你真的可以从中隐约感受到其设计团队付出的心血。4.设计原则无论采用怎样的风格，优秀的插画设计都有一些共通的设计原则：一致性通过具有一致性的设计模式及视觉风格，为用户建立起完整一致的心智模型，使图案更加易用，提升整体体验。对比通过对配色、尺寸和布局的调整，使可点击的画面元素在视觉上与其他元素形成鲜明的对比。布局在设计的过程中可以尝试使用

8、960gs一类的网格布局为画面设定视觉