论二维动画设计.docx

1、论二维动画设计南开大学成人高等教育 专升本毕业报告二维动画设计学 号：111364450001姓 名：赖幼华学 院：现代远程教育学院学习中心：海峡人才市场厦门发部奥鹏学习中心教学站：奥鹏学生不用填写专 业：计算机科学与技术完成日期：二O一三年三月二维动画设计摘要Flash 是一种二维矢量动画软件创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。Flash 特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点

2、的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。在视听语言统治的时代，任何一种叙述方式都逃脱不了MV的影响，Flash自然也不例外。在我和草原有个约定中借鉴了大量的影视手法表现我想要表现的主题和想要传达的情感。利用渐隐渐显、叠化、不同景别的组合，结合我的构思，使得这个MV表现的更生动，丰富。目录第一章 引言 1第二章 开发工具介绍 2 2.1 Flash 2 2.2 Photoshop 6 2.3 GoldWave 8第三章 总体设计 7 项目规划 9第四章 Flash

3、动画制作 8 4.1 设计思路及准备工作 10 4.3 动画等主要元件的制作 11 4.4 具体的制作步骤 12 4.5 MV的测试及保存 30第五章 所采用的技术 24 5.1 时间与帧数 31 5.2 动画空间感表现 31 5.3 flash动画中元件的应用 31 5.4 flash背景构图及层次问题 32 5.5动态按钮 32第六章 总结与展望 25参考文献 26致谢 27第一章 引言本毕业设计使用Flash制作了一个音乐动画，即Flash MTV, Flash 是当今Internet 上是最流行动画作品的制作工具，是美国Macromedia公司所设计的一种二维动画软件。通常包括Macr

4、omedia Flash，用于设计和编辑Flash 文档，以及Macromedia Flash Player,用于播放Flash 文档，Flash 特别适用于创建通过Internet提供的内容。FLASH是一个优秀的矢量绘图与动画制作软件，它秉承了矢量绘图软件的所有优点，能制作出声色俱佳的动画效果。强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画，PHOTOSHOP图片的色彩更加靓丽，使Flash具有更大的设计空间 现在很多网站很流行Flash MTV，它就是利用Flash 软件制作出来的MTV,因其具有动画的特点，又配有歌曲，文件较小，上传下载快，在网络上深受人们的喜爱和欢迎。作

5、为毕业设计，我们使用Flash 工具，为歌曲我的草原有个约定制作了一部MTV ，该歌曲源于戨手凤凰传奇的创作。第二章 开发工具介绍2.1 FlashFlash 是一种创作工具，设计人员和开发人员可使用它来创建演示文稿，应用程序和其它允许用户交互的内容，Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用Flash 创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画。您也可心通过添加图片、声音、视频和特效，构建包含丰富媒体的Flash 应用程序。Flash 特别适用于创始创建通过Internet担任的内容，因为它的文件非常小。Flash

6、 是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存相和存储空间小很多，因为它们是以数学公式而浊大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。2.1.2 Flash特点1.使用矢量图形和流式播放技术。与位图图形不同的是，矢量图形可心任意缩放尺寸而不影响图形质量；流式播放技术使得动画可以边播放边下载，从而缓解了网页浏览者焦急等待的情绪。2.通过使用关键帧和图形使得所生成的动画文件非常小，用在网页设计上不仅可以使网页更加生动，而且小巧玲珑下载迅速，使得动画可以在打开网页很短的时间里就得以播放。3.把音乐、动画、声效、交互方式融合在一起

7、，越来越多的人已经把Flash作为网页动画设计的首选工具，并且创作出了许多令人叹为观止的动画效果。而且在Flash中支持MP3的音乐格式，这使得加入音乐的动画文件也能保持小巧的身材4.强大 的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画，通过ActionScript可以实现交互性，使Flash具有更大的设计自由度，另外，它与当今最流利的网页设计工具Dreamweaver配合默契，可以直接嵌入网页的任一位置，非常方便。 2.1.2 Flash的发展方向Flash被称为是“最为灵活的前台”，由于其独特的时间片段分割（TimeLine）和重组（MC嵌套）技术，结合ActionScitp的对

