人物 线条 形状 关于我：优设大课堂金牌讲师，高级原画师、插画师。多次参与国内外知名游戏项目； 擅长欧美 CG、Q 版卡通等多种绘画风格。想看我更多作品可以关注我的小红书@wuli_石头（明早5月16号10点会有直播），微博@wuli_石头。之前在小红书上分享了一套按《搞笑一家人》里面的罗文姬女士的形象绘制的人物的表情包，收到了很多朋友的转发点赞，看来大家都挺喜欢的这种风格的人物绘画。所以决定出一篇文章，给大家分享一下我绘制人物头像的 6 大步骤，同时会对相关的知识点和技巧做细致的讲解，希望对大家有所帮助。对人物外形的抽象概括传统的人物造型按头部、颈部、肩部、躯干的顺序依次构建，然后再根据透视做进一步刻画。这样画人物会与原照片非常的“像”，但同时也会没有特点，缺少趣味和神韵。我根据自己长期的绘画经验，总结出一套自己的人物造型方法，概括来说就是大胆抽象，夸张对比。大胆抽象，首先需要我们对绘画对象有一个细致的观察。要善于利用自己的直觉，抓住人物给我们的第一印象或者印象最深刻的点。发掘其所带有的一种情绪或者“势能”，然后用简单的形状概括出来。我们看下面 2 张示例，2 张图片虽然都是同一个人物，但是整体神态是不同的。上图中人物是站立的状态，我们可以观察人物头部与躯干的相对位置，是一个比较舒展挺拔的状态，有往上延展的趋势。结合人物色块在整个图形中所占比例（人物色块与背景色块的区别），我们可以选择用一个直立细长的三角形来概括人物整体外轮廓。在第二张图中，我们可以看到人物的头部与躯干重叠，缩着脖子耸肩。这样给人的整体感觉比较内收，像是被压缩了。所以我选择用一个四分之一圆的形式概括整体的外形。确定好主体外形轮廓之后，我们在草稿起形的时候就非常快了。同时我们可以将初步外形做进一步的夸张：将尖锐三角形的进一步拉长，四分之一圆进一步压扁，让形状所代表的气质更加明显。再多给大家展示几个人物轮廓的概括步骤，帮助大家理解：虽然图片上人物头部的轮廓是圆的，但是我选择变方为圆，将人物的脸部连同脖子夸张成一个长条形，肩部部分则横向展开为一个梯形。这样的宽窄对比就会让形状更有节奏感，显得有趣。直接按照图片绘制的话，整体外轮廓会呈现方形， 比较呆板。我们转换一下思路，当人物躺倒的时候，在二维平面上原来的比例都会被压缩，我们可以一个选择扁长的形状，更符合我们直觉中被压缩的感觉。小结绘画的第一步不是拿起画笔就照着图片画，而是要带着思考去观察，用直觉感受绘画对象整体“势”的特征，然后用最能体现这种特征的几何形状去概括。我们在这一步确定的几何形状会主导后面人物造型的方向和特点，影响到成图的整体状态。可能有些同学会觉得，这样夸张的概括有些失真了。但其实这就是夸张的的优势和魅力，只要做到足够夸张，那么就更比照片更能体现人物状态的精髓，也更加生动传神。头身比例及分形在确定好整体的人物外形后，下一步就是划分头身比例并分形。首先需要说明的是，头身比例的划分没有绝对值，看个人风格和习惯。确定好头身比之后，我们就可以进一步划分出第二个几何形。示例 ①第一步已经将人物外形概括为一个细长的三角形。确定好头身比之后，根据人物身体色块在图片中的占据的形状，第二个几何形就确定为一个半圆形。在半圆形之上就是我们头部的位置。我并没有严格依照头骨形状来画，而是按照片上人物皮肤的面积，将其概括成一个椭圆形。然后用线条找出头发的位置，草稿部分就基本完成了。示例 ②第一步我们已经将人物外形概括为压扁的四分之一圆。这里我没有将脸部概括为一个椭圆，而是一个倒三角。原因是，仔细观察人物我们会发现，她的眼睛是向上看的，结合整体看有一个斜向上的趋势。而倒三角形就能展现出这样的一种趋势，如果话概括成纯椭圆的话就没有什么特点了。大家可以再看看下面几张图，多感受一下分形的思路：第一步我们将整体概括为一个长方形加一个梯形，进一步分形时，我将左右头发概括成两个圆形，头顶的发量压缩，这样在外轮廓上就有一个明确的变化，更加有趣。我们已经将整体概括了一个扁平的形状。进一步分形时，按照图片中头部皮肤色块呈现的形状，在内部分出一个稍微扁一点的半圆。再简单概括一下头发和手部的形状。小结在确定好主体的几何形状后，第二步就是确定头身比例，然后做进一步的大方向分型。在对头部或者躯干进行分型时，不一定要按照很精准的人体比例去理解，但是要对色块、元素及他们之间的关系有一个准确的把握。基础透视原理与点对点的处理在前两步的分形阶段，我们用了非常感性的方法对于人物造型进行抽象概括。但想画成一张好看的图，光靠感性和直觉是完全不够的。在基本的分形确定好之后，我们的思维要转到理性的一面，运用基础的透视理论和点对点知识，帮助我们确定正确的五官位置和头身关系。① 纵向中心线人物的分形草稿已经完成，这个时候我们心中需要有几条线：脸部的中心线、脖子的中心线、躯干的中心线。这些都是纵向的线条，分别对应我们的头颅，颈部和身体。只有这三条纵线在垂直方向上是贯通的，我们画出的人才是形体才是正的，不会出现出现形态扭曲。② 横向位置线纵向线条标好之后，我们就能在此基础上进行横向线条的划分。确定眼睛、鼻子、嘴巴的大概位置和互相之间的距离。这是要注意由于透视变化，五官之间距离的变化。透视不对，五官看起来就很怪异。注意线条的倾斜角度和方向的问题。确定五官位置的时候，要仔细观察人物实际状态，线条呈现出对于倾斜的趋势。横向的线条确定好之后，我们就可以在标记好的位置上确定五官的位置了。人体转向角度的不同，中心线的对应位置也会发生变化，眼睛这种原本两侧对称的点位置也会发生偏移。这个时候就要运用「点对点」的方式，以纵向中心线为准，让身体左右两侧的元素保持在同一水平线，并且在透视上保持距离相等。表情绘制与五官分形仔细观察五官线条的走向，是塑造人物表情非常重要的点。准确的线条走向让五官的表现力更强，情绪传达更加饱满。上图中，人物表情是嫌弃、不耐烦。仔细观察五官的线条走向：嘴角下坠，眉毛往中间聚拢，眼睛是向右看。在画草图的时候，就可以把这几个点抓住，用带有方向性的线条标出来，情绪的基本调性就被确定下来了。这张图中，人物双手捂住耳朵，眼睛紧闭，眉毛皱在一起，整体非常抗拒的姿态。在草图中，我们要用线条表达出这些趋势，且这些线条都是往面部中心收缩。在基础的线条方向确定好之后，就可以进一步用简单的形状，对五官的进行分形。我这里还对人物的鼻子做了夸张的处理，做成了一个尖锐的三角形，以进一步凸显人物激烈的情绪状态。小结不同走向的五官线条，会表达出不一样的情感。在保证五官的整体位置是正确的前提下，暗示出这些重要的方向向性线条，就能为五官的刻画定向正确的基调，塑造最终的表情时就会更加准确。五官具体刻画与脸部轮廓确定了五官线条的大体走向，接下来就是五官的具体刻画了。这里给大家分享一个我长期以来使用的画五官的方法：直接眉毛连鼻子，再连人中和嘴巴。即除了眼睛之外，眉毛、鼻子嘴巴都是一根线。这样做的好处就是：确定好单边眉毛的位置，我们就通过「点对点」的方法，确定另一侧眉毛的位置，然后沿面部中线，画出鼻子、人中，嘴巴的形状，五官刻画速度非常快。第四步的时候，我们已经确定好五官线条的大致走向，这里就直接草稿的基础上进一步完善，勾勒出五官的具体形状。此外也可以加入一些睫毛、皱纹等个性化的特色。另外再说一下脸型设计的问题。第一步进行整体外形概括时，用的是一个简单的几何形状。但是在具体刻画时，我们也要更具人物实际状态来概括。比如上图中，人物年纪比较大，脸部的肌肉松弛下垂，那么我们在塑造脸部轮廓时，就需要把脸部的下半部分处理的更宽阔圆润一些，形成一个半圆，与左侧的直线和头部较窄的圆弧形成对比，这样形状轮廓的节奏感也更好。头发的绘制思路头部、躯干、五官都已经讲完了，接下来为大家讲解一下头发绘制的思路。画头发要注意到 2 方面的问题：透视和外形轮廓。透视方面，头部转向的不同，头发呈现的状态不一样。照片中人物的脸是向右转的，那么对于左边的头发整体呈现的就更多，右边的呈现的较少且头发会被遮挡。外轮廓是头部造型的重点，一定要有识别度。如果要表现卷发，那我们就用饱满的半圆形弧线去概括，比软绵绵的弧线来说表现力要强很多。另外就利用分组来归纳发型的表现。先根据照片，对头发进行分块的概括，块面的大小要有对比变化，这样才能体现蓬松饱满的感觉。总结经过以上 6 步，人物头像的线稿就完成了。整个人物头像的绘制思路非常清晰，技巧也并不复杂，在日常联系或者创作中多多运用，肯定会对大家的人物造型有帮助。今天的分享就是这些，喜欢的话可以点赞收藏，后续我会继续为大家分享更多欧美风格人物插画的知识技巧。同时也欢迎大家关注我的小红书@wuli_石头，上面有我的最新作品和日常创作思路分享。零基础也没事！大神教你 5 步画出好看的扁平风人物插画大家好我是花生。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/people-draw
图层 图案 形状 今天给大家带来一个3D立体效果无缝图案的制作教程。本教程原作者ｇｒａｎｔ Friedman，P大点S翻译。无缝模式对于丰富你的设计，是一个很有趣的、简单的方法。本教程，我们将向大家展示，如何使用PS，快速的制作一个3D立体几何形状的无缝图案。点击下载PSD源文件点击下载PAT图案新建个600X1000像素的文档，点击“视图—对齐”，启用对齐设置，执行“视图—显示—网格”，启用网格设置。现在，我们的画布看起来应该如下图：设置前景色为#e1e1e1，用矩形工具画一个正方形，绘制在大网格中的任意一个位置，定位在这一步并不那么重要，你可以随意摆放，当然前提是与网格对齐。选择“直接选择”工具，选择这个正方形右侧的两个锚点，并拖动它们，位置如下图所示：复制这个形状两次，并重新排列这两个形状，排列位置如下所示友情提示：请确保三个形状之间没有存在缝隙，你可以暂时隐藏网格看一下，因为，如果有缝隙，将会导致我们最终的图案出现缝隙，从而导致图案失败。选择住这三个形状，Ctrl+G，创建图层组，并将组命名为“左”。复制图层组左，重命名为右，并执行水平翻转，排列如下：将图层组右的颜色更改为#c2c2c2接下来，创建个新图层组，命名为“黑色”，复制图层组左和右中的顶部和中间图层，置于黑色图层组中，并移动一个大网格的位置，如下图：删除上图中所标示的锚点1和锚点2，我们得到如下效果：现在我们已经完成了基本形状的创建，接下来，我们所要创建的图案就是基于这个基本形状来完成的。我们现在所需要做的就是，花费一点点时间，复制和重排这个基本形状。新建一个图层组，我这里随便的命名为1，将所有的图层（图层组左、右、黑色）都置于图层组1中，并复制图层组1，排列，再复制，排列，排列得跟下图差不多就够了，因为我们只是想得到一个无缝图案而已，无需布满整个画布。选择“裁剪工具”，请确保禁用“删除裁剪像素”选项。观察图像的排列规律，找出如下图中的这个图案。裁剪，并自定义为图案预设。搞定，随便建个大一点的文件，检验下我们的成果。调整下色相/饱和度，我们可以得到不同颜色的图案：或者尝试下其他模式，你会得到一些很有趣的效果。到这里就算完事了，本文只是为大家提供一个思路，仅思路而已，并无太多的技术含量，希望大家能从本文中得到一些启发，我们想看看大家，都会做出些什么图案来，我们很期待！
光影 形状 人物 前言：扁平风格当中，除了写实人物，最重要的一个环节，就是“抽象简化”人物。这在扁平插画研习社的课程里我也讲过：简化与抽象是扁平化的重心所在。目前很多看起来之所以不那么抽象的插画，如果非要说是扁平插画，最多只能说是和写实风格做了融合而已。而这次我们的案例就是一个抽象分量比较重的人物，大家可以在操作过程中去感受抽象的精髓，注意简单几何的本体和变体表达。此外，还有光影的层阶安排，需要对明暗保持有效把握。灵感来源这副插画的灵感是来自一张摄影，但是并没有保存，只是一闪而过。后面就想将摄影转为抽象人物的风格。AI布置基础形过于抽象化的人物其实一般来说可以省略草图部分，重要的还是从简单几何开始，慢慢探索形状组合的可能性。因此在这里我们直接从AI绘制基础形开始。STEP 01打开AI，新建一个10cm*10cm的文档，颜色模式为CMYK，光栅效果选择300ppi.这里没错，我们将要做一个可以印刷的版本。在画布上画下一个圆角矩形，这就是人物的头部，然后继续画出3个矩形，将一端变为圆角，类似下图。将这些形状拼缀起来。分别填充的颜色色值参考如下：STEP 02你可以把上一步所画的形状看作原材料，接下就是对这些原材料的组装，这时差不多画好人物的头部、颈部以及两只上手臂。思路解析：请大家在组装这一步，深刻感受所谓的“差之毫厘，谬以千里”，细节的微妙差异，都会造成最终观感的完全不同，位置需要谨慎对待。由于我们接下的光影绘制都是建立在基础形之上，所以基础形的位置、形状、大小就至关重要。STEP 03先给左边手臂的底部增加腋窝的部分，利用圆形补充相同色彩的形状。再利用钢笔工具画出人物的身体，先画出由“棱”边角描出人物上身，再将棱角转为有弧度的圆角。色彩填充蓝色。STEP 04再用钢笔工具画出头发，头发的部分可以自由表现，线条流畅，造型合理即可。色彩填充为黄色。这里的头发可以分为三个部分，一个是大的头发主体，还有一个是刘海，一个是零散的发束。我们可以先画主体，再增加刘海和发束部分。STEP 05局部进行调整，将肩部以下部位的形状都往下移动，让肩部下沉。同时，增加右边手臂的下手臂，可以直接复制上手臂的形状略加以旋转。填充不同的肉粉色。再补充腰部的形状。STEP 06给人物增加胸部的线条，利用圆形直接增加。再继续画出人物的短裤部分。下半身的画法和上半身一样，臀部短裤的部分采用钢笔先画出棱角，再转为圆角弧形。STEP 07接下绘制人物的腿部，腿部分为两个部分，由于我们设计的人物为跪姿，所以大腿和小腿为上下重叠，这里为了提高形体表现力，可以把小腿部分表现成大腿的一半。STEP 08小腿末端连接的形状是鞋袜的部分，袜子为白色，鞋子设计为深灰色。这里注意鞋子和袜子的形状，仍然是利用钢笔工具起形。到这一步为止，基础形就完成了。接下开始进一步添加细节。添加零碎的细节STEP 09开始给人物绘制五官，抽象人物的五官依然要延续抽象这一风格内涵。将五官绘制好后，放置于人物脸部，注意人物的脸部稍微有些抬起，因此不同于正面视角，五官的位置需要稍微往上。STEP 10继续为下半身的鞋袜和短裤绘制细节。思路解析：细节的添加可以是自由发挥，比如给短裤增加卷边，那么这些设计都是临时突然想到的，还有包括短裤上的心形图案，你也可以替换为其他的样式，比如格子或者条纹，或者给短裤设计花边。在符合形式美的基础上可以任意发挥。这里开始我不再给出具体的颜色色值，因为细节的设定还没有增加光影，等到光影增加完毕，还需要根据整体做调整。因此细枝末节的设定就不需要完全和案例一致。为人物增加光影思路解析：光影在这副插画的风格中占比很重，插画最终的效果都是靠光影来表现。这部分在我们的扁平插画研习社课程当中讲到素描三大面和五大调，对应到插画中就可以转换为光影的三个层次：本色、高光、阴影。这三个层次在大部分形状上都要有所描绘。其中高光的色彩明度最高，而阴影的明度最低。STEP 11我们依然从脸部细节开始，描绘出光影的层次，让人物的面部更加立体。STEP 12再为脸部以及颈部增加光影关系，这里设计左上为光源发射点，因此左边受光较多，慢慢逐阶过渡到右下的阴影。这里所画光影的方法是复制基础形来相加或相减，利用形状生成器工具即可立即生成所需的形状，不需要的部分就此删除。如果不熟悉形状生成器的用法，下面这个视频也许能帮到大家：点击这里看视频STEP 13增加手臂的光影时，一定要把手臂看作一个圆柱体，心里要有立体的概念，然后再表现为扁平风格。STEP 14身体的光影在这里是一个难点，特别是胸部的阴影和后背阴影的连接，在连接部位要处理得圆润。受光部分形状也要用钢笔工具画得平滑自然，这需要多花时间处理。特别要注意是腰部露出的皮肤部分的光影，也要按照上衣的光影安排。STEP 15短裤的光影要注意一点：短裤如果是布面材质，所以不会反射出高光。所以大部分受光都是受光的单色形状。STEP 16腿部的光影可以多一些层次，大腿和小腿由于是上下相叠，所以小腿的受光肯定不如大腿的部分。STEP 17鞋袜可以多增加细节，而细节也需要考虑光影表现，这时简便的做法就是利用一整块黑色的形状整个将鞋袜的形状笼罩，然后降低透明度的方式，就能让细节也能进入光影表现。STEP 18思路解析：最后我们来绘制头发的光影，头发的光影也同样是个难点，难点在于初学阶段对头发的概念会停留在“头发是一缕一缕的”。其实大家可以把头发看成是一个固体，和其他固体没有什么区别，也一样会有光影，起伏的表面，受光的部分就是受光面，背向光线的一面是背光面，也就是阴影。这样就很容易去理解并描绘准确。到此，我们的光影就基本绘制完成，但是整体还需要进一步优化。「背景-前景」视角我们要学会从背景去看前景，才能得出更精准的色彩表达。因为背景对前景会有一定的影响，同样的颜色，在白色背景和有色背景下都会呈现出不同的表现，尽管大部分时候这种不同是很微妙的。STEP 19绘制一个大的圆环，给这个圆环填充为#FDDDA1。STEP 20在增加了背景的基础上，继续增加光影，首先为头发绘制出白色的高光区域。全局细节STEP 21根据全局出发，最后为人物再增加装饰：项链和手镯。这部分大家可以自由发挥，还可以装饰细节有很多，比如人物的纹身或者其他小装饰物。STEP 22增加白色透明的小圆点，将小圆点散放在受光的部分，这样会增加人物的亮色。再根据背景将小圆点和背景圆环做一些互动装饰。最终完成效果：结尾：不是万能的纹理很多小伙伴在画插画时，尤其利用矢量工具画出的插画，看起来太过平淡，也是由于没有安排好光影以及形状。所以这时所能想到的补救措施就是增加颗粒纹理。虽说增加纹理的确有增加画面质感的作用，但是我一直强调过，纹理，只是一种锦上添花，如果没有优秀的形状，纹理的作用很微小。类似这个案例的插画其实已经利用小圆点强化了画面，就不需要纹理再进一步铺满画面。我们就到这一步为止，接下如果可以，拿到PS里再进一步调色即可。这个案例的难点是在身体以及头发的部分，而能够自由发挥的部分是装饰以及鞋袜的部分。如果原创攻坚，难点是怎样换种形状去表达相同的内容。这是原创训练需要抓住的玩法。如果还没形成这一原创训练思维的小伙伴，不妨经过每一次的临摹学习来逐步进阶~希望大家都能抓住青春的小尾巴，继续成长~原文链接：ifeiwu
猫咪 插画 形状 前言插画作为Banner元素之一，只要学会创作小场景，利用场景元素，就能制作出自己原创的插画Banner。下面这篇文章重点就通过创作一只小猫咪出发，用小猫咪作为素材设计一张插画风格的Banner。灵感素材对于无法原创插画的小伙伴，还是需要参考照片来作为创作起点。我们今天用的照片是我从摄图网上看到的，刚好被小猫咪可爱的动作所吸引。（很像招财猫的动作~）从照片中提取草图STEP 01提取草图，也就是明确猫咪的身体结构，造型可写实可抽象，但是写实永远是个起点。所以写实的过程就可以在草图中进行。利用照片勾勒也好，还是根据照片参考自己画出结构也好。都是一个不错的开始。从上图可以看出，猫咪的结构轮廓线有了，这部分在我们的扁平插画研习社课程中也和大家详细讲过，从骨骼开始抽取最基本的线条，这部分为接下描绘大形打下了坚固的基础，如果骨骼出了问题，轮廓线就很难纠正最初的结构，导致形体出问题的也是这一最初环节。外轮廓并不一定完全按照猫咪的外形来勾勒了，部分细节可以修改。第一层！整体大轮廓猫咪的大轮廓是造型的起点，先画出一整个剪影形状，为细节打下基础。STEP 02打开AI，开始在AI中描形，文档可设为1600*1600px，色彩模式可以设置为CMYK。有了草图的辅助，就知道应该安排什么形状最好。但这时由于是偏抽象的风格，因此猫咪的外形需要进一步改造，简化。先为整个文档铺设背景形状，运用矩形工具绘制一个1600*1600px，作为背景，先设置背景的目的是建立起整个色彩氛围，让前景色跟随背景色来设计。背景色为#F08654。并利用钢笔工具画出猫咪的头部，注意猫咪的脸可以宽一点、肥一点，这样会看起来更可爱。STEP 03接下画出身体的部分，猫咪的四只小猫爪可以夸大一点。将四只猫爪安放在合适的位置。这样整个身体就拼装好了。注意每只猫爪都是用矩形的变体，这样能让猫咪看起来有种简洁的抽象感，和写实的猫咪能拉开风格距离。再铺一层！给猫咪更多细节第二个层次，应该是猫咪更多细节：面部、毛色之类，让猫咪看起来可辨认。STEP 04先画出可爱的猫脸五官：眼睛、鼻子、嘴、胡须……等。这部分创作时需要注意形状之间的间隔和位置。五官的位置非常重要，稍不小心，就会让面部看上去不自然。猫咪的小腮红可以用降低透明度的方法，叠成在其他色彩上方。STEP 05再增加猫咪的毛色，给纯白的身体增加不一样的色彩。依然从头部开始，给两只耳朵和额头部分增加粉色的形状，这里的形状可以通过钢笔工具来画。画好的形状如果超出了猫咪的大轮廓，就利用形状生成器剪掉。STEP 06给猫咪一个装饰上的细节，这个细节在照片里没有，这些小创意都来源于生活。从生活寻找创意素材~不止于小铃铛，还有其他可以想到的宠物用品，都可以帮助美化猫咪。小铃铛的色彩用了两个互补色，让这部分看起来更鲜明。蓝色能起到平衡画面整体冷暖调的作用。STEP 07让小爪子也增加上细节，利用两端为圆角的竖线条做出指缝，让小爪子鲜活起来。色彩依然采用肉粉色。和毛色在整体上保持统一。STEP 08再利用比较小圆角矩形作为元素，重复该元素，就形成了装饰图案，装点猫咪的身体，模拟类似猫咪的毛色质感。这是在AI中利用简单的小元素模拟质感的常用技法。色彩仍然是为毛色的肉粉色。STEP 10最后给猫咪增加一条小尾巴，尾巴的画法可以先利用线条做出弧形，再通过【扩展外观】，转为形状。上光影！让它更生动光影是能够加深立体感的，但是扁平化中的立体感和平时我们所理解的立体感还是有差别。有一次，我在微博上写过说自己的想要给画面增加立体感，有提议说可以做3D效果。我立刻知道对方误解了我的意思。因为我所谓的一种立体感是一种心理结构，而不是真要对象看起来立体。可能把这个立体感换成鲜活、生动更合适。因为扁平化是在试图抹平三维，而不是再现三维，所以增加立体效果，就要从形色上去入手。STEP 11画阴影，还是要先确定光源点，如果光源从左上方打过来，那么阴影就会主要出现在猫咪身体的右侧。当然，并不是绝对的，比如猫咪的爪子挡住腹部的部分也会有大面积阴影的表现。这部分除了写实，更要遵循形式美的原则。我在光影的绘制是不会参考摄影图的，这就需要把握好光影的基本法则。STEP 12小铃铛的光影部分也不要忘记，给小铃铛增加阴影和高光。让喵去户外！植物画起来表现户外的场景，最多用的元素大概就是植物了。STEP 13首先画大片的叶子，我们可以菱形来转为叶片造型，再利用左右两边色彩的明暗对比来表现最简单纯粹的光影关系。STEP 14植物的叶片位置关系，通过再复制叶片形状并旋转的方式，可以多放置一个大叶片在主体对象的后面做背景，让画面有“景”的观感。色彩因角度的不同产生非常微妙的变化~STEP 15最后增加串装的叶片，这类植物能有一种零碎的感觉，会冲淡大片叶子的整块感。到这一步初步的形色就完成了。在背景下为猫咪和植物都增加一个简化的投影。玩颗粒笔刷，增加质感颗粒笔刷是我最喜欢的一种PS笔刷，默认的笔刷里没有，这是我自制的一款颗粒笔刷的方法：http://www.ifeiwu.com/blog-detail/1523.html增加颗粒感是一个可选项，如果有时间，可以多刷几笔，让AI中的平涂形状色彩看起来更饱满，也更多视觉趣味。这也是我最喜欢的part。STEP 16打开PS，新建一个2000*2000px的文档，色彩模式cmyk，分辨率300ppi。首先还是把招财猫复制进入PS，这里需要把背景色分开两个图层，方便我们通过剪切蒙板实现涂色效果。这时开始运用我们自制的颗粒感画笔给猫咪脸部增加颗粒感细节，在猫咪的图层上新建一个图层，再创建剪切蒙板，画笔就在新建的图层上开始画。STEP 17接下开始画身体，有些地方可以学会运用钢笔工具来画出部分区域，让形状看起来有更丰富的层次。STEP 18开始增加植物环境部分的颗粒，在植物边缘部分增加少量颗粒即可。小的叶片可以多增加一点。STEP 19最后再利用调色工具调整一下整体的颜色。一般来说质感这部分是可选项，有时候你想要简洁轻盈，就可以省略这个步骤。效果对比：Banner设计STEP 20将招财喵放在右方，给左方文字以空间，顺便在左边也增加同样的植物元素，算是呼应右边的插画。最后，创作思路再捋一捋从一张照片提取猫咪对象，从草图开始再转为插画，给照片对象增加环境元素（植物等），然后放进Banner设计里，并跟随插画继续润色Banner~生活就是最好的创作来源，当你感觉原创乏力时，跟着这篇文章来，快给你家家猫也来一张可爱的小插画吧，把它用在你的下一次的设计里。原文：ifeiwu
物体 形状 视觉 2.5D插画在商业设计风格中一直名列前茅，并且受到客户和设计师的广泛欢迎。为什么呢？这有三个原因：A.在2.5D插画中，我们可以使用全系列的图形解决方案进行说明，使其在视觉上独一无二。这对于为特定品牌的需求而创建的图形非常重要。 B.您在单个场景中传达复杂或者比较细腻的信息时，2.5D插画比平面插画更有信息性。C.由于2.5d属于单一透视。所以这对于绘画基础相对比较薄弱的设计师，会相对更容易一些。不过在初次尝试2.5D的时候也会相对比较困难。因为网上关于这个话题的教程比较少，理论性的文章偏多。 所以这两年来，我们一直在教人们矢量图形，等距和商业插画。在本文中，我想与您分享使用等距插图的最有效工具，并分析如何使插图更好。那么，让我们开始吧！一. 2.5D设计方法首先要做的是永远忘记SSR方法。要在Adobe Illustrator中使用等距，我们使用引导线和内置3D功能，例如Extrude和Bevel，Rotate和Revolve。我们分别检查了每个工具。首先从线段开始，我们最初以30度（或330度）的角度放置。我只有在三种情况下使用等距测量法：1）当物体具有简单矩形的形状时，眼前物体的尺寸和比例;2）当需要完成体积图的“平面”时；3）对齐沿直线延申的相同长度的物体；当您需要将复杂形状转换为等轴测视图时，旋转是最理想的。我需要在前面提到的旋转功能的帮助下增加我们转向等轴测视图的形状厚度时使用挤压和斜角功能。当您需要绘制使用以前的工具很难创建的旋转形状时，旋转功能是不可或缺的方式。使用旋转工具时，我们按轮廓绘制对象的一半，然后旋转它。使用这些工具，您可以在等轴测投影中构建复杂的形状，这些形状在SSR的帮助下无法构建。二.光学补偿等距是一种角度，其中形状的三个边是可见的，所有直线彼此平行并且没有透视缩短。缺乏透视力迫使我们在使用等距时使用一些技巧。我们来看看例子：A.中心元素左边的图片显示，由于缩短，中心暗矩形（A）左侧的距离大于右侧（B）的距离。同时，它在几何和视觉上都处于中心位置。但是，在等轴测图中，内部对象必须向右移动，以便在视觉上看中心。问题是我们的愿景不允许我们在等轴测视图中看到事物。这就是为什么几何中心并不总是在视觉（或光学）的位置主页按钮和手机的摄像头向右移动，以便在视觉上看中心为了弥补透视的不足，我们必须将内部物体略微向右移动。我们无法确定究竟有多远，因为它取决于它的大小。你只能通过眼睛告诉它。B.物体的大小等长线中缺少缩短也会导致相同尺寸的物体彼此距离相当远的物体出现一些问题。在透视图中，我们可以很容易地确定哪个物体更近，哪个更远。但是，这不适用于等轴测图。这可以在汽车的车轮中最清楚地看到。如果我们绘制相同尺寸的近轮和远轮，则视觉上看起来像后轮更大这就是为什么为了在视觉上创造相同的轮子，我们应该将后轮稍微缩小（例如B）。如果我们使它们的尺寸更加明显（例如C），那将会更好。C.视觉静态左 - 看起来不自然；右 - 看起来更逼真由于在等轴测图中所有线条彼此平行，因此插图看起来不自然。通过添加以不同角度放置的对象可以很容易地解决该问题。 笔记本电脑的例子清楚地证明了这一点。直线是2.5D比较不常用，可以稍微有些角度（与那些推广SSR方法的人一样）。III.做有风格的样式化设计左边 - 比较死板，不够自然，右边 - Good job在等轴测视图中，我们看到一个物体的三个边。如果我们不使用等距测量方法，我们就不会得到漂亮的2D插图，3D效果也显得不伦不类。请务必在插图中使用如下流行的方法：负空间，形状线条，纹理和对比阴影。如果可以的话，尽量避免各种色调的原色。使用这些技术不仅可以显着增加您的工作效率，还可以使您的插图更专业。看看成果： 原文地址：https://medium.muz.li/how-to-make-great-isometric-illustrations-by-the-simplest-way-b3dab0cdf47b
人物 线条 形状 扁平插画中人物的风格可以是非常多样化的，没有标准答案。所以，在绘制人物的时候，对于身体比例的控制就没有太严格。和正常比例的人物绘制来说，大尺度的夸张人物身体，关注点就应放在色彩和形状的表现上，找寻形色之间巧妙的平衡。在今天的文章中，主要分享扁平化插画的形色平衡的训练为重点，演示创作夸张风格人物的过程。效果图：使用工具：Adboe illustrator (2019)一、草图：生成作品也许只需要30秒我一再强调过草图的重要性，草图不需要画得多好，它是一个想法的探索过程。在我们今天绘制的人物，我希望给人物一个看起来比较像是在舞蹈的动作，这样的画面会看起来更有活力。这是我的草图，看上去很凌乱，不过大家可以看到我在这里的思考脉络。画这个草图用不到十五秒，但是它瞬间捕捉到了我脑海中想要人物呈现的样子，以及可能想要给人物增加了一些场景元素。我也在扁平插画研习社当中和大家提到过，每天不一定能有时间完成一幅练习作品，但是一定可以拿1分钟时间来完成一幅完全原创、天马行空的涂鸦。二、线 Or 非线人物形态确定以后，接下就需要进一步了解到：你需要运用哪种更为细化的笔触来表现插画？扁平插画最基本的划分，其中一个是线性或者是非线性。所谓线性就是要利用线条来对轮廓线或者边线进行处理，而非线性只是采用形状。它们之间的区别除了线条的存在与否以外，线性更需要加强线条本身的表现力，所以对线条的形态本身也需要格外关注。STEP 01首先打开AI，新建文档，文档大小可以设置为1200*1200，分辨率72，色彩模式RGB。先从线条开始起步，设定好线条的大小为3px，绘制出一个圆角矩形。圆角矩形的角度圆弧可以放到最大，呈现一个胶囊形。这也是人物的头部的绘制。描边的形态也要注意一下统一规格，详见下图：三、绘制身体的大形上一部绘制好了头部，接下就可以开始绘制颈部以及身体的其他部分，这时候可以不用绘制细节的部分。重点是要抓住身体的比例以及大型的轮廓。虽说我们绘制的是夸张比例的人物，但是比例仍然是我们绘制的关注点。STEP 02脖子的处理方式很像画一条管子。这里我们采用钢笔工具绘制直线条的方法，然后再将直角变圆角。这是扁平插画中常用的绘制弧形的方式，除非你能很精准的控制钢笔工具的贝塞尔曲线。STEP 03接下处理的身体的部分，首先要画的是领口和肩臂的部分，这两部分其实无法分割，而是作为一个整体来绘制的。这时我们还要确定的是领口的样式，领口究竟有什么样式决定了衣服的样式，一般我们常见的领口样式就是一个圆领和一个V领，所以在这里，我们选择用圆领。要画圆领很简单的方法是用钢笔工具，但是初学者不一定能把这个圆弧画得很精准，这时我们可以借助圆角矩形本身来画。然后利用形状生成器工具（在左侧工具栏中找到），在按住键盘ALT键的同时，对路径进行删减。STEP 04接下绘制肩部和身体，注意跟随草图的思路，同时需要注意线条的表现，弧线要处理到平滑均匀。从下图的右侧可以看出，扁平插画中我们是如何运用几何块状来构型的。STEP 05接下完成另一只手臂，但暂时不绘制手的部分。另外一只手臂也是需要表现出几何形的感觉。STEP 06最后完成腿部的绘制，手和脚的部分留起来单独画，这是为了让我们的身体大形全部建立起来，从而获得人物动作的全貌，以便我们从大体上进行调整。提示：如果我们在草图阶段画好了人物，也许觉得很满意的作品，放到软件里画出来未必就是同样的感觉，这时就需要继续调整。四、手脚细节整个人物的身体都是用大的形状所组成的，相对欠缺细节。那么手部和脚部（鞋子）就需要比较细节的刻画，这样就能让细节也富有感染力。STEP 07绘制手部的时候，注意手指的线条要分布均匀，关系适当，手指的长短要表现出错落有致。STEP 08脚部的细节主要就是要描绘出脚踝，以及鞋子的部分。鞋子的样式可以自由发挥，照顾到整体的审美感即可。注意右边的鞋子，由于脚后跟的位置略往上抬起，因此鞋子的外观和左边就略有差别。五、增加细节化处理大形绘制完，整个人物就完成了，接下继续增加线条，从细节上继续丰富人物的表现力。STEP 09从头部的细节开始增加，为人物增加眼睛和头巾。头巾的部分可以稍作夸张。STEP 10对人物的服饰增加装饰性的线条细节。STEP 11继续增加鞋子部分的细节，这里的线条可以稍作更为复杂的刻画。STEP 12这里接下我们将直线替换为波浪线，比如人物的右边的裤腿，就可以采用这类方式来增加人物的律动感。首先绘制出一条直线，这条直线不要太短，接下在选中直线的基础上，进入到【效果>扭曲和变换>波纹效果】，进入波纹效果的设置面板，然后根据下图中的参数进行设置。这时直线变为了波浪曲线。STEP 13删掉人物右边的裤腿那条直线，然后将做好的曲线进行扩展外观，扩展外观后，这条波浪曲线就变为了曲线的路径，然后将这条路径放置在合适的位置上，注意首尾和原有图形的对接。六、装饰线的细节所谓装饰，就是看似和人物不相干，但又能帮助烘托氛围，增加丰富感的线条、圆圈等图案。这些图案的排布应该是灵活的，但又不失视觉的韵律感。每个小装饰的画法都非常简单，装饰就像一种调味料，因此要把握好整体的比例。STEP 14增加线条作为主装饰，它们的方向最好保持一致，和人物的腿部线条有方向上的共鸣。STEP 15继续丰富装饰的细节，增加几何形、虚线、圆点、斜线……等等。这无疑就是多种调味来增加视觉的丰富和动态。然后线条的部分我们就完成了。接下我的习惯做法是，先把所有的图形全部建立一个组，然后复制一个，当作备份。对新的复制出的线条进行扩展外观。由于有了备份，即使最后发现线条有什么不对，也能重新把原始的线条调出来进行修改。因为在AI中如果已经扩展了外观的线条就已经不再好继续改动了。七、填色填色前先将所有的线条进行扩展，扩展后再将所有的线条（现在已经是黑色的形状了）进行合并。STEP 16利用形状生成器工具，选中刚刚我们扩展后的所有的黑色线条，然后通过鼠标单击的方式来生成内部的形状，从而可以对内部形状进行填色处理。这时我们选用蓝色作为主色来填充人物衣服的部分。STEP 17然后再填充人物的皮肤的颜色。STEP 18运用一个饱和度更高的蓝色，和之前所运用的蓝色相比，它运用的面积比较小，让这块颜色具有视觉的凝聚力。STEP 19最后把主色调的蓝色分别运用在其他的形状上。然后再把人物的裤子的形状填充黑色。黑色和蓝色的运用，会让色彩整体有种力量感。而黑色裤子的部分就和其他地方用线包围的感觉形成了对比，视觉上会具有更多层次。STEP 20将装饰形状的色彩也进行部分填充，色彩可以运用蓝绿来补充画面中色彩的单调。然后选用接近白色的蓝色（不一定非要是纯白）来给目前仍然处于空白状态的形状以白色。这样整个画面的填色就完成了。STEP 21主色为蓝色，这就让画面看起来比较冷，那么为了中和这种冷调，那就需要增加一个暖色。这里我们为人物增加一个背景装饰数字01，让这个数字的色彩表现为黄色。STEP 22最后一步，为了让画面看起来更灵动，我们给人物的衣服增加白色英文字母。最终效果如下：八、插画应用最终应用在UI设计的界面中的效果：九、后记：扁平（FLAT）的魅力FLAT不是朴素，只是学会克制的表达。比起纯快乐式的张扬艺术相比，扁平看起来比较冷静，这也赋予了它在商业应用上的实用性。在学习扁平插画的时候，学会脱离原有物体的形态，练习夸张的人物是最有效的方式。由于重点从人物形态转移到了形色的造型组合，因此，直达视觉传达的本质。来源：ifeiwu
步骤 形状 将其 用AI绘制质插画（笔刷制作）在开始绘制前，我们还是老规矩，创建四个图层文件夹来管理我们的图层！1. 如何创建背景一旦我们完成了文档的分层，就可以开始绘制实际的插画了，我们将通过创建背景来执行此操作。因此，请确保您已定位在第一个图层文件夹了，让我们直接进入它把！步骤 1.1使用钢笔工具 （P），在将填充颜色设置为#7AC6F4后，使用参考图像作为主参考，仔细绘制底部背景的主形状。步骤 1.2再选择笔工具 （P），快速绘制较小的背景图形，而位置大小等可以参考下图。步骤 1.3绘制完背景后，我们可以开始处理前景的云，我们将使用一些大小不同的圆创建前景的云。将它们放置在底部形状的两侧，使用#F0FBFF着色前面的云，使用#D4F7FF着色后面的云。步骤 1.4由于我们希望云是藏在背景里面的，所以我们要对云（Ctrl-G） 进行打组，然后使用要粘贴在前面（Ctrl-F）快捷方式把背景复制一份。然后，选择复制的背景和打组的云后，只需右键单击”创建剪切蒙版”即可。完成后，不要忘记使用 Ctrl-G 键盘快捷键来把所有的形状打组。步骤 1.5移动到较小的背景上，然后使用 112 x 112 px 的圆 （#FFCF83） 创建发光光晕，然后再创建两个较小的圆 （#FFCF83），每个比上次小 12 px，从而开始处理太阳。将它们堆叠在一起，确保将其不透明度降低到 16%。完成后，使用 40 x 40 px 的圆圈（#FFCF83）添加实际太阳，确保使用 Ctrl-G 键盘快捷键选择所有四个形状并将其打组在一起。步骤 1.6完成创建太阳后，用上面云一样的处理方式处理太阳即可。步骤 1.7通过创建三个不同形状的椭圆（#FFFFFF）来绘制较小的浮动云。使它们重叠 ，然后首先使用锚点工具 （Shift-C）挤压其侧锚点来调整它们。若想继续调整其形状，使用直接选择工具 （A） 单独选择其较低的锚点就行，然后把不要的部分删除，但是记得要封闭路劲哦，锚点不好使，请用路径查找器来绘制把！最后请记得打组哦！步骤 1.8位置的话可以参考下图，然后我们就做好了本次插画的背景了。2. 如何创建热气球现在，我们已经完成了背景工作，我们可以锁定它的图层，然后移动到下一个图层文件夹，我们将花一些时间来创建我们的热气球。步骤 2.1首先，使用 48 x 12px 的矩形为吊舱创建主形状，我们将使用#664240进行着色，然后在较大的背景上放置它，距离其左边缘 288 px，距顶部 208 px。步骤 2.2通过打开”变换”面板，调整我们刚刚创建的形状，然后将其底部的角的半径从矩形属性内设置为8px。步骤 2.3使用8个 2 x 2 px的矩形（#F7C263） 水平间隔 2 px 来作为窗户，我们将对窗户进行打组（Ctrl-G），然后放置的位置可以参考图像中所示。步骤 2.4通过创建 400 x 112 px 椭圆我们开始处理气球部分，我们将使用#F99178进行着色，然后放置在吊厢顶部，使其最终重叠。步骤 2.5使用移动工具（右键单击 – 变换- 移动 -水平- -32 px），调整我们刚刚创建的形状，将其中心锚点向左推 32 px（右键单击 – 变换-移动 – 水平- -32 px），然后将右锚点的控点缩短 15 px，以便将其尾巴变薄变尖。步骤 2.6通过复制结果形状（Ctrl-C + Ctrl-F），添加气球底部较暗的部分，我们将通过选择并删除其顶部锚点来调整该部分。使用#C15142为新形状着色。步骤 2.7使用较大气球作为第二个副本（Ctrl-C）来作为高光部分，我们将将其粘贴在前面（Ctrl-F）。将其颜色更改为#EA7B65，然后单独选择并将其顶部和底部锚点推到内部，大约16 px左右（右键单击 变换里面可以用数值控制，具体取决于您从哪个锚点开始，反方向就用负数）。步骤 2.8使用得到结果形状复制（Ctrl-C + Ctrl-F）出来创建较暗的下半部分，我们将通过首先将其颜色更改为#D86552，然后移除其顶部锚点，然后使用 Ctrl-J 键盘快捷键关闭路径来进行调整。完成后，请确保在继续执行下一步之前，选择它并打组（Ctrl-G）气球的所有合成形状。步骤 2.9使用 8 x 112 px 的矩形来添加气球的嘴巴，我们将使用#664240进行着色，然后居中对齐到气球的左边缘，随后使用较大的基础形状的副本（Ctrl-C + Ctrl-F）将其屏蔽（右键单击 + 制作剪切蒙版）。步骤 2.10使用 12 x 4px 矩形 （#664240） 创建鼻锥，我们将通过使用方向键单独选择它然后将左锚点推到内侧大约1px 来进行调整，然后让它与较大的气球重叠 2Px。步骤 2.11使用 40 x 32 px 矩形 （#D86552） 添加机翼的主形状，我们将通过调整左上角的半径为32px来改变形状。具体数值看图把！步骤 2.12使用 8 x 32 px 矩形 （#664240）来作为较暗的部分，我们将使用基础形状的副本进行剪切蒙版，然后使用8 x 8px的圆圈（#664240）装饰它，我们将其放置再如图所示的位置。完成后，请确保在继续执行下一步之前，选择并打组（Ctrl-G） 所有形状。步骤 2.13使用我们刚刚完成的图形然后创建副本（Ctrl-C + Ctrl-F）添加到底部，我们将水平翻转它，然后放置于气球的底部。完成后，请确保将它们发送到所有其他形状下方。步骤 2.14使用40 x 8px 椭圆 （#664240）创建面对我们的机翼，我们将通过选择并将其锚点向左推 4 px 来进行调整，将得到形状从气球的末端前挪动16px。步骤 2.15使用四组每组3个 4 x 2 px 的椭圆（#664240）添加细节，请参考下图来放置这些圆把！步骤 2.16使用12 x 8px 椭圆 （#664240）添加侧引擎盖，我们将通过选择内部锚点向左推 2 px 来调整。按参考图像所示放置生成的形状。完成后，你就把这些东西打组。步骤 2.17一旦我们完成了对热气球的绘制工作，我们可以使用三个1 px 圆角矩形 （#FFFFFF） 来表现热气球速度感或者是尾气把，我们将在飞船周围以 8 px 的距离放置这些矩形。步骤 2.18通过添加几个浮动的云（#FFFFFF）来完成最终的插画，遵循用于创建背景云相同方法。完成后，不要忘记使用 Ctrl-G 键盘快捷键选择和打组所有形状。3. 如何创建渐变叠加在我们锁定当前图层并移动到下一个图层之前（这将是第三个图层），我们需要将背景的两个组和热气球的主体创建新的副本 （Ctrl-C） 并且添加到剪贴板中，因为我们将使用它们来创建叠加。步骤 3.1首先，我们希望使用 Ctrl-F 键盘快捷方式将刚刚添加到剪贴板的副本粘贴到当前图层上。步骤 3.2接下来，我们需要通过将形状转换为复合形状来使形状是单个较大的形状。首先选择它们，然后打开路径查找器面板，然后在高级菜单里面找到并点击”制作复合形状”。步骤 3.3创建复合形状后，我们可以打开渐变面板，并使用左#662D91右#FBB03B来创建线性渐变。步骤 3.4我们现在打开不透明度面板，并将渐变的混合模式设置为”颜色加深”，确保将其不透明度降低到仅为30%。4. 如何添加纹理添加渐变叠加后，我们可以锁定当前图层，然后向上移动到最后一个图层（这将是第四个图层），我们将通过添加漂亮的杂质来完成我们的小插画。步骤 4.1我们首先需要复制 （Ctrl-C），然后粘贴 （Ctrl-V） 自定义纹理到当前图层，确保调整其大小，使其最终覆盖整个画板。步骤 4.2一旦我们的纹理到位，我们要做的就是剪切它（右键点击 + 使剪切蒙版）怎么操作前面也讲了很多此，不再重复了，然后确保将其不透明度降低到 60% 。原文地址：youku作者：Andrew Stefan译文地址：UI中国译者：米夏小雨
步骤 工具 形状 欢迎来到如何在 Adobe Illustrator 中绘制等距人物插画教程!在本教程中, 您将学习如何在不使用等距网格的情况下绘制等距矢量插画的分步过程。什么是等距艺术？这一技术非常受欢迎，因为它允许插图在全尺寸范围内传达所有三个维度，而不是将它们缩短。 等距透视是指将30度角应用于对象的侧面。使用等轴测立方体(如下图所示)可以最好地说明这一点。您可以在Illustrator中使用等距网格创建等距图形(如下图所示)。这将帮助您根据网格创建等距形状。这是今天要绘制的人物插画(如下图所示)。1. 创建人物的头部步骤1选择椭圆工具 (L) 并创建一个圆。按住键盘上的 Shift 键, 同时用鼠标单击和拖动, 以创建一个完美的正圆。对于肤色, 我们将使用下面的设置, 但您可以自由地为您的项目选择自己喜欢的颜色。R:194G:119B:112步骤2选择直接选择工具 (A) 并选择圆。这样你就能看见形状的定位点, 并且您能够使用该工具对其进行调整。步骤3使用直接选择工具 (A) 选择底部锚点, 并将其移动到一侧, 以创建角色的下巴。步骤4使用椭圆工具创建另一个完美的圆, 这次为你的角色的头发选择一种颜色。R: 45 G: 42 B: 69步骤5要创建耳朵, 请使用圆角矩形工具。使用与头部相同的肤色绘制一个小胶囊形状, 并将其移动到位。步骤6使用圆角矩形工具创建一个更大的胶囊。使用与头发相同的颜色, 并以一定角度稍微旋转头发。步骤7使用选择工具 (V) 将形状放在头部前面。步骤8复制胶囊形状, 方法是复制它 (Ctrl-C) 并粘贴它 (Ctrl-V)。将新胶囊放在头部上方, 让人物的额头有一些额外的头发体积面。步骤9右键单击耳朵的矢量形状, 然后选择 “排列” > “置于顶层”。步骤10这样就能让耳朵露出来啦步骤11创建两个很小的胶囊, 并使用选择工具 (V) 旋转它们, 并将它们移动到位步骤12创建一个胶囊来作为颈部, 并将其移动到头部下方。对皮肤使用稍微深一点的颜色。R: 165 G: 89 B: 89步骤13为背景创建新图层。步骤14在新图层上, 使用矩形工具创建新背景并选择合适的颜色:R: 186 G: 227B: 2542.创建人物的身体步骤1使用矩形工具, 并大致绘制出一个很长的白色矩形。使用直接选择工具 (A) 将顶部的两个锚点相互移动, 以创建一个梯形。确保所有四个实时圆角小部件都可见 (如果没有, 你可以换AIcc以上版本或者在效果里面使用圆角效果)。选择小部件并将所有四个角拖动到中心以使四个角是圆的。步骤2确保已选择身体（长白圆角矩形），转到 “效果” > 3D > “旋转”。步骤3在弹出框中, 请确保选择以下内容:位置: 等角-右方表面: 无底纹步骤4这将使身体出现等距形状。请注意, 您仍然是可以编辑形状, 因为它是2D的, 这将会实时调整。（所以你的电脑配置得高点，不然东西做多了会卡）步骤5确保已选择主体。转到效果 > 3D > 凸出与斜角。步骤6在弹出框中, 请确保选择以下内容:位置: 离轴-前方凹凸厚度:50斜面: 圆角高度: 4表面: 无底纹步骤7这将创建一个等距3D对象, 我们可以将其用于人物的主体。步骤8使用选择工具 (V) 将头部移动到身体顶部的位置。3.创建人物的腿步骤1使用圆角矩形工具创建人物的臀部。选择要用于腿部的新颜色:R: 100 G: 118B: 202步骤2确保已选择臀部。转到 “效果” > 3D > “旋转”。在弹出框中, 请确保选择以下内容:位置: 等角-右方表面: 无底纹步骤3确保髋关节仍处于选中状态。转到效果 > 3D > 拉伸和斜面。在弹出框中, 请确保选择以下内容:位置: 离轴-前方凹凸厚度:50斜面: 圆角高度: 4表面: 无底纹步骤4将形状放置在身体下方和后面。您可以通过右键单击形状并选择 “排列-置于底层” 来执行此操作。步骤5选择钢笔工具 (P) 并把粗细设置为21pt。步骤6使用钢笔工具 (P) 通过按住键盘上的 Shift 键绘制一条直线。复制或绘制两条腿, 并将它们放在臀部下方。4.创建人物的手臂步骤1使用圆角矩形工具创建一个白色胶囊来作为衬衫的袖子。使用选择工具 (V) 以轻微角度旋转。步骤2将胶囊放在角色的肩膀上。步骤3复制形状并将其放到左边的肩膀位置。接下来, 您需要翻转形状 (右键单击 > 变换 > 对称 > 垂直), 然后将其缩短并放置在肩膀上。步骤4选择钢笔工具 (P) 并调整描边设置, 使颜色与角色的肤色相匹配:粗细:11 pt端点: 圆角步骤5使用钢笔工具 (P) 绘制一个稍微弯曲的手臂, 并将其放置在白色胶囊下方。步骤6复制手臂复制 (Ctrl-C) 并粘贴它 (Ctrl-V)。步骤7右键单击手臂并选择 “变换” >”对称”> “垂直”。步骤8使用选择工具 (V) 将手臂放到背部, 并将其放置在第二个白色胶囊下方。步骤9使用选择工具 (V) 移动形状, 并对等距的人物各部分进行最终的微调整。（细心的朋友应该早发现脖子的地方有个椭圆的小细节了把，如果你看教程到这里还没有发现我就只能emmmm）5.创建人物的裙子步骤1现在我们已经创建了第一个人物, 现在可以进行一些轻微的调整来创建第二个人物。使用选择工具 (V) 选择整个人物并对其进行复制。在第二个人物上, 使用直接选择工具 (A) 删除头发。步骤2选择两条腿并更改笔画属性, 以使颜色与人物的肤色相匹配。稍微减轻腿部的粗细:粗细:15 pt圆角: 圆角步骤3要创建裙子, 请选择构成人物臀部的等距形状。然后使用选择工具 (V) 并向下拉形状以达到调整长度的作用。步骤4使用直接选择工具 (A) 调整实时圆角的小部件, 使边角再次变得锐利。这将使你更容易调整裙子的形状, 通过互相的移动底部锚点。一旦你对裙子的一般形状感到满意, 你可以再次使用直接选择工具 (A) 来使用实时圆角小工具来再次进行圆角。6. 创建女人的头发步骤1要创建第二个人物的头发, 请使用椭圆工具 (L) 并创建一个完美的圆。使用选择工具 (V) 将其放置在正确的位置, 并将其放到头部的后面 (右键单击 > “排列” 置于底层 “)。接下来, 创建一个较小的圆, 并将其放置在耳朵后面。步骤2创建另一个圆, 并将其放置在角色的前额前面。使用直接选择工具 (V) 来降低圆的高度。7. 创建女人的胸部步骤1使用椭圆工具 (L) 创建一个小的白色圆形形状, 并将其放置在人物的胸部区域的顶部。步骤2复制形状, 并将其放置在胸部的另一侧。步骤3将这两个形状组合在一起 (Ctrl-G), 并复制他得到一个新的组。如何按住ctrl-shift-v，这将在上一个组的顶部粘贴复制的新组。我们将把这个新的小组称为 “影子小组”。然后选择一个稍暗的颜色填充他。步骤4将阴影组移动到两个白色圆形形状的后面, 并使用键盘上的箭头键以增量方式向下移动, 以便出现一个小的、有厚度的阴影。步骤5通过用形状覆盖来删除任何多余的阴影区域(这可以用钢笔工具完成)。选择阴影形状和新形状 (以红色显示), 然后使用 “减去顶层” 模式删除多余的阴影。步骤6将阴影放置在白色椭圆下方。恭喜你，完成了今天的教程！原文地址：tutsplus译文地址：UI中国作者：Jonathan Lam译者：米夏小雨
形状 步骤 效果 先看一下整体效果分析一下：能看出3D效果主要是因为有立体面的展示。上图我们能看到3个面，和一层阴影，分解一下就如下图所示，我们姑且把黄色层叫做"上面"，青色层叫做"侧面"，红色层叫做"正面"。1、创建文本文档步骤1首先打开AI创建一个800*600px的画布，设置分辨率为72！步骤2选择文字工具（T）然后输入"PIXAR"。我这边用的字体是Silkscreen Expanded（因为字体做完3D效果扩展后立面是规则形状），设置文字大小160px，色值#f7931e。2、添加3D效果步骤1选中文字，开始添加3D效果。效果>3D>突出和斜角，输入下面显示的参考数值，然后点击确定，效果应该看起来如下图所示。步骤2保证文本仍然被选中，对象>扩展外观。然后多次操作：右键>取消编组，已取消所有的编组。这样字体就会以一系列简单形状表现。3、着色和整理文本步骤1选择选择工具（V）并选择组成3D文本"上面"的所有形状（这里有快速选择的方式：先选中其中一个形状，然后选择>相同>外观），CTRL+G编个组，然后调整形状的填充色（#ffc800）和描边色（#2e3a3a）,将描边粗细设置为2px，描边属性中的边角设置成圆角连接。步骤2选择组成3D文本"侧面"的所有形状，同样的操作方式，调整形状的填充色（#00d0ab）和描边色（#2e3a3a），描边粗细和属性也保证和上次一样。步骤3选择组成3D文本"正面"的所有形状，同样调整填充色为#fb827a，最终得到图形如下图所示。4、添加背景和简单的阴影步骤1使用矩形工具（M），创建一个800*600px的形状。设置色值为#00d0be，覆盖画布置于最底层。步骤2之前已经将"上面"一层形状进行过编组，现在CTRL+C，CTRL+F复制一层出来，改变形状的填充色为#2e3a3a。然后转到效果>扭曲和交换>变换，设置参数如下，点击确定后就能得到一个阴影层。步骤3将阴影层调整至底部，改变图层混合模式为柔光。完成！！！
色彩 线条 形状 前言：一直研究线条，就会发现，线条除了表现我们普通日常所见的图标化的个体以外，还可以表现更大更复杂的风景。但是后者会有一定难度，如果线条比较粗的情况下，尤其无法更好去展示细节（比如要表现云朵或者空中漂浮的柳絮等）。当时我的有点卡在这个思路上没有进展。过两天，我突然凭空有了灵感，想到了“简化”这一条路。尝试用简化的方法，虽然看起来粗糙，但又进入到新的层面。我想我们不是要单单造景，而是要传递景色。因此，景色用线和色块的组合，就这样一步步展开。灵感来源：于是我有了这一组作品大千之镜，这一组作品就是基于粗线+景色的方式来创作，其中重点的表现是“色”（渐变组合）。提示：本操作注重设计思维的过程，不涉及到软件的具体详细操作，如果对软件操作生疏的小伙伴，可以移步到这里看看这个简单的快速上手AI的操作视频。得到形状的四种方法：拼、减、裁、画参考照片不等于临摹照片外景的绘制，需要非常概括化。由于这里我们的规划是把景物画在一个小圆矩形的框内，其实空间是很有限的。因此线条的设置也就要趋于简单。简化是一个非常重要的思路，你可以用照片开始研究。当然，我在创作的时候，不止借鉴了一张照片，而是把多张照片进行结合参考。参考照片里的布局、构图、透视……然后提炼最基本的形状。如果有兴趣你可以看下面这支视频：灵感怎么来？参考照片的几点技巧构建基础线条如果在细节并不累赘的情况下，简化的图案可以采用网格来帮助表达。当然这取决于你的习惯。STEP 01打开AI，新建一个1600*1600px的文档。在这个文档中画出一个圆角矩形，然后在这个圆角矩形当中谋篇布局。首先用几个线条把最大的基础形勾勒出来。外框线条采用30px，而内部的线条可以稍微减小，变为25px，再细可以变为20px。线条的粗细设置原则就是让其遵循一定的韵律感，比如都是5的倍数。图案犹如搭积木那样建立起整个画面。STEP 02继续以搭积木的逻辑来填满左边建筑群的画面。这时我们要学会跳出「技」的思维层面，这在我的授课经验当中也反复和学生强调：我们并不是在学会如何画这个对象，比如这里我们在绘制小镇风景。我们学会的是背后的创作思维。这里我引用一段丰子恺在《认识绘画》这本书里的原话：“图画就同数学和体育一样。人生不一定要画苹果、香蕉、花瓶、茶壶。原不过是借这种研究来训练人的眼睛，使眼睛正确而又敏感，真而又美。”用在这里，就是通过画小镇、建筑的过程来训练自己对线条造型的能力。而这个能力表现出来就是既符合建筑的外形，又能让它看起来美观自然。STEP 03继续往下，就是把我们的形状再一次优化。优化形状有两个层面需要注意：1）形状衔接是否闭合2）整体的形状是否均匀这是宏观和微观的两个方向。然后再适当调整增删形状。STEP 04增加细节一般来说是最后一步的框架工作。这时我们又要切换一个角度：刚开始我们把线的作用看作是建立轮廓，这时，需要拿线来当作细节的描绘担当。比如下面用一个苹果作例子，你就能理解了。线的两个作用：勾勒和描绘，在这里就能体现出来。因此这里增加的细节（窗户、门、波浪、海鸟等）都是发挥线的描绘作用。到这一步我们的轮廓线就完成了。这时可以将它们扩展外观。在很多LOGO设计当中，到这一步其实就可以告一段落了，因为大部分扁平风格的LOGO都只需要一个轮廓，色彩可以是一个随机的单色。色彩框架建立色彩框架，其实就是找到一种观察色彩的角度。利用两个色彩间的关系演化成一个色彩阵列。在下面这个视频中，你可以了解更多关于色彩阵列。色彩阵列：给初学者的色彩框架图STEP 05依据上面的理论，我获得了这个色彩阵列。我们的色彩就从这里开始。主色确定为蓝色（这从我们的照片里获得了灵感），次色为粉色和薄荷绿。STEP 06当然，色彩阵列的作用并不是要让我们用上所有的色彩，仍然根据实际的情况去繁化简。在关键的色彩上进行不断的尝试，找到最好的组合。运用形状生成器工具来进行上色，把主色进行分布。STEP 07继续运用上次色薄荷绿，这时大家要注意色彩的微妙变化，在单一色彩出现的时候，看起来一切都很完美，一旦加入了第二种颜色情况就开始变复杂了。这也和我们平时生活是一样的，一个人的时候什么都好，两个人就会出现人际关系。复杂的让人头疼也让人欢喜的关系，就带来了更多的生机和起伏。我们看到虽然我们运用次色，但也在部分色块上带来了更多的色彩上的变化，这也是有了色彩阵列后可以轻易做到的。STEP 08第三种色彩是红色，我们可以继续运用在图形中。STEP 09主要的色彩控制在三种，剩下的色彩可以继续在现有色彩基础上再微调，比如调整色彩的明度或者饱和度来获取更为细腻的变化。注意在这里的白色的运用。光影渐变由于有光，我们才得已看见不同的色彩。根据这个真理，如果要想获得更为丰富的光感，渐变也是一个非常重要的上色要素。STEP 10在运用渐变前，我的建议就是先做好平涂的工作。平涂是建立整体的色彩均衡，然后再根据光线的情况进行微调。而且对于渐变，我们需要加以克制，只需要选取其中一种色彩，然后在这个色彩比较窄的范围内进行微调。比如在这里我们将红色用上渐变，使红色产生一些微妙的变化。STEP 12然后给建筑补上阴影，阴影的出现根据“美且真”的原则来安排。这里可能很多人会问什么是“美且真”原则，下面同样是出自丰子恺的《认识绘画》的一段描述：图画兼有欣赏与实用两种效果。欣赏是美的，实用是真的，故图画练习必须兼顾“真”和“美”这两个条件。具体地说：譬如描一瓶花，要仔细观察花、叶、瓶的形状、大小、方向、色彩，不使描错。这是“真”方面的功夫。同时又须巧妙地配合，巧妙地布置，使它妥帖。这时“美”方面的功夫。了解了这个原则，就在练习中去试探画面这两个要素的平衡。阴影的制作需要注意的是三点：1）找到光源2）阴影颜色的配置3）不必完全写实这三点可以通过下面这个视频中详细给大家演示：线条插画中增加阴影的三步技法完成后的效果如下：点状高光创作最后一步，这里我们增加了一个小细节，也是突然想到的点睛之笔，给画面增加点状高光。STEP 13在平面构成中，一个点可以是一个圆点，也可以是一个小方块。在这个画面当中，我们就利用白色的小方块来制造画面的高光部分。增加了点状高光的画面，就会让画面更加活泼。最终效果：后记：背后的思路写这篇文章我整理出了三段视频，通过视频也许会给初学者更多启发。我之前一直纠结在是做视频还是写文章两条路子，本来想文章+视频是最好的方式，各取所需。但是后来操作过程发现两条路没办法并行。只能在文章当中，穿插更多我认为值得展开的部分。视频作为文章的补充，而文章又作为视频的补充。虽然现在大家都说没时间看文字，视频也更加直接，但是我始终觉得潜心学习的东西，用文字是更易于查询和记录的。视频和文章都无法取代彼此。希望我们可以继续以这样的方式交流下去。原文链接：飞屋设计
矩形 文本 形状 今天的教程，来自一个自学成才的矢量艺术家：Andrei Marius的分享！在这个教程中，我们将告诉大家，如何设置简单的网格，使用使用简单的矩形和变换效果。同样的我们也提供一个AI源文件供大家下载，以便学习与交流！点击下载AI源文件 提取码8owx一. 如何创建新文档并设置网格1. 首先，我们新建文档，宽度850px，高度900px，颜色模式RGB。2. 执行“视图”>“显示网格”“对齐网格”。3. 执行“编辑>首选项>参考线和网格>”。4. 设置网格线间隔为10px，次分隔线为1。5. 执行“编辑>首选项>单位”。6. 将单位都设置为像素。7. 执行“窗口”，勾选“信息”。二.如何创建彩虹背景8. 选择矩形工具，创建一个 850 x 150 像素的矩形，刚才我们勾选了信息，我们可以很方便的查看矩形的位置，选择填充并将其颜色设置为R = 255 G = 0 B = 0。有了网格与信息，将矩形对齐，将是一个非常简单的事情。9. 确保选中矩形，然后执行“效果>扭曲和变换>变换”。10. 将“ 移动 – 垂直”滑块拖动到150像素，在“ 副本”输入字段中输入5，然后单击“ 确定”。11. 确保仍然选中矩形，执行“对象>扩展外观”。12. 然后取消组合。13. 接下来，我们逐个选择矩形，并用下面显示的填充颜色替换现有的填充颜色。三. 如何创建文本效果框架14. 选择矩形工具，并创建一个380 x 440像素的形状。用白色填充这个新形状（R = 255 G = 255 B = 255）并将其放置如下所示。15. 选择路径选择工具，并选择白色矩形，执行“效果>风格化>圆角”。16. 在圆角半径选项中输入 10px。17. 选择矩形工具，并创建一个340 x 400像素的形状。用 R = 255 G = 0 B = 0 填充这个新矩形，将其不透明度降低到30％左右，并将其放置如下图所示。四. 如何创建和对齐文本效果18. 选择“文本工具”，添加我们的文本，颜色设置为黑色，效果如下所示。19. 选择文本，右键“创建轮廓”。20. 执行“对象>取消编组”。21. 下面，我们适当的为文本进行对齐。22. 选择红色矩形，然后将其删除。五. 如何样式化文本效果23. 执行“窗口”，勾选“路径查找器”，选择所有字母形状和白色形状，然后单击“ 分割”按钮。24. 逐个选择字母形状，并粗略地调整旋转，如下图所示。25. 选择所有白色形状，将它们转换为复合路径（对象>复合路径>建立）。26.复合路径建立完后，我们将其置于顶层。27.下面，选择住这些黑色文本形状，也给它们应用一个10像素的圆角。28. 不要取消这些黑色文本形状，然后执行“效果>风格化>阴影”。（这里的截图有问题，黑色文本已经是圆角了，我没有重新截图，见谅）29. 投影的参数设置，如下图所示。（这里的截图有问题，黑色文本已经是圆角了，我没有重新截图，见谅）30. 同样的，我们选择白色形状，也给它添加一个阴影。31.投影的参数设置，如下图所示。最终效果
图层 形状 文字 本教程主要使用Photoshop制作油漆流淌装饰特效的艺术字，教程是一个层叠的多彩文字，文字有点类似溢出的小特效，感兴趣的朋友一起来学习吧。先看看效果图这是一个简单的小效果，所以，我们决定打造一张壁纸。新建个文档，尺寸1920X1080像素。填充一个颜色为#e7dcc6的纯色。(或许你也可以加点杂色，效果或许会不错)打上文字，按照惯例，我们依旧用的P大点S的缩写，PDDS，字体直接用的思源黑体，输入时，一个文字一个图层。新建个图层，把我们所要溢出的部分画个参考形状出来，方便一会我们下手。接下来，选择文字P，Ctrl+G，创建图层组，然后把文字P转换为形状，并且修改颜色为#c71c6b。修改为形状只是为了最终完成，可以基于矢量，这个是无所谓的东西，大家随意。为这个P字添加一个图层样式。选择钢笔工具，画出如下形状，并创建剪贴蒙版，添加图层样式。接下来，就是体力活了，用钢笔工具画出其他颜色的形状，然后复制刚才第一个形状的图层样式。下面，还是用钢笔工具，画出溢出的那部分，这里需要注意的只有一点，因为那个层叠的颜色是有图层样式，而这个溢出部分是没有的，尽量的调整好锚点，让它们完美衔接。复制一层这个溢出的部分，将颜色修改为黑色，不透明度40%，并下移一层，我们来做溢出的投影，如果形状不如人意的话，可以适当调整下锚点，由于我们这里也是基于矢量来操作，所以，在形状的属性面板里我们设置了羽化。一样的方法，做出另外一个溢出部分以及投影，到这里，P字我们就完成了。其它的三个文字，也是这样的操作手法。到这里就算完事了，是不是很简单?
张大湿
落霞与孤鹜
飞翔的企鹅
在路上
