这篇文章我们将运用严谨的几何形来塑造水果的形象，通过巧妙的形色组合、形状本身透明度的叠合，表现具有简约、大方、时尚感的鲜果派对插画海报。

工具

工具：AI(Adobe illustrator)

适合：零基础入门

扁平风的基础思维准备：几何形组合造型

几何形一直被视作是抽象造型的基础元素，通过几何形有意识的相互叠加组合，就可以使得这个造型呈现出可识别的对象，比如我们在这个教程里所表现的那样：用几何形画水果。

比起细腻丰富的传统画法，极简的几何平涂造型所创作的水果，看起来有着别样的生动的特质，摆脱了对水果表面质感的依赖，转向对形色的探索，是扁平插画的基础思维。

常用的几何形是：圆、方、三角，在这个教程里，我们就运用矢量软件AI(Adobe illustrator)进行创作，接下就开始来打造我们的《鲜果派对》海报吧。

用方形塑造苹果基础形

常见苹果的画法可以是圆形起步，也可以是从方形开始。

STEP 01

打开AI，新建一个文档，运用粉色画出一个正方形，这就是苹果的起始形。起始形非常重要，它决定了接下这个苹果的形状走向。

然后，我们把这个正方形改变为梯形，改变的方法有很多种，这里我们利用变形工具，进入【效果>变形>弧形】，在变形工具的面板里，将垂直这个滑块调整为-15%。

STEP 02

在选中上一步所变形成为的梯形的基础上，进入到【对象>扩展外观】对它做一次扩展外观。

扩展外观就是让这个形状真正变为矢量梯形的路径，如果没有做这一步，这个形状看似是梯形，其实还是原来正方形的矢量路径。分辨真假梯形也很简单，只要选择这个形状，看到路径的走向仍然是正方形，那就是假性梯形，这就需要为它做一次扩展外观。

STEP 03

然后再选中这个梯形的基础上，单击左边的工具栏里的【直接选择工具】，就会看到四个角内分别带有四个很小的圆点（仔细看是一个同心圆），拖动它，你会发现它会控制这个角，将它从锐利的角变为圆弧。

根据圆弧离形状中心的距离多少，弧度也会相应发生变化。

好了，苹果的基础形就完成啦~

细节的魔力

我们开始为苹果增加叶片，叶片的画法首先也是要从基础几何形开始慢慢演变而成。我们在叶片这个部分提供的基础几何形同样是正方形。

STEP 04

用蓝紫色画出一个正方形，然后再复制一个正方形，将这个复制的正方形旋转45°，变为菱形。再复制第一个正方形。于是我们得到了两个正方形和一个菱形，将它们像下图所示拼起来。

然后再选中这个组合造型，进入到【窗口>路径查找器】，在路径查找器的面板中运用【联集】将它们拼合成一个独立的封闭的路径。

STEP 05

然后再利用控制形状角度的小圆点，就像STEP 03那样分别选中下方以及左右两边的圆点，将角转为弧形。一片叶子就这样制作而成。

问：感觉似乎这样的方式比较麻烦，为什么不直接用钢笔工具画呢？

这也是我在这一风格的画法中想要重点强调的：尽量避免使用钢笔工具，而用几何形进行转化，是保持扁平风格中几何感和抽象感的诀窍。

因为手动画出的路径毕竟不会特别严谨，这时就难免让扁平风格失去了它本身的风格特点，而这时如果没有较强的结构感，整个画面就会看起来”平淡“甚至”无趣“。

其实叶片的造型也可以探索出其他的几何方式进行组合构造，本文只表现一种方法。其他的方法，可以留给你下去尝试。

STEP 06

这时，把这个叶片的形状的混合模式改为“正片叠底”，利用叠加的视觉效果增加画面的几何感和时尚感，这是在我们过去写过的文章《超级可爱！插画萌新必学的PS极简马克笔简笔画：盆栽篇》以及相关系列文章也都运用过类似的技法。

STEP 07

最后，用线条增加最后的细节。这里所用的线条是较细的3px的黑色线条。这里的线条粗细要根据形状本身的尺寸大小比例来确定。总之，对细节的描绘可以克制一些，不要太过复杂。

利用线形的组合以及形状叠加的视觉效果，扁平风的简约苹果元素就画好了。

准备好元素，完成海报

STEP 08

