扁平化UI设计视觉爆发力.docx

/ 创想设计学院 官网：/ 创想设计学院 扁平化UI设计的视觉爆发力 扁平化设计无疑是当前讨论最多，最火的设计形式，自ios7面世以来更是将扁平化设计的讨论推向风口浪尖。 在这里我不想分析拟物设计和扁平化设计的优劣，更不想说谁更好!在形式服从内容的今天，我只能说哪种设计风格更适合你的产品，就像你问我水和酒哪个好喝一样，我没有办法回答，只能看此时你最需要什么。 首先我们来看看为什么会出现扁平化设计，有人说是对拟物设计审美疲劳了，有人说是一群高级设计师为寻求突破做出来的设计潮流，有人说，是从平面设计中演化而来? 我认为这些都对，扁平化设计是设计发展的必然规律。 举例：来看看我们的文字发展： 最初人们用图画文字(象形字)来纪录，这是一种最原始的造字方法，把想要表达的物体的外形特征描绘出来，慢慢的演化到繁体，到现在的简体 UI设计 也许设计也正是在遵循这样一个从繁到简的发展规律，从写实拟物到抽象扁平。 当然，幸运的是我们正在见证这个演变的过程! 所以大家不用特别喜欢或者特别反感这种设计，应该承认扁平化设计是当前的一个潮流，也是一个发展趋势。 作为一名设计师，能适应当下潮流并把握住潮流也是非常重要的，所以我收集了一些关于扁平化设计的做法，这里主要偏视觉侧，欢迎大家一起来讨论 1.去掉特效 先来看一组对比图片 (素材来源：dribble) 同样是镜头的设计，在扁平化中去祛除了渐变，阴影，质感，等各种修饰手法，仅用简单的形体来表达，显的干净利落。 做减法，这第一步应该是最容易的。 2.简化提取 首先我们来看看做简化和提取的一个典型例子 毕加索画的牛 UI设计 (素材来源：百度百科) 一头牛从最初的写实到最后仅仅只用几根线条来表示，整个简化的过程也经历了好几个步骤，当然这里对设计师观察和提炼能力要求很高，要充分了解对象物的本质，懂得巧妙的取舍，用极简的要素，在没有更多特效装饰的情况下表达清楚内容，在界线与轮廓的高对比下，表现出物体的美感。 我们来看看毕加索的一些代表作能不能从中找到扁平化的特点 毕加索被称为立体主义流派的主要将领。 过去的画家都是从一个角度去看待人或事物，所画的只是立体的一面。 立体主义是以全新的方式展现事物，他们从几个角度去观察，从正面不可能看到的几个角度去观察，把正面不可能看到的几个侧面都用并列或重叠的方式表现出来。 《亚维农少女》 在《亚威农少女》中，五个裸女的色调以蓝色背景来映衬，背景也作了任意分割，没有远近的感觉，人物是由几何形体组合而成的。 《三个乐师》 《三个乐师》是毕加索以几何形体造型的立体主义的代表作。这里，几何结构集中到画面中心线，同时向外到画的边缘又更加松散和开放，这样，人物便明确地出现了。毕加索能把线结构与调和得很雅致的短笔触结合起来。 《瓶子、玻璃杯和小提琴》 在这幅画上，可以分辨出几个基于普通现实物象的图形：一个瓶子、一只玻璃杯和一把小提琴。它们都是以剪贴的报纸来表现的 简化和提取确实不是一朝一夕的事，对设计师的要求也非常高。这里平时可以多多练习观察，建议可以看看传统绘画-白描和传统的剪纸艺术，以及传统纹样。古今中外在很多艺术表现和扁平化设计都有异曲同工之妙。 白描：(用墨色线条勾描形象而不施彩色的画法) (素材来源：昵图网) 剪纸(将不同时空和不同空间的物体放在同一个平面上。仅用点线面的组合借助静态的平面化表现) 纹样(仅仅用形状和线条就能表现出各个品种梅花的不同特点) 只要仔细观察，认真提炼，任何事物都能用极简的方式表现出来 。 练习举例： 如果要你拟物画出以下两种梅花，应该很容易。 但是你能通过观察，发现他们的区别并用简单的线条提炼画出来吗?(有兴趣的同学可以尝试画一下) 3.巧用色彩 在扁平化设计中，色彩运用的是否到位，无疑是这种设计风格中很重要的一个环节，看很多作品，在色彩上更多的强调更亮 、 更鲜艳。 学习配色，除了理论知识外，借鉴优秀网站的配色也是个好方法：《玩转整体色彩搭配!看看这40个经典案例》 在以往的设计中，大多数情况下设计一个作品更专注在两三种颜色之间，而扁平化设计的色彩往往在6到8种。 以下收集了一些颜色使用频率比较高的作品，如图 蓝/绿色： 裸色(粉色)： 杏色： 灰色： 紫色： (以上素材来源：dribbble) 这里除了颜色的搭配还有一点就是，在很多时候扁平化的视觉设计中，是很少有线条出现的，更多是用色块来表现各种关系。(怎么用色块表现，这里应该也可以有一个专门的分享) 当然也有一些是走复古风，同色系，和低饱和度??等等的 重要的是各种调调放在一起看起来要和谐 (以上素材来源：dribbble) 4.排版很重要 由于在扁平化设计中采用的都是极简的元素，所以，排版就显