小小笑的肥 发表于 2016-10-25 14:27:49

播放时一般默认状态是仅播放一次,我们可以把它调节成“永远”,循环播放模式来看效果。
http://pic1.16xx8.com/allimg/160920/2151501G9-15.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

一些拷贝单帧,粘贴单帧,和删除帧等操作可以在窗口右侧的三角按钮里找到,大家可以试下这些操作。如果对制作的动画不满意,也可以选择删除动画。
http://pic1.16xx8.com/allimg/160920/2151501350-16.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

这样我们帧动画模式下制作动画的基本操作我们已经掌握了。接下来看下如何输出GIF动图,在“文件”里选择“存储为web所用格式” 快捷键:mac电脑是com+option+shift+s,PC电脑是ctrl+alt+shift+s。选择GIF模式,颜色选择最大颜色识别个数256,是清晰度最高的,之后进行存储。
http://pic1.16xx8.com/allimg/160920/2151502P9-17.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

2小节:让皮卡丘动起来并输出为表情学完ps里动画制作的基本原理和工具后,我们就可以开始做一个QQ的弹跳感的皮卡 丘了,这里我们用4帧组成一个GIF动画,可以到达一个基本流畅的感觉,当然也可以增加帧数,制作更加流畅有难度的效果。 制作原理虽然我们已经明白了,但是一个流畅真实的动画其实是基于力学的原理存在 的。一个动作的完成是由预备——进行——缓冲组成的。拿人跑步为例子,跑步的时 候,我们一般摆好姿势,进行的下一个动作不是直接冲出去,而是身体会有一个膝盖下压或者身体下倾的预备动作,这个时间会非常短暂,再向前弹出去,停止的时候, 也会有一个缓冲,缓冲也是非常短暂的一个效果,而且根据物体的质量或者物体的速度不同都会有不同的变化,如果大家都有学过物理的话应该不难理解,所有的生物和非生物都是遵循这个理论而存在的,所以我们想要制造真实的动画效果,模拟真实的 动画原理,就一定不能脱离开力学的基本作用。
http://pic1.16xx8.com/allimg/160920/2151503240-18.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

但是我们做动画的时候一般都会夸张化和戏剧化一些,就像《猫和老鼠》动画片,就有很多超出常识的夸张手法的表现,这也是动画的魅力所在。
http://pic1.16xx8.com/allimg/160920/2151505963-19.jpg

http://pic1.16xx8.com/allimg/160920/2151503647-20.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

我们做的简单小GIF也是在遵循基本动画原理上来做的,我们这次的案例是做一个Q弹感比较强烈的皮卡丘,类似一个橡皮球原地弹跳,那我们就可以想象一下橡皮球弹跳的质感,先弹上去然后再收缩回来,这样一个简单的动作。(下图为小球弹跳参考)
http://pic1.16xx8.com/allimg/160920/2151504105-21.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

因为我们做的是简单的原地弹跳,所以动作很简单。接下来就可以进行尝试了,因为我们之前做皮卡丘的时候分好了骨骼,做动画的时候会方便很多。
http://pic1.16xx8.com/allimg/160920/21515041K-22.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

这里我们需要4帧动画帧,分别为默认姿势——向上拉伸——回归——向下压缩四个动 作。
为了方便调整骨骼,整理好图层,命名好名字,复制出另外三个组。
http://pic1.16xx8.com/allimg/160920/215150EU-23.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

调整组合图层分别调出四个状态,因为默认和回归两个的状态类似,所以直接拷贝就可 以。调整的时候要注意由于力的作用,向上拉伸的时候整个身体会由于拉长而变瘦,向下压缩的时候身体会向两边拓宽,想要夸张化的效果就可以再夸大化,使力的作用更明显。耳朵、尾 巴和眼睛也都会跟随变化,这样动起来才更生动真实。如果要达到更真实的效果,还可以增加 帧数调的更细微。
http://pic1.16xx8.com/allimg/160920/2151502041-24.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

要注意的是这些组在ps里是相互叠加的状态,是为了保证皮卡丘弹跳的时候不错位,保证重心和位置不变。
http://pic1.16xx8.com/allimg/160920/215150B11-25.jpg

小小笑的肥 发表于 2016-10-25 14:27:49

把图片制作成动态图片教程

接下来时间轴窗口的动画帧就和图层相对应起来,调整合适的秒数帧速率
http://pic1.16xx8.com/allimg/160920/21515013Z-26.jpg
播放看看效果,如果效果不满意可以继续调整,调整完毕就可以按照我们1小节教的GIF的输出方法输出动图了。这样一个GIF动画就完成了,我们也可以用这样的方法制作简单的小表情用在一些聊天软件上。接下来同学们就来制作属于自己的小动画吧"(′?ω?`)ノ
页: 1 [2]
查看完整版本: 把图片制作成动态图片教程