蓝莓的画法从矩形起步，对矩形的组合以及成形的演变方法，是我们重点要训练的对象。中间的步骤我们已在文章前面详细叙述过了，这里就不再重复。可以继续用这个方法演练下去。

STEP 09

画草莓的时候，运用了两个梯形进行组合。利用叶片造型进行叠加，也能增加图形的魅力。

STEP 10

我们把其他的水果元素也画好，我这里准备了一些比较可爱的樱桃、西瓜之类，你也可以画点菠萝、芒果之类，注意要把握每一个水果的基础形特点，然后在细节的部分加以强调。

把每个水果元素放到海报的设计中时，要考虑的还有对水果元素之间的间隙的疏密均匀程度，元素可以较大，有些元素甚至可以渗出到海报之外，这样会让视觉效果更为延伸。

本文的不用手绘就能设计出扁平几何风基础插画就介绍到这里，如果经过路边有家鲜果店，挂上这样一张海报，应该效果是不错的吧~ 先自我陶醉一波~

作者：飞屋睿
来源：飞屋睿（ID：ifeiwu81）

创作：Cecilia Castelli

人物的画法向来在插画界中都是风格各异的，今天我们创作的这个人物相对会倾向正常比例，找准她的身体比例结构表达到位即可，利用网格构图来组合画面，将会让扁平风格看起来更具有结构感。在整个流程中，我们会同时用到AI和PS两个工具，这两个工具共同属于Adobe的软件，应用上彼此更容易沟通。我们会用AI起形，用PS来描绘光影，相比以往全部采用AI来绘制矢量插画略有不同。

准备工具：

Photoshop (2019)

Adobe illustrator (2019)

数位板

草图构思

无论是设计也好还是插画也好，都总是少不了从草图起步，这是idea的来源。实际的画面可以不一定依据草图，它只是给出一个大方向。

绘制人物头部

STEP 01

绘制基础形从AI开始，我们打开AI，新建一个文档为1600*1600px，然后再进入到【编辑>首选项>参考线和网格】，在面板中设置如下参数：

STEP 02

我们开始要学会用网格来辅助造型，首先显示出网格，这里要进入【视图】，然后单击【显示网格】，并且勾选【对齐网格】。有了网格的辅助，我们的画面就会看上去有种内在的稳定感。

STEP 03

接下我们来开画，人物的侧脸，把草图拿来看了，然后扔掉。警告：不要完全去勾草图，否则你会错过一次练习造型的机会。

人物侧脸的左侧是最终呈现的线条，所以注意这条边要对齐网格，并且注意它的轮廓表现。而这个形状的右边那条边由于最终会被头发等形状所遮挡，因此随意画出即可。色彩可以填充为肉粉色，作为皮肤的色调。

STEP 04

接下我们要继续画出头盔，头盔的步骤如下图所示：

STEP 05

把头盔放到人物的脸部上方，将它略调整为与网格对齐，人物的头部完成了一大半。

STEP 06

接下绘制人物的头发，头发的部分我们打算用矩形来生成。下面是用矩形做头发的思路：利用矩形来拼成头发的形状，矩形本身是直角，但是经过圆角拉伸后就变成了圆角矩形，这时就很容易做出头发的飘逸的效果，又不失扁平人物的风格表达。过程如下图：

STEP 07

把上一步做好的头发，连接到头部。这里需要补充一个色块，并且做好圆角的处理。要做到自然而然，不要接得太生硬。该调整的地方继续调整。

到这一步，头部就完成啦~再检查看看头部的视觉是否正常。

画出人物身体

身体的部分要画出来，首先要明确人物的头身比。当然我们不是再现真实的人物，所以允许头身比可以有部分出入，但是基本上还是按照6-8头身的比例。这个比例具体是指什么意思呢？就是我们的身体高度刚好是头部高度的6-8倍。

下图为7.5头身比例图：

STEP 08

我们画身体也是从直线开始，利用钢笔工具画直线，用直线来勾勒造型，注意对齐已有的网格线。

STEP 09

然后把部分的直角转为圆角。

STEP 10

再画出右边的手臂，注意比例和对齐网格。然后再把部分尖锐的角转为圆角。

STEP 11

手部的画法很简单，也是从矩形开始。然后把部分直角转为圆角。

STEP 12

最后把头发的部分拉大一点，然后把所有的细节都整理一遍。