8、象和流程控制，使得在灵活的界面设计和动画设计成为可能，同时它也是最为小巧的前台。Flash具有跨平台的特性（这点和Java一样），所以无论你处于何种平台，只要你安装了支持的Flash Player，就可以保证它们的最终显示效果的一致，而不必像在以前的网页设计中那样为IE或NetSpace各设计一个版本。同Java一样，它有很强的可移植性。最新的Flash还具有的手机支持功能，可以让用户为自己的手机设计喜爱的功能。当然首先必需要有支持Flash的手机，同时它还可以应用于Pocket PC。 那么，Flash可能的发展方向究竟如何？ 1、应用程序开发：由于其独特的跨平台特性、灵活的界面控制以及多媒

9、体特性的使用，使得用Flash制作的应用程序具有很强的生命力。在与用户的交流方面具有其它任何方式都无可比拟的优势。当然，某些功能可能还要依赖于XML或者其它诸如javascript的客户端技术来实现。但目前的现状是：很少有人具有运用Flash进行应用程序开发这方面的经验。但这个难度会随着时间的推移而逐步减弱。事实上，对于大型项目而言，使用Flash此时未免有些言之过早，因为它意味着很大的风险。当然，在最早的时间掌握和积累这方面的经验无疑是一种很大的竞争力。可以将这种技术运用在项目中的一小部分或者小型项目中，以减少开发的风险。 2、软件系统界面开发：Flash对于界面元素的可控性和它所表达的效果

10、无疑具有很大的诱惑。对于一个软件系统的界面，Flash所具有的特性完全可以为用户提供一个良好的接口。 3、手机领域的开发：手机领域的开发将会对精确（像素级）的界面设计和CPU使用分布的操控能力有更高的要求，但同时也意味着更加更广泛的使用空间。事实上手机和Pocket PC的分界已越来越不明显，开发者必须为每一款手机（或Pocket PC）设计一个不同的界面，因为它们的屏幕大小各有不同。当然软件的内核可能是相同的，所要注意的是各类手机CPU的计算能力和内存的大小。这无疑是些很苛刻的要求。 4、游戏开发：事实上，Flash中的游戏开发已经进行了多年的尝试。但至今为止仍然停留在中、小型游戏的开发上。

11、游戏开发的很大一部份都受限于它的CPU能力和大量代码的管理。不过可喜的是，Flash Player 7运行时性能提高了2至5倍；而且最新的Flash MX 2004 Professional提供了项目管理和代码维护方面的功能，Actionscript 2.0的发布也使得程序更加容易维护和开发。 5、Web应用服务：其实很难界定Web应用服务的范围究竟有多大，它似乎它拥有无限的可能。随着网络的逐渐渗透，基于客户端-服务器的应用设计也开始逐渐受到欢迎，并且一度被誉为最具前景的方式。但是，这种方式开发者可能要花更多的时间在服务器后台处理能力和架构上，并且将它们与前台（Flash端）保持同步。 6、站

12、点建设：事实上，现在只有极少数人掌握了使用Flash建立全Flash站点的技术。因为它意味着更高的界面维护能力和开发者整站架构能力。但它带来的好处也异常明显：全面的控制；无缝的导向跳转；更丰富的媒体内容；更体贴用户的流畅交互；跨平台和瘦客户端的支持；以及与其它Flash应用方案无缝连接集成等。 7、多媒体娱乐：其实，在这个方面无需再说什么。尽管它的发展速度没有像当初预言的那样迅速，但它仍然还在不断前进。Flash本身就以多媒体和可交互性而广为推崇。它所带来亲切氛围相信每一位用户都会喜欢。 flash影片的后缀名为 .swf ，该类型文件必须有flash播放器才能打开，但占用硬盘空间少，所以现在

