片头动画设计.docx
《片头动画设计.docx》由会员分享,可在线阅读,更多相关《片头动画设计.docx(28页珍藏版)》请在冰点文库上搜索。
片头动画设计
泰州广播电视大学泰兴分校
毕业设计(论文)报告
题目:
网站片头动画
学生姓名:
******
学号:
***********
专业:
计算机应用技术
班级:
06计算机
指导教师:
***********
2011年04月
前言
FLASH是由美国Macrlmedia公司出品的用于矢量图编辑和动画创作的专业软件。
FLASH软件主要用于动画制作,使用该软件可以制作出网页交互式动画,还可以将一个较大的交互式动画。
FLASH还被广泛用于多媒体领域,如交互式软件开发、产品展示等多个方面。
随着FLASH的广泛使用,出现了许多完全使用FLASH制作的多媒体作品。
由于FLASH具有支持交互、文件体积小、效果棒等特性,并且不需要媒体播放器之类软件的支持,因此这样的多媒体作品取得了很好的效果,应用范围不断扩大。
FLASH是一个优秀的矢量绘图与动画制作软件,它秉承了矢量绘图软件的所有优点,能制作出声色俱佳的动画效果。
强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画,PHOTOSHOP图片的色彩更加靓丽,是FLASH具有更大的设计空间。
本设计主要是用flashMX多媒体制作软件制作的一个简单的MTV,其主要有两部分组成,即动画和音频两部分。
利用这种多媒体软件来制作MTV。
用flash软件做出的动画作品,其最大的特点是它能够把一些矢量图、位图和歌词、文字做成交互性很强的动画,不仅具有视觉和听觉的双重感受,使其更具有趣味性和创造性。
目录
前言
第一章FLASH动画应用现状4
1.1FLASH在影视制作(片头或片尾)中的应用1
第二章FLASH的应用领域及发展方向5
2.1FLASH的应用领域5
2.2FLASH的发展方向6
第三章关于本设计7
3.1任务分析7
3.1.1流程设计7
3.1.2选材7
3.1.3素材准备7
3.2任务实现8
3.2.1制作进度条8
3.2.2制作loading9
3.2.3创建场景210
3.2.4制作进入网站的按钮元件21
3.2.5完善场景22
3.2.6测试影片22
第四章综合总结23
参考文献24
结束语25
第一章FLASH动画应用现状
1.1FLASH在影视制作(片头或片尾)中的应用
影视作品正在以一个不可忽视的重要力量日新月异的发展着,而影视片头又是影视作品的给观众的第一印象。
任何一个风格独特、富于个性化的影视片头都是画面视觉艺术巧妙结合的典范,它包含着多方面、多视角的综合知识,可能是历史方面的,或者是时尚方面的。
新技术的不断出现,强烈的开拓着视觉传达的延伸之一影视片头的创作,为其提供了更强大的物质基础和广阔的创作可能。
同时也对影视片头的创作提出了更新更高的要求:
一方面,技术的发展为创作者提供了更多的可能性,也迫使设计者不断的挑战影视片头的表现极限,另一方面,也促成了观众审美需求的提高,反过来促进创作上的进步。
影视片头的视觉艺术是具有电影特性的美术设计。
是一种具有思维空间形状的艺术造型。
FLASH技术在国外的应用层次比较高,从动画、MTV、网络广告到电子商务的应用都涉及到FLASH技术的方方面面。
目前国外一些世界大公司为建立良好品牌形象的在线内容和应用,他们运用了MacromediaFlash5和Dreamweaver4技术构建内容丰富的电子商务网站,例如福特电动公司、七喜公司和索尼公司也在其中,并且创造性的利用互联网技术向他们的顾客做宣传。
第二章FLASH的应用领域及发展方向
2.1 FLASH的应用领域
FLASH技术不断推陈出新,继席卷网页设计、网络广告之后,电影、电视、卡通、声乐将是它下一步引领风骚的舞台。
FLASH从网络走向电影、电视、卡通、声乐,推动了传统媒体和互联网媒体的融合。
网页设计者开始利用网络技术为商业、音乐电视和电视节目工作。
在网络电影领域,FLASH技术自1997年由MACROMEDIA推出后,逐渐受到好莱坞制片公司的青睐,增加了微型电影和基于网络的电影制作,用它设计迷你电影与网络电影。
宝马汽车推出的网络电影系列也是靠FLASH主战,其中就有李安导演的"卧虎藏龙"。
在中国,闪客皮三为某电影已经制作FLASH短剧。
在电视广告领域,NETZERO公司官员日前说,最近他们运用MACROMEDIA公司的FLASH软件制作了即将在黄金时段播出的电视广告宣传片,这种方式为公司节省了210万美元的制作成本。
这段即将在哥伦比亚广播公司(NBC)转播NBA总决赛期间播出的具有"革命性"意义的广告片预计将在本周洛杉矶湖人队同费城76人队之间的比赛中播出。
NETZERO公司首席行销官布赖恩•伍兹说MACROMEDIA公司的FLASH软件为他们节约成本开辟了道路。
伍兹说:
"我们的技术人员采用本来用于网络的技术只花了正常制作成本的一小部分就完成了一系列高质量广告片的制作。
简单地说,NETZERO公司只花费了电视广告片正常制作成本的大约2%,从而使广告制作成本与花在购买媒体时段的费用之间的比例更为合理。
"
在电视卡通剧领域,NELVANA的第一项新产品名叫"WHENQUADSWON`TLEAVE",是世界上第一部完全由MACROMEDIA公司的FLASH软件制作的电视系列剧。
该剧每集半小时,由JOHNCALLAHAN以反映他轮椅生活的幽默漫画为蓝本创作,将于加拿大TELETOON电视台黄金时段播FLASH之所以受欢迎在于大幅降低成本与时间。
KIMBERG说,FLASH制作的节目可以同时在网络与电视台播出,一片两播,符合经济效益。
他同时透露,半小时节目若用FLASH技术制作,大约3至4个月就可杀青,若是其它技术,通常需要10-14个月。
在音乐领域,FLASHMV更好的提供了在唱片宣传上既保证质量又降低成本的有效途径,并且将成功的把传统的唱片宣传推广带到电脑网路的更大空间。
流行歌手BECK与DURANDURAN以FLASH制作的MTV可以同时在网络与电视台播出。
在游戏领域,索尼公司也宣布它将把这项技术用于制作PLAYSTATION2的片头。
此外由于它能够减少游戏软件中的电影片段所占数据容量,因此预计将为DVD游戏软件节省更多的空间。
2.2 Flash的发展方向
Flash被成为是“最为灵活的前台”,同时它也是最为小巧的前台。
Flash具有跨平台的特性,所以无论处于何种平台,都能保证最终显示效果一致。
应用程序
操作系统界面
3、手机领域的开发
4、游戏开发
5、Web应用服务
6、站点建设
7、多媒体娱乐
第三章关于本设计
3.1任务分析
网站片头一般只是起一个引导和展示的作用,其本身并不包含太大的信息量,在其中出现的图片及文字一般都要遵循简洁明了的特点,以便师观者直观地认识到所要进入网站的一些信息,并通过这些信息来加深观者对此站点的印象。
网站片头要短小精悍,其时间大约只有几十秒,但在这短短的时间之内就要表现出网站的精华所在,使浏览者对网站有一个大体的印象和认识即可,如果时间太长会引起浏览者的疲倦,从而失去等待的耐心。
在网站片头中最好加上一个跳转的网站内页按钮,这样方便一些不想观看网站片头,需要直接进入网站查找信息的浏览者,容易引起他们的好感。
3.1.1流程设计
首先设置动画背景并制作进度条,再创建场景2,制作进入网站的按钮元件;然后完善场景;最后保存文档并测试动画。
3.1.2选材
相册是我们实际生活中不可缺少的一部分,在情绪低落、高涨等任何时候都会有人通过相册的欣赏发泄自己的情感与思想,现代人都喜欢通过动画的方式表现自己的实际生活,带着一种思想、情感把所看的人感染,同时也可释放出作者内心深处的某种情绪。
因此我便选择了这样的一个主题。
我结合着现实生活中的很多情景便构造了这部flash相册。
虽然构造的不是怎么好,但是它却流露出我们的一些心情。
3.1.3素材准备
这是工程最庞大的一块,当靠flash是远远不够的,还需要用到photoshop等软件。
不同的情景需要不同的场景衬托。
又要考虑到整体的色彩的搭配,因此背景构图是相当费神的。
考虑在flash里手绘,对每个动作的绘制都要很仔细才行,不然会有很多不协调与搭配。
在场景中也涉及到很多小的修饰。
为了使其真实、形象有的则是通过图片再进行特殊的处理放入场景中去的。
在FLASH中开发产品外观很容易,人们可以在短时间内为角色,道具或者背景制作出很多不同的版本。
通过调整,转换或者忽略去角色的外貌特征就可以创作出很多不同的版本。
通过调整,转换或者略去角色的外貌特征就可以创作出很多变体。
也可以扫描一幅或多幅画稿的合成图,然后对其进行调节。
还可以把角色快速地放在不同的背景中,以查看它们在一起的效果。
在FLASH中开发产品的一个主要原因就是可以在整个过程中自始自终地处在一个程序中来解决各种问题,FLASH可以制作元件化的资产。
3.2任务实现
3.2.1制作进度条
1、运行FlashCS4,新建一个Flash空白文档。
执行“修改-文档”命令,打开“文档属性”对话框,将“尺寸”设置为778像素(宽)*390像素(高),“背景颜色”设置为灰色(#666666),如图1-1所示。
图1-1“文档属性”对话框
设置完成后单击“确定”按钮。
2、执行“文件-导入-导入到舞台”命令,将一副背景图像导入到舞台中。
3、新建一个“图层2”,使用“线条工具”与“椭圆工具”在舞台中绘制出如图1-2所示的图形。
图1-2绘制图形
4、再新建一个“图层3”,使用“文本工具”在舞台上输入文字“JIAYUAN”,字体选择“Verdana”,字号为16,字体颜色为白色。
5、使用“文本工具”在刚输入的字母右边输入“家园”两个字。
字体选择“方正黑体简体”,字号为32,字体颜色为白色,如图1-3所示。
图1-3输入文字
6、执行“插入-新建元件”命令,或者按下Ctrl+F8组合键,打开“创建新元件”对话框,在“名称”文本框中输入“进度条”,在“类型”下拉列表中选择“影片剪辑”选项,完成后单击“确定”按钮进入影片剪辑编辑区。
7、使用“矩形工具”在编辑区中绘制一个边框为灰色(#CCCCCC)、填充色为白色,宽和高分别为100像素与10像素的矩形,然后在时间轴上的第100帧处插入帧。
8、选中矩形中的填充色,单击鼠标右键,在弹出的菜单中选择“剪切命令,然后新建一个图层,在舞台的空白处单击鼠标右键,在弹出的菜单中选择“粘贴到当前位置”命令,完成后在“图层2”的第100帧处插入关键帧。
9、选中“图层2”第1帧中的内容,在“属性”面板中将它的宽度设置为1像素,然后选中第1帧,单击鼠标右键,在弹出的快捷菜单中选择“创建补间形状”命令,如图1-4所示,即可在第1帧与第100帧之间创建形状补间动画。
图1-4选择“创建补间形状”命令
3.2.2制作loading
1、回到主场景,新建一个图层,并把它命名为“进度条”。
从“库”面板里将影片剪辑“进度条”拖入到舞台上。
然后再“属性”面板中把它的实例名设置为“进度条”。
2、选择“文本工具”,在“属性”面板上的“文本工具”下拉列表中选择“动态文本”选项。
3、在“进度条”上方单击鼠标创建一个动态文本框,然后再“属性”面板中将动态文本框的变量名设置为“loadtxt”,。
4、新建一个图层,并把它命名为“Action”,选中该层的第1帧,在“属性”面板中将帧标签设置为“play”。
5、选择“Action”层的第1帧,执行“窗口-其他面板-动作”命令,打开“动作”面板,在“动作”面板中输入如下代码:
total=_root.gerBytesTotal();
loaded=_root.getBytesLoaded();
load=int(load/tltal*100);
loadtxt=”loading”+load+”%”;
_root进度条.gotoAndStop(load);
6、在“Action”层的第6帧处插入关键帧,然后在“动作”面板中添加如下代码:
If(loaded==tltal){
gotoAndPlay(“场景2”,1);
}else{
gotoAndPlay(“play”);
}
3.2.3创建场景2
1、执行“窗口-设计面板-场景”命令,打开“场景”面板,在“场景”面板中单击“添加场景”按钮新建场景2。
2、在场景2的编辑状态下,按照场景1中制作背景和文字的方法,将背景与文字制作出来。
3、按下Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“al”,如图1-5所示,完成后单击“确定”按钮。
图1-5新建影片剪辑
4、在影片剪辑“al”的编辑状态下,使用“线条工具”在工作区中绘制出如图1-6所示的几何图形,并将其填充为灰色(#B5B5B5),
然后把几何图形的边框线删除,最后在时间轴上的第20帧处插入帧。
图1-6绘制图形
5、新建一个图层,使用“矩形工具”在几何图形的下方绘制一个无边框、填充色为任意色、宽和高分别为411像素与4像素的矩形。
6、在“图层2”的第4帧处与第10帧处插入关键帧。
然后选中第4帧处的矩形,使用“任意变形工具”将其高度拉伸至164像素,选中第10帧处的矩形,使用“任意变形工具”将其高度拉伸至207像素,如图1-7所示。
图1-7拉伸矩形
7、分别在“图层2”的第1帧与第4帧之间、第4帧与第10帧之间创建形状补间动画。
8、选中“图层2”,单击鼠标右键,在弹出的菜单中选中“遮罩层”命令。
9、新建一个图层,并在该层的第6帧处插入关键帧,然后使用“线条工具”在工作区中绘制出如图1-8所示的几何图形,并将其填充为灰色(#AAAAAA)。
最后把几何图形的边框线删除。
图1-8绘制图形
10、选中“图层3”第6帧处的几何图形,按下F8键将其转换为图形元件,图形元件的名称保持默认。
完成后在“图层3”的第10帧、第12帧、第14帧与第18帧处插入关键帧,在第11帧与第13帧处插入空白关键帧,如图1-9所示。
图1-9插入关键帧与空白关键帧
11、选中“图层3”第6帧处的几何图形,在“属性”面板中将它的Alpha值设置为0%,选中第10帧、第12帧与第14帧处的几何图形,分别在“属性”面板中把他们的亮度值设置为100%。
然后在这些关键帧之间创建补间动画。
图1-10绘制图形
12、新建一个图层,并在该层的第8帧处插入关键帧。
然后使用“线条工具”在工作区中绘制出几何图形,并将其填充为灰色(#7A7A7A)。
最后,把几何图形的边框线删除。
13、选中“图层4:
”第8帧处的几何图形,按F8键将其转换为图形元件,名称保持默认。
完成后在“图层4”的第12帧、第14帧、第16帧与第20帧处插入关键帧,在第13帧与第15帧处插入空白关键帧。
14、选中“图层4”第8帧处的几何图形,在“属性”面板中将它的Alpha值设置为0%,选中第12帧、第14帧与第15帧处的几何图形,分别在“属性”面板中把它们的亮度设置为100%。
然后在这些关键帧之间创建补间动画。
15、选中“图层4”的第20帧,在“动作”面板中添加代码:
“stop();”。
16、回到场景2,新建一个“图层4”,从“库”面板里将影片剪辑“al”拖入到舞台上,并在该层的第113帧处插入帧,然后再“图层1”、“图层2”与“图层3”的第605帧处插入帧,如图1-11所示。
图1-11插入帧
17、按Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“a2”。
完成后单击“确定”按钮。
18、在影片剪辑“a2”的编辑状态下,使用“线条工具”在工作区中绘制出如图所示的几何图形,并将其填充为灰色(#DCDCDC),然后把几何图形的边框线删除。
最后在时间轴上的第11帧处插入帧,如图1-12所示。
图1-12绘制图形
19、新建一个图层,使用“矩形工具”在几何图形的下方绘制一个无边框、填充色为任意色、宽和高分别为228像素与5像素的矩形。
20、在“图层2”的第4帧处与第11帧处插入关键帧。
然后选中第4帧处的矩形,使用“任意变形工具”将其高度拉伸至163像素,选中第11帧处的矩形,使用“任意变形工具”将其高度拉伸至181像素。
最后分别在“图层2”的第1帧与第4帧之间、第4帧与第11帧之间创建形状补间动画。
21、选中“图层2”,单击鼠标右键,在弹出的菜单中选择“遮罩层”命令。
完成后新建一个图层,并在该层的第7帧处插入关键帧。
然后使用“线条工具”在工作区中绘制出如图1-13所示的几
何图形,并将其填充为白色。
最后把几何图形的边框线删除。
22、在“图层3”的第9帧与第11帧处插入关键帧,在第8帧与第10帧处插入空白关键帧。
图1-13绘制图形
23、选中“图层3”的第11帧,在“动作”画板中添加代码:
stop();。
24、回到场景2,新建一个“图层5”,并在该层的第14帧处插入关键帧。
从“库”面板里将影片剪辑“a2”拖入到舞台上,然后在第110帧处插入空白关键帧。
25、按Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“a3”。
完成后单击“确定”按钮。
26、在影片剪辑“a3”的编辑状态下,使用“文本工具”在工作区中随意输入大量英文字母,字体选中“Arial”,字号为3,颜色为白色。
完成后在时间轴上的第10帧处插入帧,如图1-14所示。
图1-14输入字母
27、新建一个图层,使用“矩形工具”在字母的左方绘制一个无边框、填充色为任意色、宽和高分别为1像素与12像素的矩形,如图1-15所示。
图1-15
28、在“图层2”的第4帧处与第10帧处插入关键帧。
然后选中第4帧处的矩形,使用“任意变形工具”将其宽度拉伸至200像素,选中第10帧处的矩形,使用“任意变形工具”将其宽度拉伸至226像素。
最后分别在“图层2”的第1帧与第4帧之间、第4帧与第10帧之间创建形状补间动画,如图1-16所示。
图1-16
29、选中“图层2”,单击鼠标右键,在弹出的菜单中选中“遮罩层”命令。
30、选中“图层2”的第10帧,在“动作”画板中添加代码:
“stop();”。
31、回到场景2,新建一个“图层6”并在该层的第23帧处插入关键帧,从“库”面板里将影片剪辑“a3”拖入到舞台上,然后再第110帧处插入空白关键帧。
32、按Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“a4”。
完成后单击“确定”。
33、在影片剪辑“a4”的编辑状态下,执行“文件-导入-导入到舞台”命令,将一幅图像导入到舞台中,如图1-17所示。
图1-17在“图层1”导入图像
34、新建一个“图层2”,再传执行“文件-导入-导入到舞台”命令,将另一幅图像导入到舞台中,并将其移动到如图1-44所示的位置。
图1-18在图层2导入图像
35、在“图层1”的第27帧处插入帧,在“图层2”的第27帧处插入关键帧。
然后选中“图层2”的第27帧处的内容,把它移动到如图1-50所示的位置。
最后在“图层2”的第1帧与第27帧之间创建补间动画。
36、选中“图层2”,单击鼠标右键,在弹出的菜单中选中“遮罩层”命令。
完成后回到场景2,新建一个“图层7”,并在该层的第40帧处插入关键帧。
从“库”面板里将影片剪辑“a4”拖入到舞台上,然后在第50帧处插入空白关键帧。
37、选中场景2中的“图层1”,在第58帧处插入关键帧。
然后选中该帧中的内容,按F8键,将其转换为图形元件,名称保持默认。
最后在“图层1”的第60帧、第76帧、第78帧、第121帧、第123帧、第269帧、第271帧、第303帧、第305帧、第360帧、第362帧、第407帧、第409帧、第437帧与第439帧处插入关键帧。
38、分别选中“图层1”上的第58帧、第76帧、第121帧、第269帧、第303帧、第360帧、第407帧与437帧中的内容,在“属性”面板中把它们的亮度值设置为34%。
39、按Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“a5”。
完成后单击“确定”按钮。
40、在影片剪辑“a5”的编辑状态下,使用“线条工具”与“椭圆工具”在工作区中绘制一个如图1-19所示的几何图形。
然后在时间轴上的第85帧处插入帧。
图1-19绘制图形
41、新建一个图层,使用“矩形工具”在几何图形的左侧绘制一个无边框、填充色为任意色的矩形。
42、在“图层2”的第15帧处插入关键帧,使用“任意变形工具”将该帧处的矩形放大至刚好把几何图形完全遮住。
然后在“图层2”的第1帧与第15帧之间创建形状补间动画。
43、在“图层1”的第15帧、第17帧、第19帧、第21帧、第23帧、第25帧、第27帧、第29帧与第31帧处插入关键帧,在第16帧、第18帧、第20帧、第22帧、第24帧、第26帧、第28帧与第30帧处插入空白关键帧,如图1-20所示。
图1-20插入关键帧与空白关键帧
44、选中“图层2”,单击鼠标右键,在弹出的菜单中选择“遮罩层“命令。
完成后新建一个“图层3”,并在该层的第6帧处插入关键帧。
使用“线条工具”与“椭圆工具”在工作区中绘制一个如图1-21所示的几何图形。
图1-21绘制图形
45、按照同样的方法,在新建一个“图层4”来遮罩“图层3”。
46、新建一个“图层5”,并在该层的第31帧处插入关键帧。
使用“文本工具”在工作区中输入文字“阳光中介,金牌服务”,如图1-22所示。
字体选择“黑体“,字号为14
图1-22输入文字
47、在新建一个“图层6”,并在该层的第31帧处插入关键帧。
使用“矩形工具”在文字的左侧绘制一个无边框、填充色为任意色的矩形,如图1-23所示。
图1-23绘制矩形
48、在“图层6”的第36帧处插入关键帧,将该帧处的矩形向右移动到刚好把文字完全遮住。
然后在“图层6”的第31帧与第36帧之间创建形状补间动画。
49、在“图层5”的第43-65帧处插入关键帧,然后使用键盘上的方向键依次将这些关键帧中的文字向上、向下、向左、向右移动一个像素。
最后选中“图层6”,单击鼠标右键,在弹出的菜单中选择“遮罩层”命令。
50、回到场景2,新建一个图层“xian1“,并在该层的第53帧才插入关键帧。
从“库”面板里将影片剪辑“a5”拖入到舞台上,然后在第138帧处插入空白关键帧。
51、新建一个图层,并把它命名为“juxing”,在该层的第135帧处插入关键帧。
使用“矩形工具”在舞台中绘制一个无边框、填充色为灰色、宽和高分别为1像素与146像素的矩形。
接着选中矩形,按F8键,将其转换为图形元件,名称保持默认。
然后在“juxing”层的第140帧处插入关键帧,使用“任意变形工具”将该帧处的矩形放大至宽和高分别为778像素与200像素。
最后在第135帧与第140帧之间创建补间动画。
52、在“juxing”层的第142帧处插入关键帧,使用“任意变形工具”将该帧处的矩形宽度缩放至500像素。
然后在“juxing”层的第144帧、第146帧、第173帧与第175帧处插入关键帧,在第141帧、第143帧、第145帧、第174帧与第190帧处插入空白关键帧。
53、按Ctrl+F8组合键,新建一个影片剪辑,在名称栏中输入“a6”,如图1-24所示。
完成后单击“确定”按钮。
图1-24新建影片剪辑
54、在影片剪辑“a6”的编辑状态下,执行“文件-导入-导入到舞台”命令,将一幅图像导入到舞台中,如图1-25所示。
图