STEP 13

画出女生的小裙子，也是从直线起步，最后把裙子边缘转为圆弧。

STEP 14

两条腿的画法依然是利用钢笔工具，注意小腿肚可以给个弧形来表现。

STEP 15

画出鞋子的部分，并且增加鞋子的滑轮。

STEP 16

把人物的膝盖的部分的细节再进行细化，如下图

到这一步，整个人物的基础大型就完成了。

继续丰富装饰细节

STEP 17

在目前的基础上给人物增加小细节，这些小细节可以增加人物的生动感。比如我在这里给人物添加了头盔、腰带、鞋底以及长筒袜的细节。这部分纯靠想象，大家可以稍微放飞自我。

利用AI的形状生成器工具就能生成不同的形状。

STEP 18

长筒袜的图案可以画出来，让画面更丰富。首先我们要画出一条线，这条线的描边为80px，然后进入【效果>扭曲和变换>波纹效果】，面板参数如下所示。

STEP 19

将上一步所做的形状进行扩展外观，变为封闭的路径形状，然后应用到长筒袜的白色形状上。多余的部分用形状生成器工具删掉。

人物的塑造到这一步就完成了

画阴影提质感——一切交给PS

我在扁平插画课里给学员们所介绍的增加光影的方法一般来说是用AI完成的，但是其实增加光影，PS也能做到。所以，我们这次就用PS来增加光影表达。

STEP 20

可以打开PS，新建一个1920*1200px的文档，然后将AI所画的对象复制粘贴过去。粘贴时选择“智能对象”，并且增加一个纯色背景，背景色为暖粉色。

STEP 21

这时利用数位板/手绘板，开始对人的皮肤的部分增加阴影，用普通的画笔即可。

新建一个新的图层，然后设置为下面那个图层的剪贴蒙板。在新图层上添加阴影色块。利用【选择>色彩范围】，首先选中皮肤的颜色，这时记得要选中人物的图层。然后在新图层上开始绘制阴影区域，颜色稍微比皮肤的颜色略深。

由于有蚂蚁线选区的控制，开始涂阴影的时候就不会溢到其他部分。除了阴影，还可以增加高光的部分，让画面看起来更立体。画笔选择“硬边圆”就好。

STEP 22

利用以上所介绍的步骤，开始对其他的部分都分别画上阴影和高光。

因为画的过程是非常自由的，只需要掌握基本的原则即可。这里不再详述每一步，下面是需要注意的要点。

可以利用画笔画出部分细节。

STEP 23

最后把长筒袜的部分也做出阴影表现，这里的处理手法和上面略有不同。因为这里涉及的颜色较多，所以我们不能用单色的处理手法来提供选区。

此时需要再新建一个剪贴蒙板，利用钢笔工具来生成长筒袜的形状，然后用棕色涂出阴影部分，再降低整个图层的透明度。

STEP 24

追加颗粒感的纹理，再新建一个图层，创建剪贴蒙板，继续自由发挥。这时可以选择【特殊效果画笔】里的“喷溅笔刷”，或者选用其他你自己私藏的颗粒感笔刷，这里不是那么绝对。

STEP 25

增加了颗粒的效果，可以让边缘变得也具有这种生动的手绘感，因此这时可以再新建一个图层，利用边缘比较有机的画笔来表现，这里的图层不需要创建剪贴蒙版。

其实插画不一定要加颗粒，增加颗粒是为了提升趣味感。大家可以对比一下，增加颗粒前后。

STEP 26

最后通过色彩平衡等调色工具来对整体的色彩进行调整，并为人物增加文字背景，将文字也画出阴影的效果，冲淡背景的单调。并且为整个插画增加点状图案。

最终效果如下：

写在后面：

后面为插画增加文字和图案的部分，由于是即兴发挥，所以不再多累述。你可以增加图案，也可以保持原状。这部分可以发挥你的原创来绘制。

原文链接：ifeiwu

支持者：扁平设计很时髦

扁平设计非常时髦，但是它会持续多久？ 如果你是追赶潮流的设计师，却没尝试过扁平设计，现在正是时候搭上扁平设计这班车。采用这种风格的项目（并且用得恰到好处），在各种博客中随处可见，包括我们这个，有助于提升你的设计 而且，跟随潮流而设计，乐趣无穷

反对者：它只是种潮流