13、被广泛应用于游戏。2.1.3 Flash中常用快捷键箭头工具 【V】 部分选取工具 【A】 线条工具 【N】 套索工具 【L】 钢笔工具 【P】 文本工具 【T】 椭圆工具 【O】 矩形工具 【R】 画笔工具 【B】 任意变形工具 【Q】 填充变形工具 【F】 颜料桶工具 【K】 滴管工具 【I】 橡皮擦工具 【E】 手形工具 【H】 缩放工具 【Z】, 新建FLASH文件 【Ctrl】+【N】 打开FLA文件 【Ctrl】+【O】 关闭 【Ctrl】+【W】 保存 【Ctrl】+【S】 另存为 【Ctrl】+【Shift】+【S】 导入 【Ctrl】+【R】 发布设置 【Ctrl】+【Shi

14、ft】+【F12】 发布 【Shift】+【F12】 撤消命令 【Ctrl】+【Z】 剪切到剪贴板 【Ctrl】+【X】 拷贝到剪贴板 【Ctrl】+【C】 粘贴剪贴板内容 【Ctrl】+【V】 粘贴到当前位置 【Ctrl】+【Shift】+【V】 清除 【退格】 复制所选内容 【Ctrl】+【D】 全部选取 【Ctrl】+【A】 取消全选 【Ctrl】+【Shift】+【A】 剪切帧 【Ctrl】+【Alt】+【X】 拷贝帧 【Ctrl】+【Alt】+【C】 粘贴帧 【Ctrl】+【Alt】+【V】 清除贴 【Alt】+【退格】2.2 Photoshop Photoshop是Adobe公司旗

15、下最为出名的图像处理软件之一，集图像扫描、编辑修改、图像制作、广告创意，图像输入与输出于一体的图形图像处理软件，深受广大平面设计人员和电脑美术爱好者的喜爱。在制作过程中，总会有一些图片需要处理，有些图片在flash中处理会很麻烦，这时就要借助Photoshop工具来进行辅助，Photoshop能对位图图像进行编辑加工处理以及运用一些特殊效果，其重点在于对图像的处理加工。在表现图像中的阴影和色彩的细微变化方面进行一些特殊效果处理。制作出的图片色彩绚丽，效果十分好。多数人对于PHOTOSHOP的了解仅限于“一个很好的图像编辑软件”，并不知道它的诸多应用方面，实际上，PHOTOSHOP的应用领域很广

16、泛的，在图像、图形、文字、视频、出版各方面都有涉及。请看下面介绍：平面设计平面设计是PHOTOSHOP应用最为广泛的领域，无论是我们正在阅读的图书封面，还是大街上看到的招帖、海报，这些具有丰富图像的平面印刷品，基本上都需要PHOTOSHOP软件对图像进行处理。修复照片PHOTOSHOP具有强大的图像修饰功能。利用这些功能，可以快速修复一张破损的老照片，也可以修复人脸上的斑点等缺陷。广告摄影广告摄影作为一种对视觉要求非常严格的工作，其最终成品往往要经过PHOTOSHOP的修改才能得到满意的效果。建筑效果图后期修饰在制作建筑效果图包括许多三维场景时，人物与配景包括场景的颜色常常需要在PHOTOSH

17、OP中增加并调整。绘画由于PHOTOSHOP具有良好的绘画与调色功能，许多插画设计制作者往往使用铅笔绘制草稿，然后用PHOTOSHOP填色的方法来绘制插画。除此之外，近些年来非常流行的像素画也多为设计师使用PHOTOSHOP创作的作品。绘制或处理三维帖图在三维软件中，如果能够制作出精良的模型，而无法为模型应用逼真的帖图，也无法得到较好的渲染效果。实际上在制作材质时，除了要依靠软件本身具有材质功能外，利用PHOTOSHOP可以制作在三维软件中无法得到的合适的材质也非常重要。婚纱照片设计当前越来越多的婚纱影楼开始使用数码相机，这也便得婚纱照片设计的处理成为一个新兴的行业。视觉创意视觉创意与设计是设

