页面载入中...

Illustrator绘制2.5D风格的插画作品

xingIllustrator, 2018-10-150

 

Illustrator绘制2.5D风格的插画作品

来源: 思缘论坛  作者: 米你教育

今天我们用AI软件绘制一个纪念碑谷那种不可能图形,然后结合PS制作成夜歌APP启动界面。首先我们在AI软件中搭建一个纪念碑谷的2.5D图形,首先纪念碑谷这种2.5D效果都是比较规则的图形,2.5D有个特点就是翻转下就能当另一面使用,这也是游戏中常用的手法。

先看看效果图

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

制作步骤:

这些矩形后面会大量用到,这里先做出几个备用

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

拿出一个矩形色板,执行【效果-3D-凸出和斜角】,

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

在弹出的对话框中位置选择上方,厚度我选择的是30 ,大家根据不同的大小合理设置厚度。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

利用相同的方法再次制作一个立体的矩形,将两个矩形拼接到一起,如图示,将顶部的再复制一个到最下,记得调整图层上下顺序

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将这3个矩形全选中,执行【对象-拓展外观】,将他们合并。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

用直接选择工具选中形状底部的三个锚点,向下拖拽拉长一些。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

继续复制下方这两个矩形,相同的方法将底部继续拉长。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

这样城楼的主体形状就出来啦,下面制作一面旗帜。先用矩形绘制一长条,执行【效果-3D-旋绕】,选项内直接确定,将长条矩形变为圆柱旗杆。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

用矩形工具绘制一个矩形,在矩形右侧中间位置利用钢笔添加一个锚点,并向左移动。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

执行【效果-变形-旗形】,适当调整弯曲度,拼上之前的旗杆咱们的旗帜就完成啦,摆放到城楼上。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

下面再来做窗户,首先绘制一个圆角矩形,圆角加大,将上下改为半圆形,选中最底部的锚点删除,嫌门小选中底部两个锚点适当的向下移动一些。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

执行【效果-3D-凸出和斜角】,位置选择左方,厚度为0,这样一个倾斜的窗户就出来啦。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

为了突出窗户,也显示屋内灯光,将窗户改为淡黄色,复制放到城楼上。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

下面做窗台,同样创建一个长条矩形,执行【效果-3D-凸出和斜角】,位置选择左方,厚度为2,做出立体效果

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将窗台摆放到窗户下面,复制几个放到其他窗户下面

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

复制一个窗户放到下面,放大当门来用,制作一个大的矩形立柱放到最下方

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

继续制作向上的阶梯,同样是用到这个矩形,倾斜摆放6个,将后面几个拉长,让他们底部对齐。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将几个图形选中,通过路径查找器的联集合并为一个形状,选中形状底部几个锚点,向下拖拽。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

因为楼梯是不同的方向,记得多复制几个原始图形,拿其中一个执行【效果-3D-凸出和斜角】,位置选择左方,厚度为30,做出立体阶梯效果

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将阶梯拼到原来的小楼上,接下来就是各种复制组装出效果。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

下面来制作一个起点,拿过来一个矩形,将填充去掉换成描边,执行【效果-3D-凸出和斜角】,位置选择上方,厚度为0。做好后换个青色

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将做好的起点放到城堡上,并复制几个中心收缩下。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

下面将整个起点都选中,执行【对象-拓展外观】组合到一起。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

多复制几个起点放到其他位置装点下,注意调整合适大小

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

现在城堡绘制完成啦,下面在PS中创建一个启动页面,将城堡复制过去。根据城堡的颜色在背景填充个渐变色,再找个星空的图案叠加上去,完成背景的制作。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

月亮的制作,绘制两个圆形,合并到一起,用直接选择工具选中上方的圆形,在选项栏选择减去顶层,完成月亮

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

将月亮更改为黄色,并添加外发光。

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

最后添加上启动页必须的LOGO和slogan

Illustrator绘制2.5D风格的插画作品,PS教程,素材中国网

在教程中咱们大量的用到了复制,这个也是2.5D的一个优点,只要改变方向就是另一面,哈哈,看着复杂,其实做起来挺简单的,大家可以跟着练习下。

 


分享:

设计原的发展离不开您的支持与帮助,如果您觉得设计原对您有所帮助 可以用微信扫描

相应二维码打赏设计原,赏金将全部用于网站建设

微信