时髦的另一面，是你永远不知道它能流行多久 我们已经能看到，趋势正在从纯扁平设计向类扁平设计或长影扁平设计转变 如果你频繁改版你的网站或APP，时尚的设计也许适合你。如果你要一个网站经久不衰，请考虑不那么“潮”的东西

支持者：简单的移动界面

简洁的移动端设计，是扁平设计应用中的绝佳例子 一些令人印象深刻的扁平界面设计被应用在功能简单的APP上。巨大的按钮在移动设备上容易点击，不需要再放大来寻找链接

反对者：可用性值得商榷

当涉及到某些复杂的用户体验时，扁平设计就会变得单调 并非所有用户都喜欢这种界面风格，他们有时会不知道该点击哪里 Norman Nielsen Group的一项分析指出，扁平设计风格会干扰可用性，因为用户有时不知道什么是可点击的。而且，扁平设计的项目总倾向于更低的“信息密度”来保持简洁

支持者：明亮的用色可以烘托氛围

也许只是我个人感觉，但扁平设计看起来让人愉快。所有这些明亮鲜艳的颜色都令人爱不释手，创造了一种积极、迷人的氛围 Flat UI Colors，一个展示和帮助设计师使用扁平配色的网站，是个非常好的氛围提升工具 看看这些色调，它们都温暖而友好。即使深色也是基于暖色设计 由于扁平设计通常包含很多颜色，引发更多积极的联想。谁会说彩虹是阴郁的呢？

反对者：配色困难

在一个项目中你用的颜色越多，就越难将它们恰当地搭配起来 创造一个协调的配色方案本身就是一个挑战，如果你再加4、5种甚至更多颜色，它会变得更加棘手。成功运用扁平配色的设计师，都倾向于坚持统一饱和度和亮度，来设计一致的外观，使得颜色的选择有迹可循

支持者：聚焦精美的字体

 扁平设计的一个优势，是漂亮字体的聚焦作用 除去了装饰，字体确实在扁平设计项目中蓬勃发展。从精美装饰性字体，到简洁的非衬线字体，漂亮的字体是优秀的扁平设计的关键组成之一 在我个人看来，投影效果有点糟蹋字体。有趣的字体与大胆的配色之间形成的强烈对比，令人印象深刻、精神振奋

反对者：糟糕的字体变得更明显

正因为扁平设计有助于聚焦优秀的字体，它也能放大糟糕的字体。（看看苹果预发布iOS7时遭受的所有诟病，比如那极细的主字体，现在这个设计决策已经被修正了） 扁平设计冒失起来简直无法饶恕。选用什么都会有某种程度的戏剧性，难以掩盖字体的不完美 如果你对于字体的组合和选择不在行，那么扁平设计可能不是你的最佳选择

支持者：视觉表达简洁鲜明

 扁平设计的本质是简洁和鲜明。这是使它美观的重要特征之一 这种风格使用很多高对比特征，包括颜色、字体，和大胆的总体设计，保持段落简洁易读。按钮和其他UI元素通常设计成基本的几何图形，尽管边角也会用到圆形

反对者：它会看起来太简陋

取决于使用者的不同，扁平设计也被部分人评价为“过于简陋” 用扁平设计传达复杂的视觉信息会很困难 扁平设计的另一项反对声音，是用户界面工具太朴素。拟物化设计的支持者表示，增加一些具象的装饰可以让工具更易用。坦白说，这得看内容 在极度简洁的界面设计中，视觉层级也是一项需要重点考虑的内容。什么是最重要的？你如何通过视觉强调它？

支持者：扁平设计摒弃令人厌烦的装饰

 没有什么比一眼就看出设计者对项目充满厌倦更糟的了 这些本末倒置的花哨装饰包含了太多阴影效果、古怪的动画，或者根本就是显得多余的随机效果 正因为扁平设计简洁的本质，这些约束可以促使设计者忠于这种风格的本质完成项目

反对者：有些装饰还是不错的

并非所有装饰都不好 在设计纯扁平项目的时候，它确实极大地限制了能够为你所用的技巧

结论

没有一种设计风格是完美的。为你的每个项目量身定制地设计，才能使得外观和所要传达信息的感觉风格相吻合 设计不仅仅是某样东西看起来如何。它也关乎易用性和功能。优秀的设计总是易用的 

VIA：http://select.yeeyan.org/view/418335/376376