18、计艺术的一个分支，此类设计通常没有非常明 图标制作虽然使用PHOTOSHOP制作图标在感觉上有些大材小用，但使用此软件制作的图标的确非常精美。界面设计界面设计是一个新兴的领域，已经受到越来越多的软件企业及开发者的重视，虽然暂时还未成为一种全新的职业，但相信不久一定会出现专业的界面设计师职业。在当前还没有用于做界面设计的专业软件，因此绝大多数设计者使用的都是PHOTOSHOP。 上述列出了PHOTOSHOP应用的13大领域，但实际上其应用不止上述这些。例如，目前的影视后期制作及二维动画制作，PHOTOSHOP也有所应用的。从功能上看，Photoshop可分为图像编辑、图像合成、校色调色及特效制作

19、部分。 图像编辑是图像处理的基础，可以对图像做各种变换如放大、缩小、旋转、倾斜、镜像、透视等。也可进行复制、去除斑点、修补、修饰图像的残损等。这在婚纱摄影、人像处理制作中有非常大的用场，去除人像上不满意的部分，进行美化加工，得到让人非常满意的效果。校色调色是photoshop中深具威力的功能之一，可方便快捷地对图像的颜色进行明暗、色编的调整和校正，也可在不同颜色进行切换以满足图像在不同领域如网页设计、印刷、多媒体等方面应用。特效制作在photoshop中主要由滤镜、通道及工具综合应用完成。包括图像的特效创意和特效字的制作，如油画、浮雕、石膏画、素描等常用的传统美术技巧都可藉由photoshop

20、特效完成。而各种特效字的制作更是很多美术设计师热衷于photoshop的研究的原因。 2.3 GoldWaveGoldWave是一款功能强大的声音编辑软件，支持wav、mp3、wma、ogg等十多种音频格式，具有剪辑声音、录音、从CD碟上抓音轨、改变音量、改变音调、改变播放速度、添加声音特效等众多功能，而且操作非常简单。第三章 总体设计项目规划运用Flash制作MTV是一个非常新颖的项目，给人以视觉上的全新感觉，规划系统功能模块如下：(一) 动画模块片头：主要是告诉观众本MTV歌曲的名称、演唱者，MTV制作者等信息；MTV内容：表现歌曲意义，突出主题，表达情感，有完整的故事情节； 片尾：标明本

21、MTV的制作目的，示意歌曲结束。（二）音频模块音乐：就是我们所到的优美的声音歌词：歌曲以文字的形式，显示出来的一种方式结构图如下： 第四章 Flash 动画制作4.1 设计思路及准备工作4.1.1剧本的确定一个的好剧本是MV制作的灵魂，只有根据剧本才能指挥角色、元件、影片剪辑等元素进行演出，所以首先要确定剧本。根据音乐我和草原有个约定为主题，编写了以下剧情。小女孩也就是主人公，从小离开家乡，到了城市，由于对草原生活的留恋，在上网时也经常搜草原风景图片看，连做梦都希望去草原，可心看出主人公非常向往大草原生活，于是她决定去大草原去一趟，就这样她坐着汽车去汽车站，然后乘活车去草原，到了草原看到了草原

22、的广阔，当地的风情和美丽的景色，骑上了马快乐的奔跑，终于完成自己的心愿 ，于是她笑了，所有的事物都显得那么有活力了。4.1.2素材、图像、元件的准备素材、图像、元件的选择和准备工作是FLASH动画成功的基石，好的设计，不仅要考虑图片、场景、人物颜色的搭配，更要在人物的神态和动作上多下功夫，做到协调、一致、和谐。在此阶段不仅要耗费大量时间和精力搜寻素材，有时更要亲手制作 利用滤镜制作各种文字特效，利用Photoshop制作处理场景图片，利用Flash制作各种元件及矢量图像等为后期的工作做准备。素材非常重要，在一个MTV中，风格一定要统一，不然看上去会杂乱无章，很不美观。在这个毕业设计中，我用的图

