怎么画出扁平的小图标和动图?

by 束缚の花2019-12-13
© 本文 by 束缚の花 版权所有,未经作者本人的书面许可任何人不得转载或使用整体或任何部分的内容。
笔记

很多扁平的小图标之所以看上去整体,是因为这些有趣的断点处理。

打开 — Ps — 用矩形工具画矩形时,我们只需要调整描边的设置

( 描边居中,圆形,方便后期处理 )


20200218_132008_000.jpg


利用日常中的实物就可以简化成类似效果,栗如这张实物图:


20200218_132008_001.jpg

一、画轮廓

1、用椭圆工具画大概轮廓

20200218_132008_002.jpg


2、用直接选择工具删除上面两个锚点

20200218_132008_003.jpg

3、填充颜色

20200218_132008_004.jpg


4、用添加锚点钢笔工具添加多个锚点


20200218_132008_005.jpg


5、然后用直接选择工具删除两个锚点中间的一个,就出现断点的效果


20200218_132008_006.jpg


6、在选择性细化就ok


20200218_132008_007.jpg


根据实物来绘制这些图标时,只要辨识度达到,加一些风格化的小元素就可以,不用太过复杂,用线勾勒出大致轮廓,复杂的图形注重线条的粗细结合,做到平衡画面就可以了!

配色方面就选择鲜亮一点的,但是有一定灰度的颜色就好喽!


20200218_132008_008.jpg


二、栗如这样的


20200218_132008_009.jpg

三、还有这样式


20200218_132008_010.jpg

四、找蓝翔借台挖掘机


20200218_132008_011.jpg


1、画车身

20200218_132008_012.jpg

2、两个圈,两条线


20200218_132008_013.jpg


3、继续用用圆角矩形画


20200218_132008_014.jpg


4、继续不补充细节


20200218_132008_015.jpg


5、依旧是用直接选择小公举删除多余的锚点


20200218_132008_016.jpg


6、填充颜色,增加锚点,做断点效果,加一些高光,就ok


20200218_132008_017.png


五、如何做 GIF 图

1、这些图简单有趣的图会动的话会更有意思

就让这几个部分动一下吧:


20200218_132008_018.jpg


2、在ps窗口中找到时间轴,下方会出现 这样的小窗口,选择创建视频时间轴,就可以调整了


20200218_132008_019.jpg


3、处理之前,要把图层转化为智能对象

栗如,下面的直线,我命名为地面,在最开始创建关键帧,位置改变后再次打上关键帧,这就是一个简单的动画了,接触过Ae、Flash的宝宝,就不用担心了!

20200218_132008_020.jpg

栗如,下面这个,第一张是在第一个关键帧上,直线向右移动后是在第二个关键帧


20200218_132008_021.jpg


4、顺便简单的加了一些参照物


20200218_132008_022.jpg


20200218_132008_023.jpg


5、这几个部分是要分开的


20200218_132008_024.jpg


6、简单的动了几下


20200218_132008_025.jpg


不要看了,蓝翔没毕业,铲不起来了————————懒癌犯了


---

转载请注明本文标题和链接:《 怎么画出扁平的小图标和动图?
收藏

还没有评论奥,快来抢个沙发吧!

身份验证
  • 账 号:
  • 密 码: