Photoshop使用手册怎样制作动画GIF
Photoshop PlaybookHow to Create Animated Gifs
我的教程中大多数要做的
Most of the requests that i get for tutorials
都是我曾经遇到过的问题
are problems that i’ve bumped into myself.
但不得不承认 当我要做一个生动的gif图时
But i have to admit when it comes to creating an animated gif
这是我之前从来没有用PS做过的
it’s something i’d never done in photoshop before.
我将向大家展示我的制作过程
So let me show you what i came up with.
在此过程中我学到了很多
I learned a lot along the way.
当然我也欠缺很多
But i’m sure there are a lot of things i miss, too.
所以希望你们向我指出
So i’m counting on you
一些使用说明和技巧
to point out some of your tips and tricks to me.
那么 让我们从Bridge开始 我可以敲空格键
So let’s start in Bridge where i can hit the Space bar,
看看如何将这两帧简单图片制作成动画
and see my simple two frames that i want to animate.
我要让这个小家伙在动画中大叫
I try to make this little guy bark in an animation.
现在我们打开photoshop
Now we’ll move over to the photoshop
然后把它们连接在一起
and link’em togother.
在photoshop里 我要把原件放在一起
In photoshop, i wanna come down to Scripts,
把文件加载进去
Load Files Into Stack.
主要是创建多层文件
Essentially, that’s just making multiple Files layers.
打开我的文件
I’m gonna Select my Files,
选择对齐
and while i can Align these here,
我将向你们手动演示如何在PS里做
I’m gonna show you how to do it manually in photoshop.
Photoshop将这两个文件加载到图层中
Photoshop loads those two files in as layers
我可以切换他们
and i can toggle them
我们能看到这两张图片没有对齐
and confirm they are pretty far out of alignment.
所以我要按住shift单击它们
So i’m gonna shift+click them,
选择编辑 自动对齐
come over here to edit it, Auto-Align
确认后它将自动调整
and i’m just gonna leave that on auto.
现在所有的常见目录都排列在这里
And all of the common content will line up now.
当我切换它的时候 看上去更棒了
So now when i toggle it, it looks much better.
使用裁剪工具
I just take my Crop Tool
剪掉重叠部分
and crop any of these overlapping areas.
慢慢将裁剪框贴近这个小家伙
It’s a good opportunity to come a little bit tighter on this guy here.
接下来我要做的是到时间轴这里
And next thing i wanna do is come down here to my Timeline.
这里已经添加了几张不同的选项
And i’ve got a couple of different options here.
我可以创建一个视频时间轴或者一个动画
I can Create Video Timeline or a Frame Animation.
我要创建一个框架动画
I’m gonna Create Frame Animation
我要忽略在左边看到的东西
and i’m just gonna ignore what i see on the left there.
我要它到这里消失
I’m gonna come over here to Flyout
并且把图层做成帧
and make frames from layers.
我要用这两个图层创建动画
It’s gonna take those two layers and create frames.
这些帧 我要变换一下时间
And those frames, we’re gonna change the time.
我们让它每个持续0.2秒
Let’s go with 0.2 seconds for each one.
设置永久循环
And let’s have them Loop Forever.
做好后 我们可以回放
And when we’re ready, we’ll play that back
这有点快了
That’s a little fast.
现在我们回来再设置 0.5秒
Let’s go back and change, to half a second.
看起来不错 这是我想要的效果
Looks good. That’s what i intended to do
现在我们已经做好了
Okay, so now when we’re ready,
我们需要把这个动图导出photoshop
we need to get the gif out of photoshop.
那样 我们就能保存在网站上了
For that, we’re gonna go to Save For Web.
这里有几个不同的选项
I’ve got a few different options here.
我选择了gif并没有改变其他的选项
I’ve Selected gif i haven’t changed anything else.
保存 命名为Bark
I’m just gonna save this and let’s call it “Bark”.
理论上来说 我可以打开这个动图
Now theoretically, i should be able to take that gif
并且把它拖到任意的网络浏览器
and drag it onto any web browser.
这个动图应该可以重放
And the animated image should play back.
我们来看看做得怎么样
Let’s see what happens.
这是我的文件
Here’s my File.
拖动它
And i’ll just Drag that,
到我的网络浏览器
onto my Web Browser.
浏览器启动 我得到了理想的效果
Browser launches and I get exactly what I was hoping for.
这是一类非常流行的审美
So this is a really popular aesthetic,
你看到了所有环节
you see it all over the places.
我相信还有很多方法可以做出这种效果
I’m sure there’re better ways to do this,
我在创作中学到了很多
but i learned a lot in creating mine.
我再次希望
And again i’m hoping you’ll share
你们能向我分享一些反馈 建议和技巧
some of your feedback and tips and tricks with me.