23、片风格都是矢量的，有一部分图片是在网上搜的，用ps处理了一下，有一些是我用PS画的，也有一部分需要做动画的是在flash里面画的。音乐是MP3格式的，由于音乐中间停留时间较长，因此我把音乐剪辑成三段，把中间的一部分去掉，然后对需要保留的部分做了淡入淡出效果。4.2导入音效和歌词 FLASH MV制作的关键是影音同步及歌词同步，将选择好并经过处理的的相关音效，文字歌词，等导入FLASH文件内。个人很喜欢根据音乐歌词寻找灵感，在音乐不同的阶段安排场景和角色，这样能使做出来的动画更符合音乐的基调和感情。整体上更和谐。根据音乐把相关的歌词填入场景中，做好歌词同步。添加歌词的基本步骤如下：1、计算出歌曲

24、的总帧数，然后根据内容歌词长度为场景添加帖数，帖数以12帖/秒计算。2、在时间轴新建一层，命名为Word，循环听歌，选择每句歌词开始唱的帧，在属性面板的帧标签处输入“第一句”在合适的位置插入标签。效果如图所示3、依次对其它歌词添加帧标签并添加歌词4.3 动画等主要元件的制作MV中涉及很多特效及动画效果，我都是用图形元件和影片剪辑做成的，如：花瓣摇摆、蒲公英、遮罩、纸片、马的运动、泡泡、按钮、头发飘动等效果。根据音乐结合剧本创作这些动画效果及特效。按照不同的层次和顺序导入到场景中去，充分发挥自己的想象空间，做成一个完整的小动画、小故事。4.4 具体的制作步骤片头的制作1、插入/元件，打开对话框，

25、更改元件名称为信息，元件类型为影片剪辑。2、在影片剪辑内部，选择工具，输入文字“我和草原有个约定”，设置字体为华文行楷，字体大小为52，颜色为蓝色3、新建一个影片剪辑，命名为歌手，输入凤凰传奇，设置字体大小为28，颜色为蓝色，字体为华文行楷。4、新建一个影片剪辑，命名为制作：输入制作人名称，设置字体大小为28，颜色为蓝色，字体为华文行楷。5、新建一个影片剪辑，命名为QQ，并输入QQ信息。6、新建一个图层，重命名为歌名，在第40帧时按下F5,将影片延长到第40帧，将歌名影片剪辑放置到舞台，为其添加发光，斜角滤镜，然后在第10帧插入关键帧，单击010之间的任何一帧右击，创建动画补间按Q键，选择自由

26、变形工具，缩放影片大小，然后调整为并修改第1帧时影片的alpha值为0%，这样就可以看到歌名由远及近的效果。7、新建一个图层，重命名为制作，选择第10帧按F7，插入一个空白关键帧，将制作元件放置到舞台上，为其添加渐变发光滤镜，在第23帧按F6插入关键帧，调整第10帧的位置，使其放在歌名的后面，然后将其alpha值改为0%，在1023帧间创建动画补间，制作掉下来的效果。8、同制作一样，为演唱元件作补间动画。9、新建一个图层重命名为QQ，在25帧插入关键帧将QQ拖入舞台，放置到合适的位置，在38帧插入关键帧，调整25帧的位置，在2538帧间右击，创建动画补间，在属性面板并设置为顺时针旋转，旋转次数

27、为1次10、新建影片剪辑，命名为马，进入影片编辑，用钢笔工具分别在1-8帧绘制马运动的不同状态的外形，设置画笔大小为1，然后填充白色，在用直线或钢笔工具勾出马身上的运动动态，设置画笔大小为0.5，实线。11、选择这8帧，右击复制帧，在第9帧右击粘贴帧，然后翻转帧。12、在库中选择马影片剪辑，右击直接复制，重命名为马副本，进入影片剪辑编辑状态下，使用填充工具，将马改为综色。13、回到主场景中，新建一图层，重命名为马。将马和马副本影片剪辑放置到舞台左侧，然后调整其大小。14、新建一图层，选择第40帧，按F9打开动作面板，为其添加代码stop();15、插入/影片剪辑，新建一个按钮，选择第一帧，即弹

