2.5D插画教程

作者: semine_珊珊 | 来源:发表于2017-12-11 21:27 被阅读0次

    不知道大家有没有注意今年很多的APP引导页都用了2.5D插画的形式。2.5D插画,即等距侧轴图,也有人称为伪3D,因为这种图你只能看到三个面,即顶面,左面和右面。上两张图给大家熟悉下。

    这张是我下面要讲的如何用AI画2.5D插画的教程用图,也是我画的我们APP的引导页。

    这张左边是京东金融、右边是58同城引导页。

    我最近也是才学起来,跟大家分享下,好了,话不多说,开始教程。

    使用工具:AI打形、sketch上色。

    1、打开Ai,新建一个800*600px的画布;

    建一个210*340px的矩形,圆角值设置为26pt,填充任意颜色;

    选中这个矩形后选择效果-3D-突出和斜角,调整设置参数右侧的立方体到合适方向。

    2、选中矩形后选择对象-扩展外观

    3、重复上面步骤,将剩下所需的形状都画好

    4、在sketch中新建一个iPhone8(375*667)的画布

    将AI中所有的形状复制到sketch中,上色及调整位置

    5、用钢笔工具把剩下的装饰画完,包括手机,小树和建筑窗口

    复制两个建筑矩形,Scale缩小后打组,在复制一组

    钢笔工具把建筑顶部的小红旗画出来

    OK,完工啦,是不是so easy~

    OK,如果你看到这里欢迎关注我的公众号:转UI

    相关文章

      网友评论

        本文标题:2.5D插画教程

        本文链接:https://www.haomeiwen.com/subject/nlmwixtx.html