ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标

来源:98篮球网 足球资讯

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标

今天618哦,相信很多小伙伴的购物车都已经满满的了。但是也不要忘了今天是另一个重要的日子哦,今天是所有爸爸们的节日。小志在这祝福天下所有爸爸节日快乐。

今天给大家带来的是一个机器人图标的小教程,我们来看看吧。

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(1)

嗯,都不难,我们直接开始吧。

首先,还是新建一个文档,调节一下网格设置。

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(2)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(3)

step1:绘制安全框。

1)新建5个层。(一个参考网格(安全框),一个通用背景,3个机器人)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(4)

2)绘制安全框。

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(5)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(6)

3)复制两个,调整距离放好。

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(7)

step2:绘制通用的背景。

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(8)

120*120px,#685E5E

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(9)

圆大小2*2,4*4,8*8px,颜色白色,不透明度10%,30%,60%

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(10)

因为有点圆点超过了圆的圈圈,选中它们所有编组,然后复制一个大圆,剪切蒙版

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(11)

step3:绘制第一个机器人头像。(Eve Avatar)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(12)

54*28px,#EDEAE8

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(13)

是用锚点工具将上面的锚点上移12px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(14)

偏移路径4px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(15)

改变颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(16)

42*20px,颜色为#3F3535,同样将上面的锚点上移6px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(17)

10*8px,颜色为#7FC2DD

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(18)

添加两个12*10px,颜色为#3F3535的椭圆

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(19)

46*16px,白色,然后剪切蒙版(蒙版使用偏移路径得到,将中间那块偏移量设为-2px)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(20)

调整下不透明度

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(21)

同样的方法将中间的打的灰色的偏移路径,偏移量为-2px,改变颜色为白色

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(22)

54*8px,颜色为#EDEAE8

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(23)

将上面两个锚点的圆角设置为4px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(24)

54*76px,颜色为#EDEAE8,减去一半,然后将剩下的一半和上面的矩形联合

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(25)

偏移路径4px,改变颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(26)

6*6px,颜色为#FF6B57

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(27)

偏移路径-2px,颜色改为白色

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(28)

2*40px,4*40px,白色

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(29)

8*8px,颜色为#EDEAE8,将下面的锚点下移24px,然后便宜路径4px,改变颜色为#3F35

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(30)

复制一个,然后将机器人整个编组

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(31)

复制一个背景,然后将它和机器人选中,建立剪切蒙版

step4:绘制第二个机器人(Wall-E Avatar)


ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(32)

63*34px,颜色为#DD9F68的矩形

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(33)

偏移4px的路径,改变颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(34)

64*2px,颜色为#99918A的矩形,偏移4px的路径,颜色改为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(35)

加一些高光,调整下不透明度

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(36)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(37)

10*12px,颜色为#C9C3C0,4px描边,颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(38)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(39)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(40)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(41)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(42)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(43)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(44)

4*12px,颜色为#3F3535,相隔16px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(45)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(46)

20*4px,颜色为#756E68,描边4px,颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(47)

20*2px,颜色为黑色,不透明度为30%

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(48)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(49)

12*6px,颜色为#BA8152,上圆角为1px,描边4px,颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(50)

4*16px,描边为4px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(51)

2*2px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(52)

8*8px,颜色为#756E68,4px描边

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(53)

4*4px的阴影

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(54)

22*16px,颜色为#C9C3C0,将上面右端的锚点圆角设置为2px,其他的都变圆

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(55)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(56)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(57)

24*12px,4px圆角,2px描边,放在脖子下面,然后整体编组

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(58)

同样的方法,建立剪切蒙版

step5:绘制第三个机器人(M-O Avatar)


ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(59)

36*32px,颜色为#EDEAE8,4px描边,颜色为#3F3535

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(60)

36*4px,黑色,不透明度为30%,8px高,白色

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(61)

36*8px,颜色为#5B4F4F,4px描边

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(62)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(63)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(64)

56*46px,颜色为#EDEAE8,圆角上面4px,下面2px,描边4px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(65)

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(66)

40*18px,上面圆角为4px,

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(67)

10*4px,颜色为#DBC66B,圆角为1px

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(68)

22*6px,颜色为#FF6B57,上面圆角为2px,描边4px。加一些白条,改变ttou'miin透明度

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(69)

手臂的制作过程

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(70)

添加阴影和高光

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(71)

编组,剪切蒙版

ai中超小图标路径偏移 Illustrator小教程——画一组粗描边的机器人小图标(72)

好了,我们这次的教程就完成了,大家有什么疑问可以留言讨论哦,有想看原文的小伙伴戳下面:

https://design.tutsplus.com/tutorials/how-to-create-a-set-of-wall-e-inspired-avatar-icons--cms-27123

以上就是ai中超小图标路径偏移的内容,希望您能喜欢。