Photoshop制作帧动画

Photoshop制作帧动画

作者：闵绘宇

来源：《软件导刊》2013年第02期

摘 要：Photoshop是目前应用最广泛的平面设计软件之一，主要是进行二维静态图像的处理和合成，由于其强大的图像处理功能和方便的操作界面，深受用户青睐。随着Photoshop版本的升级，该软件也具备了动画制作的功能。介绍了Photoshop帧动画的制作原理，以及它所具有的独特的动画表现特点。

关键词：动画；帧；photoshop；图层

中图分类号：TP317.4 文献标识码：A 文章编号：16727800（2013）002013402 0 引言

动画就是用多幅静止画面连续播放，利用视觉暂留形成连续影像。比如传统的电影，就是用一长串连续记录着单幅画面的胶卷，按照一定的速度依次用灯光投影到屏幕上。当然这里有一个速度要求，如果速度太慢，观众看到的就等于是一幅幅轮换的幻灯片。 为了让观众感受到连续影像，电影以每秒24张画面的速度播放，也就是1s内在屏幕上连续投射出24张静止画面。动画播放速度的单位是fps，其中的f就是英文单词Frame（画面、帧），p就是Per（每），s就是Second（秒）。用中文表达就是多少帧每秒，或每秒多少帧。电影是24fps，通常简称为24帧。

关于制作动画的软件，当然要数flash，它是制作二维动画的专业软件。然而，Photoshop作为平面设计的专业软件，随着版本的升级也具备了制作动画的功能，不再借助捆绑的ImageReady软件。Photoshop CS3 Extended（扩展）版本及以上版本都具备了制作动画的功能，与flash相比，Photoshop制作出来的动画只能称作简单动画，这主要是因为其只具备画面而不能加入声音，且观众只能以固定方式观看。但简单并不代表简陋，虽然前者提供了更多的制作和表现方法，但后者仍然具备自己的独特优势，如图层样式动画就可以很容易地做出一些其它软件很难实现的精美动画细节。 1 帧动画 1.1 帧动画的概念

逐帧绘制帧的内容称为逐帧动画，简称帧动画。由于是一帧一帧的制作，所以逐帧动画具有非常大的灵活性，几乎可以表现任何想表现的内容。它类似于电影的播放模式，很适合表演细腻的动画。例如：人物或动物急剧转身、 头发及衣服的飘动、走路、说话以及精致的3D效果等等。

龙源期刊网 http://www.qikan.com.cn

1.2 逐帧动画制作

下面以“旋转直线”为例，详细讲解一下Photoshop逐帧动画的制作过程。

（1）新建一个150×150像素的空白图像，然后，新建一个图层并画一条垂直的直线，如图1所示，图层控制面板如图2所示。

（2）选择【窗口→动画】菜单项，开启动画控制面板。

（3）在动画控制面板中点击“复制所选帧”按钮，就会看到新增加了一个帧。如图3所示。按照Photoshop的习惯，这个图标应该表示为新建，如新建图层等，在这里虽然字面上的解释是复制，但其实也是一种新建，只不过这新增加出来的帧其实和前一个帧是相同的内容。 （4）为了做出直线绕中心点旋转的动画效果，要确定几个关键位置，因此，复制图层1的直线做自由变换，以30°为一个单位顺时针旋转（当然间隔单位越小做出的效果越流畅），复制5个副本，旋转角度分别是30°、60°、90°、120°、150°，设置好后图像窗口显示效果如图4所示。

（5）在动画控制面板中设置动画效果，借助于图层的显示/隐藏属性来设置。先将图层全部隐藏（除了背景层），动画第1帧显示图层1，动画第2帧显示旋转30°图层，按照步骤（3）创建下一帧，依次设置第3帧、第4帧、第5帧、第6帧，然后将原有的时间间隔10s改为0.1s，循环选项“一次”改为“永远”，设置好的动画控制面板如图5所示。这时点击动画控制面板中的播放按钮就可以查看动画效果了。

（6）保存文件。【文件→存储】可以将动画设定保存起来，文件格式为psd。这种文件格式是Photoshop专有的，可以记录所有的相关信息，保存为该格式可以方便以后修改。如果需要能用于网页的独立动画文件，则需要使用【文件→存储为Web和设备所用格式】，保存为gif文件。 2 结语

Photoshop虽然没有flash那么强大的动画功能，但是在动画细节表现方面有其特有的优势，被应用在制作QQ表情、网站标志、手机彩信动态图片等方面。本文通过制作旋转直线实例，详细讲解了Photoshop帧动画制作方法，使读者全面、深入地了解了动画制作的过程和原理。

参考文献：

＼[1＼] 九州书源.Photoshop CS3图像处理＼[M＼].北京：清华大学出版社，2011. ＼[2＼] 矫桂娥.Photoshop CS3实例教程＼[M＼].北京：清华大学出版社，2012.

龙源期刊网 http://www.qikan.com.cn

＼[3＼] ＼[EB/OL＼].http：//www.wzsky.net/html/Photo/psjc/psgif （责任编辑：杜能钢）