前言

曾经写过一篇关于立体风格的文章，但是当时刚接触到这种风格，还没有全面的总结。严格来说，经过一段时间的了解，现在正式称为“等距式”。今天，我们将学习这种风格，并与大家一起画一幅等距风格的插图。

灵感来源

在YOUTUBE上刷建立辅助网格的方法，很实用。插画本身来源于自己的想象。

一、什么是等距立体风格

等距风格在英语中称为等距风格。这种风格最早用于像素绘画。因为像素绘画的特点是正方形(像素)，所以使用这种“堆叠”的方式可以呈现各种场景，就像积木一样。在很多怀旧游戏中，我们很容易找到这种设计风格。

等距立体风格几乎可以构造任何场景和物体，从立体绘制的角度来看，其绘制方法非常简单。

第二，改进的等距风格

到现在，早期的等轴测样式已经逐渐完善。就像90年代流行的时尚，现在又到了另一个周期。但很明显，现在这种风格更进化了。比如我们再也看不到像素了，颜色逐渐变化，更加细腻。在丰碑谷，一款传说中的“设计师必玩”神级游戏，场景设计采用这种设计风格，效果惊人。

鉴于之前很多大神都教过你怎么画纪念碑谷的场景，今天基本就跳过这一部分了。本文的重点不是教你最终的结果，而是给你一个等距的绘图框架。有了这个框架，你可以画任何形状。

可能大家都觉得这种插画真的不难，尤其是它只是一个立方体。AI里有3D工具一大早就给你准备好了。可以说剩下的工作只有上色了。当然这是你画的场景比较简单的时候。比如这些场景是由不同大小的立方体组成的，其实就是一个积木的过程。但是如果需要加字符呢？还是需要一些不标准的形状？

例如，我设计的这个BANNER图使用了非标准字符，这些字符不是简单地由标准立方体拼写的。

第三，认识三种形式

现在我们来整理一下等距立体风格绘制的“基本形状”和“非基本形状”。众所周知，我们的世界是由几种基本的几何形状组成的:圆形、矩形和三角形。那么，其他所有的形式都是这三种基本形式的组合、变形或加减。

1、基本形式

基于这种思想，三维风格中所谓的“基本形状”主要是指:球体、立方体、椎体、圆柱体、三面体，因运动方式不同而不同。

这些基本形态可以直接获得，通过AI工具中的3D工具，可以直接从平面基本形态转换为三维基本形态。在插图中，我们使用这些基本模型来构建模型，非常方便。

2.非基本形式-字体建模

字体也可以直接转换成3D，中英文无疑都可以做出比基本形状更复杂的视觉效果。结合基本形式，可以构建非常丰富的场景。

3.非基本形式-柔性物体

这里的灵活对象是指人物、动物等相对活跃的角色对象。在插图中，人物通常扮演更重要的角色。画人物有两种，一种是完全按照几何形状组合，诚然人的形状也是由几何基本形状组成的，这是一种基本思想。比如纪念碑谷的人物就比较简单。

还有一种方式就是画的比较灵活，就是不需要从几何开始。直接绘图的前提是使用一个辅助框架，今天我们就教你如何制作这个辅助框架，并提供一个辅助工具给你下载(见文末)。这是一条等距的高像素三维辅助线(图片)，可以直接添加到你的项目中。

第四，在AI中创建辅助线

步骤01

现在我们来学习一下如何在AI中创建辅助线。这一步是绘画工作的开始。打开AI，新建一个1200*850px的文档，然后点击左侧工具栏中的“直线段工具”。会有一个下拉菜单，在菜单中选择【矩形网格工具】。

选中矩形网格工具，双击画板的白色空弹出矩形网格工具选项设置面板。高度和宽度分别设为1000px，水平/垂直分割线参数设为50。这建立了我们的矩形网格。

步骤02

选择此矩形网格，右键单击并输入[转换>:缩放]。在弹出的参数面板中，选择“不等比”选项，将纵列中的参数改为86.602。这个值是严格按几何计算的，尽量不要随意调整。

步骤03

然后输入【变换>:倾斜度】，在倾斜度的角度参数中，设置为30。

步骤04

输入[变换>:旋转]，旋转角度设置为-30。此时，矩形网格的转换完成。

步骤05

选择此矩形网格并输入视图>:参考线>:创建参考线]，以便参考线保持不可编辑，以便在一章中找到下一个绘制过程。

第五，建立基本形式——营造场景

步骤06

创造这个场景，最重要的是把握需要哪些基本形式。在这之前我画过一个素描，因为是随便画的，素描比较粗糙，目的是找到最基本需要的形式。

步骤07

立方体的方法很简单，先画一个长方形，可以用灰色填充。此时是配置阶段，不需要考虑色彩。

选择矩形进入[效果>:3D >；突出和斜角]，在弹出的3D工具面板中，将位置设置为【等角-上】，然后将厚度设置为600以上，以保证立方体的高度可以超过屏幕底部。

步骤08

将立方体放在适当的位置，注意此时不要展开，但仍要改变立方体的宽度和长度值。高度已由3D工具面板中的厚度设置，因此无法更改。(注意下图中的黑色边框是画板的边缘位置)

步骤09

添加其他形状，这里有立体效果的薄矩形也是3D工具实现的，但是厚度是基于STEP 07的操作设置为0的。

第六，你可以在这一步开始填充颜色

填充可以在所有细节完成后开始，但也可以从这里的这一步开始。因为，基础色可以设置最基础的配色，接下来的细节，也就是在此基础上的增加和调整。

步骤10

在这里，我将用渐变颜色填充。首先，建立三个梯度色板。在这里，我使用矩形来创建色板。

然后，对每对基本形状执行[扩展外观]和[取消组合]，以方便颜色填充。

当你开始填充颜色时，你应该不时地调整渐变方向，并考虑整体效果。

七、增加细节的丰富性

步骤11

从右向左添加细节，右边部分可以复制到原来的形状，重新组合。

更改某些形状的透明度和混合模式。

步骤12

在建筑物中添加“窗户”时，请注意使用基准线

使用形状生成工具和3D工具添加新形状，丰富原始建筑的细节。

八、画人物

图绘和普通平面图差别不大。不需要刻意表现阴影高光，因为人物很小，所以只能保留最基本的形状。

请注意以下几点(将在视频中详细说明):

1.来表达人体的基本形状。2.肢体可以用钢笔工具表达。3.字符的颜色可以是扁平的。4.从立体的角度来看，人物的上部会稍大一些

步骤12

画第一个人物，关注人物的走向和三维造型的特点。

步骤13

其余的角色根据他们不同的动作来画和排列他们的形状。但是基本规则是一样的。

九、光影调整的细节

光影细节的完美可以充分自由的展现。

步骤14

给人物和建筑增加光感，利用外部光线和投影突出焦点，增加细节。

应该指出的是:

1.光感的效果要尽可能的改变，达到透明和混合模式。2.重点部分的细节比其他部分的细节更深。3.AI里的颜色和大小做好了就可以调整了。4.跟着自己的感觉走。去吧，

结尾:WOW~终于讲完了长故事

这篇文章相当长。文字我已经讲过了，尤其是视频里的画图过程。文字省略。画插画基本上是一个砖瓦工艺，不过还好我很享受。于是我花了两天时间做了一个视频，记录了整个过程，一路讲解。

每次写文章，需要准备的东西都不简单。这是我第一次准备这么长的操作文章。以后我想我会努力做到每一篇运营文章都全面。虽然阅读方法简单，但是吸收率很小。希望每次交流都能对一种风格有更深入的了解。

这是我学习的过程，同样也希望能和你一路同行。