所需软件,Photoshop,Adobe Imageready(Photoshop7.0以上版本均有自带)。
好了,先让我们来看看原图。
然后,我们再来看看修改后的效果图。
在这里大家可以看到,我把原图里布料上的字给去掉了,然后换成我自己想要的文字。
这里面总共涉及到3个大知识点:
1. 如何把GIF导入到PS里。
2. 如何将图案完美的退底。
3. 如何在Imageready编辑动画。
好了,现在我们开始今天的课程。
首先,我们来观察一下原图:一个可爱的小孩在天上飞,手里抓着我们今天课程的主题,一块布,一块在上面印着GOOD LUCK的布。
这块布是以白色红点为背景,我们现在要来做的就是把字去掉,然后把去掉部分用再用红点覆盖起来。
好了,现在让我们来打开ADOBE Imageready。
首先,双击空白处,找到并打开我们所要的图片。
如图A。
A.jpg
接下来,点击左边的工具条最下方,跳转到Photoshop。
如图B。
B.jpg
(这里可能有同学会问,为什么不直接用PS打开呢,这是因为,用PS直接打开GIF图片时,PS只能打开图片的第1帧)。
好,现在我们已经进入到PS的操作界面了。
按一下键盘上的“L”键:“使用多边型选择工具”。
如图C。
C.jpg
在图片上圈选出如图D的部分。
D.jpg
这里要说明一下,因为呆会我们会把圈选的范围用红点填充,为了感觉完整性,所以我们现在在选择的时候尽量注意不要出现一颗红点有半边在圈外半边在圈内的情况。
如上图D。
接下来,我们按键盘上的D键,把前、背景还原为默认色,然后,再按键盘上的Ctrl+Delete,用白色把圈选的区域用背景色填充。
按下来,我们按一下键盘上的B键:使用画笔工具,然后在窗口的右边有一“画笔”的标签,点击它,然后设如图参数:直径为5,硬度为100%,间距为500%。
如图E。
E.jpg
好,接下来,按紧键盘上的ALT键,在白布里的红点上点一下鼠标,取一下红点的颜色,然后,用画笔工
具在选区里画上红点。
如图F。
F.jpg
好,现在,我们用画笔工具小心翼翼的在空白处合理的画上所需红点,如图G。
G.jpg
好,接下来就是按一下键盘上的CTRL+J,可以看到图层面板里多出了一个层,没错,这个就是我们刚刚的选区。
如图H。
H.jpg
好,现在我们试着来回点击图层2左边的眼睛,看看布的xxx是否正常。
你看到了什么?没错,布在动,但我们刚刚做的那一块区域却没反应,这看起来很不自然。
那么我们接下来就是让他变的自然一点。
我们观察一下,图层2的布是鼓起来的,而图层1的布是往内收缩的,所以,我们现在只要将图层3也往内收缩一下,就OK了。
好,我们来选择图层3,然后按CTRL+T,把图层3稍微往下压一点,好,压好后,按键盘的ENTER确认。
我们再切换图层2的眼睛看看,是不是很自然了?
OK,接下来选择图层3,然后按CTRL+E,让图层3和图层1合并起来。
下面,我们就要来真正的让它动起来了。
按一下PS的工具栏的下方,转到Imageready。
如图I。
I.jpg
用打字工具,输入“游园活动”,并把它移动到合适的位置,这时个,在图层面板里多出了一个“游园活动”的层,我们在上面右键点击一下,选择“匹配”,如图J。
J.jpg
出现一窗口,如K图设置,如图K。
K.jpg
这是因为我们刚刚移动文字的时候只是针对了两个动画帧中的其中一个帧,另外一个帧没有受到影响,但我们要的是两个帧的文字位置都一样,所以才要“匹配”一下。
现在我们来改变一下两个帧播放的时间,如图L,把它们都改为0.2。
L.jpg
好,接来下我们要来做文字的动画了。
先来给文字一个很炫的感觉。
选中“游园活动”图层,右键——图层样式——外发光。
如图M、N。
M.jpg
N.jpg
好,接下来,我们准备为文字制作4帧的变色动画。
但现在问题是整个动画才只有2帧,所以我们现在就要再多增加2帧出来。
在Imageready的动画窗口上,按键盘SHIFT键把2个动画帧选上,然后拖到新键帧的图标上,如图O。
O.jpg
好,现在你会看到动画窗口上有4个帧了。
接下来,我们把“游园活动”的图层也复制3个出来。
(只要把“游园活动”图层拖到图层面板下方的新建按键上就行)。
现在,我们在图层面板上就可以看到“游园活动”、“游园活动副本”、“游园活动副本2”、“游园活动副本3”。
如图P。
P.jpg
接下来,我们分别把“副本、副本2和副本3这3个文字层的文字改颜色。
最后,我们只需要把动画帧与图层的隐藏和显示顺序对接起来,这一步较容易,我就只做了个动画演示,供同学们参考。
如图Q。
Q.gif
好,最后,我们再来看看效果:
再看看效果:(加抠图照片,文字渐隐效果)1、从IR中打开动态素材图。
然后选择动画框中的第一帧(如果你选择中间的其他帧,等从PS修改图片后再回来,照片和文字就会上下左右的乱动,就不好看,也难改了)
2、从左边工具栏中,点击转到PS修改图
片。
3、打开照片,抠好图,调整好照片的亮度大小等,拖到素材里,注意把照片放到最上方。
因为照片要显示在每个帧的上面。
(如果素材中间抠空做相框,那么照片就要放到最下层)
4、再输入文字,放好位置后,再转到IR。
5、转到IR后,素材的每个帧要相对应每个图层,照片和文字层的眼睛不论哪一帧都开着。
这时播放一下动画,就能看到效果了。
6、下面把文字做渐隐效果,选择动画的最后一帧这里是第四帧,把这一帧对应
的文字图层前面的眼睛关闭,选择过渡,过渡五帧就差不多了。
好了,再播放一下动画,如果帧的速度要修改,可以自己再修改一下。
记住优化选择一下,再将优化结果保存为GIF格式就OK了。
第二个效果:(原动态图上文字多的修改)1、从IR中打开素材图,选择第一帧,转到PS,将每一个图层的原文字(也就是不需要的地方)用画笔选好颜色后涂抹,或者背景不清晰的,可以用其他方法来去除文字。
附:[转帖]图片去除文字的几个基本技法(动画演示)2、打开照片,用羽化框选照片后,拖到心型。
羽化后,边缘就不会非常明显了。
调整好位置和大小。
3、输入文字,设置好文字的样式。
照片和文字图层同样要放在素材图层的上方。
转入IR,将每一帧相对应的图层前的眼睛打开。
播放一下动画。
4、优化,将优化结果储存一下,OK。