28、起下面的帧，在舞台中输入play，设置一个独特的字体，大小和颜色为32和紫色，ctrl|+B将字体打散，然后在指针经过时调整文字的颜色为前蓝色，在按下时为蓝色。16、回到主场景，新建一个图层，选择第40帧，右击插入空白关键帧，将play按钮放置到场景中，在舞台上选择play按钮，按F9打开动作窗口，为其添加代码17、片头的最终效果如图场景1的制作1、Ctrl+F8,新建一个影片剪辑，并命名为背景1，进入影片编辑状态，将草原1放置到舞台上，将草放置到背景的下端，在第3帧时插入关键帧，选择草原图片，执行修改/变形/水平翻转，然后在第5帧插入帧，这样草晃动的效果就出来了。2、新建一个影片剪辑，命名为

29、蝴蝶1。将蝴蝶图片拖到舞台上,ctrl +B将其打散，选择套索工具下的魔棒工具并设置其容差，将白色的背景抠掉，然后使用套索工具，选择一半的蝴蝶，将其删除3、选择图层1的第一帧 右击复制帧，然后新建一图层，在第1 帧上右击粘贴帧，然后执行修改/变形/水平翻转。4、调整图层2和图层2的位置，使其看上去是一个整体。然后分别调整旋转和倾斜角度对其变形，在第8帧时再次调整。在1-8帧间任何一帧右击创建形状补间动画。其它蝴蝶制作同蝴蝶的制作。5、新建影片剪辑，将做好的几个蝴蝶分别放置到舞台上，调整其出现的先后顺序并做动画补间。选择一个蝴蝶层，单击图层面板下面的，按钮，为其添加引导层，用钢笔工具绘制路径，在

30、蝴蝶的两个关键帧处，调整蝴蝶的位置，将其中心放置到引导线上，这样蝴蝶就会沿着路径运动。同样制作其它蝴蝶，然后调整其出现的先后顺序。为其它蝴蝶绘制引导路径，几个蝴蝶的路径在错落有致，让画面生动活泼起来。6、新建两个影片剪辑云1和云2，在云2中用钢笔工具绘制出云的形状，封闭路径，填充白色。7、将云2拖入云1中，命名图层为云，在170帧处，按F5插入帧使影片延长至此。复制一个云，合适的位置，然后调整这两个云的alpha值。8、新建云01云04图层，分别将云放置到舞台，调整这几个层的云的大小和alpha值小一点，在170帧处插入关键帧，将云的大小和alpha值调大点，这样近大远小，近实远虚的效果就出来

31、了。9、新建一个图形元件，命名为蒲公英元件，用椭圆工具绘制一个正圆，选择油漆桶工具下的中心渐变选项，在颜色面板调整颜色为白色，然后调整颜色的不透明度为98%和22%，调整色块的位置使渐变自然些。10、新建一个图层，用钢笔工具绘制出一个矩形，然后用部分选择工具和选择工具改变形状，为其添加由内向外的白色到透明的渐变色。选择这个形状，然后选择变形工具，移动其中心点到蒲公英的的圆心的位置，从窗口中调出变形面板，复制一个图形，输入旋转，确定，图形就人旋转一定的角度，然后在单击下面的按钮，图形就会按照刚才的角度旋转变化，最终使其成为一个圆的形状。 11、新建一图层，用钢笔工具绘制出蒲公英的杆，然后为其添加渐变色，然后将图层移到最下层。12、新建一个影片剪辑命名为蒲公英，然后将蒲公英元件放置到舞台上，ctrl +K，打开对齐面板，使其居中对齐。13、新建一个影片剪辑命名为小鸟，在1-5帧绘制小鸟飞翔的各个动作，按