Unlimited PS Actions, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Design & Illustration
  2. Hexels

利用Hexels和Illustrator创造一个矢量等距视图的岛屿

by
Difficulty:IntermediateLength:MediumLanguages:

Chinese (Simplified) (中文(简体)) translation by Loyikon (you can also view the original English article)

Final product image
What You'll Be Creating

在教程中我会教授你怎样利用Hexels和Ai创造一些等距视图的作品。 请仔细阅读,了解Hexels'快速的迭代概念和易于创建相同纹理的功能。

为了大家能自如地按照教程操作,我建议你下载本教程提供的资源,并且保持好Hexels、绘图板和Ai在开启状态。 当你做完以上的准备工作,请向下滚动开始我们的教程。

Hexels的Iterate Concepts(此处不懂怎样表达)

步骤1

伴随开启Hexels和插上绘图板,我们首先创建一个新的文件(Command-N) 然后点击Modes(Command-2),然后选择Trixel,并点击Rotate 90度。

Modes - define your grid

然后,选择Glow(Command-3),并取消选中启用。

Glow - add an effect to your illustration

最后,进入Document(Command-4)),更改宽度为36,高度为48,并点击 Trim Canvas Border。

Document - settings of your file

步骤2

首先,我们将创建一个彩色的插图。 选择Color(Command-1),并挑选地面颜色(#FFCC66),右侧壁(#CB4425),左侧壁(#F29946),海(#66FFB3)用画笔工具(B)把基本形状描绘出来,最后把他们的不透明度设置为100%并保存。

随意使用自己的颜色设置。

现在,您可以使用这些色彩进行绘制。 选择Color Drop(I),并使用画笔工具(B)进行绘制。

选择File> Export(Command-E键)输出你的作品,,然后选择最好的质量,然后按输出600的宽度和450的分辨率。

Export - Can export the file to any resolution

您可以选择使用你的概念或选择附近中已经制造好的文件。

导入您的作品到AI

步骤1

打开"Grid.ai" 并且打开 (Command-O)导入你之前做好的图形。 然后复制(Command-C),粘贴到最前(Command-F)至图层“Layer Reference”。

切换到智能参考线(查看>智能参考线),并锁定参考线(查看>参考线>锁定)。

保存文件,文件>另存为(Command-Shift-S),拥有自己岛屿的文件。

步骤2

选中图层( Layer Land),使用钢笔工具(P),并选择无填充和1像素描边的黑色笔触绘制地面,右侧壁和左侧壁的轮廓。

Oultine of the land

将地面、右侧壁和左侧壁轮廓成组(Command-G)。 选择地面的组,使用吸管工具(I)和使用您的参考匹配的颜色。 把右侧壁和左侧壁也填充好相应的颜色。

添加背景,选择矩形工具(M),选择图层( Layer Sea创建一个600×450的矩形,然后使用吸管工具(I),以填补大海的颜色。

Land and Sea colored

步骤3

在图层(Reflection_land)创建倒影反射。 选择钢笔工具(P)和使用网格创建-2深度的岛屿倒影。

将右侧壁的倒影成组,并改变透明度(窗口>透明度),正片叠底,50%。

重复上面的动作至左侧壁,叠加,透明度为50%。

Reflection

保存(Command-S键),打开Hexel创建纹理。

用Hexels创建纹理

步骤1

选择File> New来创建一个新文档。 然后点击Modes(Command-2),选择Trixel,并点击Rotate 90度。

Modes - define your grid

然后,选择Glow ,并取消选中启用。

Glow - add an effect to your illustration

最后,进入 Document(Command-4),改变宽度为48,高度为48,并选择Wrapped (Tileable) Canvas.。

Document - Settings of your file

使用画笔工具(B)和白色(#FFFFFF),透明度(10%),画一个纹理图案。 选择橡皮擦工具(E),透明度(10%),以调整纹理的基调。

选择File> Export(Command-E)导出纹理,然后选择宽度和高度高于600像素,最好的质量,然后按确定保存你的作品。

然后,去到Modes(Command-3),改变模式,产生几个纹理相同的黑色和白色图案。

Texture made in Hexel

你可以使用自己的纹理或者附件中的纹理。

导入您的纹理到AI

步骤1

打开你的纹理。 然后分别复制并粘贴在图层(Texture_sea)和(Texture_land)。

步骤1

选择地面组,复制和粘贴在图层(Texture_land)。

Mask layout - Land on top of the texture

选择地板组和地板纹理,去到透明度选项,制作蒙版,选择叠加,100%。

Result after masking

重复上面的动作,将海的纹理的透明度设置为叠加,40%。

End result with all textures

增加细节

步骤1

选择地面组,复制和粘贴在图层(Ripple_sea)。 然后,使用网格,将地板设置为-1深度。

选择没有填充,1像素白色描边。 去效果图>路径>偏移路径,并设置偏移量为5像素,限制为3。最后,透明度为叠加,40%。

Ripple Effect

步骤2

选择海洋背景复制并粘贴到图层(Gradient_sea)。

选择渐变,并创建一个线性渐变,45度,起始色(#115E4D)和终结色(#005978);透明度设置为叠加,60%。

Gradient to add variations in color scheme

步骤3

选择你刚做好的渐变背景复制和粘贴在图层(Mood_light)。

将渐变色改为起始色80%(#D3E169) ,终结色0% (#8C3331) ,透明度设置为叠加。

Reinforcing the source of light

步骤4

复制地面组,并粘贴到图层(Highlight_land)。

然后去掉填充,并且加一个渐变色的描边。 在渐变面板,设置为线性和45度,起始色100%(#FFFFFF),终结色0%(#FFFFFF),并改变透明度为叠加,80%。

Adding a subtle indication of the light source

步骤5

使用钢笔工具(P)在图层(fish)绘制鱼。

鱼的颜色(#652C90),并设置透明度为正片叠底,20%。

Close up on the fish

填充场景

现在,我们将制作一个沙滩巾,梧桐,排球和棕榈树,以填充我们共同创造的土地哈哈。 我们将在AI手工绘制每个物件,每个物件最好在图案和细节都有一定的差异。

步骤1

让我们先从球开始。 使用椭圆工具(L)创建一个24像素的圆。

用不同的模式/纹理创造不同的球。 在这种情况下,使用钢笔工具(P)创建三个不同的模式。

要创建模板,复制和粘贴前球,同时选择圆和纹理,并转到透明度按制作蒙版。

使用椭圆工具(L)创建一个高光,设置透明度为叠加,80%和实用钢笔工具(P)绘制透明为正片叠底,40%的水下部分。

最后,让我们添加相同的波浪效果。 选择图层(Ripple_Sea)里的海浪效果。 打开其图形样式窗口并且把其效果拖至其中。 您已成功保存了这种效果了。

现在,使用椭圆工具(L)画一个圆,然后点击你刚刚保存的图形样式。 我们需要一个蒙版覆盖球较高的部分。 将球复制和粘贴,并使用直接选择工具(A),以改变形状,使圆覆盖了球多出的部分。 去到透明度面度制作蒙版。

Process behind the ball item

步骤2

然后,我们绘制一条毛巾。 使用钢笔工具(P)画一条毛巾和一个简单的纹理。

使用钢笔工具(P)在毛巾的两端创建毛边。 然后,使用混合工具(W),以填补两边的差距,对混合工具图标双击间距更改为指定,并输入14。

复制3条毛巾。 选择一条毛巾,使用重新着色(旁边的透明度窗口,菜单栏下面),并切换到编辑标签来快速改变颜色。

Process and declinaison of the beach towel

步骤3

现在,我们将添加一个遮阳伞,这样才能愉快地跟阳光玩游戏。 使用多边形工具(矩形工具或椭圆工具中找到)来创建一个24像素半径的12边形。 然后,宽度更改为48像素,高度为24像素。 使用钢笔工具(P)加上支撑杆。

给遮阳伞添加图案,使用钢笔工具(P)创建条纹,如下图所示的画面。

最后通过增加高光完成这个遮阳伞。 使用椭圆工具(L)覆盖遮阳伞。 要创建一个蒙版,复制遮阳伞,同时选择了遮阳伞和光,透明度面板点击制作蒙版,叠加,80%。

然后,重复相同的步骤,用于毛巾。 复制和粘贴在阳伞的前三个副本上。 选择一个遮阳伞,使用重新着色(旁边的透明度窗口,菜单栏下面),并切换到编辑选项卡可以快速改变颜色。

Process of a parasol

步骤4

最后,让我们创建一个棕榈树,给这幅插画添加点生活色彩。

首先创建形状,使用钢笔工具(P)创建叶子和树干。

纹理:使用钢笔工具(P)创建树的纹理。 使用钢笔工具(P)创建图形,再用路径查找器 > 减去切叶。

使用钢笔工具(P)创建的光的区域。 要创建蒙版,复制并粘贴前面的树干或叶子,去透明度面板,点击制作蒙版,叠加,80%。

Process of a palm tree

这样就完成了!

在本教程中,我向您展示了如何使用Hexels和Illustrator制作等距视图岛屿。

我希望你喜欢这个教程,并可以用你学到的知识为自己的项目。 请随意发表意见,并发表你的作业。

Final result
关注我们的公众号
Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.