flash个人简历制作流程(2)

时间:2021-08-31

 摘 要

  Flash 是一种二维矢量动画软件创作工具,设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。Flash 特别适用于创建通过 Internet 提供的内容,因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。位图图形之所以更大,是因为图像中的每个像素都需要一组单独的数据来表示。与位图图形相比,矢量图形需要的内存和存储空间小很多,因为它们是以数学公式而不是大型数据集来表示的。

 1 引言

  FLASH动画是目前主流的网络动画格式,它具有绚丽的画面效果、丰富的网络功能和强大的交互能力,世界上几乎所有的网络都使用FLASH动画来表现内容,几乎所有的浏览器都安装了能够播放FLASH动画的插件。这也为FLASH动画的应用和普及奠定了坚实的基础看,使其成为网络动画行业事实上的工业标准。对于动画设计人员来说,FLASH是其进行网络动画设计的必备工具;对于广大的网络爱好者而言,FLASH是其展现自我的最佳手段。

  FLASH CS3版本是在2007年推出的,它是Adobe Creative Suite 3系列产品之一,在Adobe技术框架下,能够与Photoshop、I11ustrator等很好地结合。FLASH也从一款专业的动画创作工具发展成为一种功能强大的网络多媒体创作工具,能够设计交互式动画、视频、网络和复杂演示文稿在内的各种网络作品。

  FLASH动画是一种矢量动画格式,具有体积小、兼容性好、直观动感、互动性强大、支持MP3音乐等诸多优点。

2 作品设计要求

  个人简历,主要就是要简明扼要,所以界面不用太华丽,需要简单明了。

  根据这学期得学习,要求设计一个资料展示类型的动画作品“求职简历”,主要表现个人概况、教育经历、社会实践、奖励荣誉、求职意向等,画面尺寸为“600*400”像素。 3制作步骤

  3.1 设计分析

  3.1.1作品构图分析

  a.画面主要由三部分构成:顶部的标题、中间的个人信息、左侧的按钮; b. 标题为静态画面;

  c.按钮采用动态的图形按钮;

  d.个人信息为一个影片剪辑,可以控制其显示帧; e. 画面装饰以水滴。 3.1.2 作品设计思路分析

  1) 导入图像,构建基本画面;

  2)设计动态按钮,其中又包括文字变形、图像变形、按钮功能、按钮音效等; 3)设计表现个人信息的影片剪辑,其中又包括概况、教育等图像和变形效果; 4)利用脚本代码控制个人信息的显示; 5) 用代码导入外部水滴动画。

  3.2构建基本画面

  (1)创建一个新的Flash文件(ActionScript3.0),命名为“求职简历.fla”。 (2)设置文档舞台为“600*400”像素。

  (3)在【时间轴】面板,修改图层1的名称为“背景”。

  (4)选择【文件】|【导入】|【导入到舞台】菜单命令,将“标题.jpg”文件导入,并将其布置在舞台画面的合适位置。

  3.3设计动态按钮

  这个按钮实际上是一个影片剪辑类型的元件,包含了一些动态元素,通过添加按钮,使其表现出按钮的形态。为了了解清楚,下面分几个部分来创建该元件。

  3.3.1动态文字

  (1)选择【插入】|【新建元件】菜单命令,创建一个名称为“b概况”、“影片剪辑”类型的元件。

  (2)修改其图层1的名称为“文字”,在舞台上输入静态文字“个人概况”。

  (3)设置字体为幼圆,大小为20,颜色为粉红,字体加粗;再设置文字相对于舞台中心对齐。

  (4)为避免文字在不同的播放器中出现字体上的错误,需要把文字分离为图形。 (5)为使文字产生动画变形,需要将其转换为“图形”类型的元件“m1”。

  (6)在13帧、25帧各增加一个关键帧。如图所示。

  (7)在第1帧,选择文字对象,设置【形变】为10﹪;颜色为“Alpha”,数值为0﹪。

  (8)同理,设置第25帧的对象变形、颜色属性与第1帧相同。

  (9)在第1帧、第13帧的属性面板中,分别设置【补间】为“动画”。这样,就创建了一个动态的文字变形效果。

  3.3.2动态图形

  (1)添加一个新图层,命名为“图形”。

  (2)在其第1帧,用绘图工具绘制一个云朵模样的图形,设置颜色为粉红色。 (3)将图形转换为“图形”类型的元件“G1”。

  (4)在第13帧、25帧各增加一个关键帧。

  (5)图形的变形与文字的变形应当正好相反。所以在“图形”层第25帧,设置图形对象【变形】为10﹪;颜色为“Alpha”,数值为0﹪。

  (6)在“图形”层得第1帧、第13帧的属性面板中,分别设置【补间】为“动画”。这样就创建了一个动态的图形变形效果。

  目前,“b概况”按钮元件已经具有了能够动态变化的图形和文字,但是要使其表现出按钮的效果,还必须添加适当的按钮元素。这需要首先创建一个隐形的按钮元件,然后将其添加到“b概况”按钮元件中。

  3.3.3隐形的按钮元件

  (1)选择【插入】|【新建元件】命令,创建一个类型为“按钮”,名称“ball”的元件。 (2)因为这个按钮元件不需要显现出来,所以其【弹起】帧、【指针经过】帧、【按下】帧都不需要具体内容;仅在【点击】帧插入一个关键帧,然后再舞台上绘制一个粉红色的圆。

  (3)虽然按钮不需要显示,但是用户鼠标进入按钮的时候,还是应当有一个声响效果表现的。选择【文件】|【导入】|【导入到库】命令,将一个声音文件导入到库中。

  (4)添加一个新图层,在【鼠标经过】帧插入一个关键帧。

  (5)在其属性面板,从【声音】中选择前面导入的声音文件,则该文件被加载到当前帧。

  3.3.4按钮的效果

  (1)在库中,双击“b概况”按钮元件,进入其编辑状态。 (2)添加一个新图层,命名为“按钮”。

  (3)在其第1帧,将其按钮元件“ball”拖入到舞台,并与舞台中央对齐。 (4)定义元件实例的名称为“b1”。

  (5)选择“图形”层得第1帧、第13帧,分别输入脚本代码。

  (6)再添加一个图层,命名为“脚本”。 (7)在其第1帧输入如下代码:

  b1.addEventListener(MouseEvent.MOUSE_OVER, mymouseOver); //侦听按钮b1的鼠标经过事件

  b1.addEventListener(MouseEvent.MOUSE_OUT, mymouseOut); //侦听按钮b1的鼠标离开事件

  function mymouseOver(event:MouseEvent):void { //处理鼠标经过事件 }

  function mymouseOut(event:MouseEvent):void { //处理鼠标离开事件 gotoAndPlay(14); //从第14帧开始播放 }

  (8)同理制作其他按钮:b教育、b求职、b实践、b证书、b返回

  3.4制作个人信息

  3.4.1创建基本内容元件

  (1)新建一个“影片剪辑”类型,名称为“m概况”。

  (2)选择【文件】|【导入】|【导入到舞台】命令,将“概况.jpg”导入到舞台。 (3)添加一个新图层,再将一个图像文件“35.jpg”导入到舞台。 (4)将舞台的背景设置为灰色,便于修改。 (5)将图像分离为图形。

  (6)使用套索工具和橡皮擦工具,将图形中的白色背景清除。

  (7)将舞台的背景重新设置为白色;然后调整构图,使画面看起来更协调美观。

  gotoAndPlay(2); //从第2帧开始播放

  (8)同理制作其他几个基本内容元件。

  (9)为使首页更加美观,还需要制作一个元件“m底图”,在其中引入一个图片。 3.4.2制作主要内容元件

  (1)新建一个“影片剪辑”类型的元件“主要内容”。 (2)将元件“m底图”拖入到舞台中。

  (3)设置元件实例的颜色“Alpha”,大小为10﹪。

  (4)在第10帧插入一个关键帧。设置其中实例的颜色为“Alpha”,大小为50﹪。 (5)选择第1帧,设置其【补间】为“动画”,创建了一个透明度渐变的补间动画。 (6)在第11帧插入一个关键帧。删除其舞台上的内容。

  (7)将“m概况”元件拖入到舞台;设置实例对象的颜色为“Alpha”,大小为0﹪。 (8)在第20帧插入一个关键帧。设置其中实例的颜色为无。

  (9)重新选择第10帧,设置其【补间】为“动画”。这就创建了“概况”内容的补间动画。

  (10)同理,创建“教育”、“实践”、“证书”、“求职”等内容的补间动画。

  (11)简历不能连续不断播放,应在每个清晰的内容帧上停留。因此,在10、20、30、40、50、60等帧添加停止语句。stop();

  3.5整合求职简历 3.5.1布置舞台对象

  (1)在“场景1”编辑状态,从库中将“主要内容”元件拖入舞台;命名元件实例名称为“maincontent”。

  (2) 添加一个新图层,命名为“栏目”。

  (3)将各栏目按钮“b概况”、“b教育”、“b实践”、“b证书”、“b求职”分别拖入舞台,布置在舞台左侧;分别命名各难实例的名称。 3.5.2添加动作脚本

  (1)添加一个新图层,命名为“脚本”。

  (2)在其第1帧中,创建动作脚本,用以控制各按钮的操作。当鼠标经过按钮时,会播放相应的简历内容。代码如下:

  btn1.addEventListener(MouseEvent.MOUSE_OVER, btn1mouseOver); btn2.addEventListener(MouseEvent.MOUSE_OVER, btn2mouseOver); btn3.addEventListener(MouseEvent.MOUSE_OVER, btn3mouseOver); btn4.addEventListener(MouseEvent.MOUSE_OVER, btn4mouseOver); btn5.addEventListener(MouseEvent.MOUSE_OVER, btn5mouseOver); //侦听各按钮的鼠标经过事件

  function btn1mouseOver(event:MouseEvent):void { maincontent.gotoAndPlay(11); }

  function btn2mouseOver(event:MouseEvent):void { maincontent.gotoAndPlay(21); }

  function btn3mouseOver(event:MouseEvent):void { maincontent.gotoAndPlay(31); }

  function btn4mouseOver(event:MouseEvent):void {

  maincontent.gotoAndPlay(41);

  }

  function btn5mouseOver(event:MouseEvent):void { maincontent.gotoAndPlay(51); }

  //处理各按钮的鼠标经过事件

  (3)测试作品。这时已经能够通过按钮的操作来浏览简历各部分内容。 3.5.3添加外部水滴特效

  (1)水滴特效是由外部动画文件“效果.swf”实现的,这个是一个动画文件。 (2)继续前面的设计。创建一个新的影片剪辑类型的原件,命名为“水滴”。

  (3)不需要在“水滴”元件的舞台上创建任何内容;只需要在其第1帧上输入如下代码,载入外部效果动画文件。 代码说明:

  var request:URLRequest = new URLRequest("效果.swf"); //创建一个地址请求对象 var loader:Loader = new Loader()//创建一个容器对象

  loader.load(request); //将地址请求对象中的内容载入对象中

  addChild(loader);//将容器附加到当前对象的舞台上

  (4)回到“场景1”,选择“栏目”层得第1帧。 (5)将“水滴”元件拖入到舞台,合理布置其位置。

  3.5.4为作品添加声音 (1)点击回到场景1

  (2)选择【文件】|【导入】|【导入到舞台】命令,将“trouble is a friend”音频文件导入到舞台。

  (3)在“背景”层中单击第1帧,选择【窗口】|【属性】命令,调出【属性】检查器,在面板右侧区域便是音频设置栏。

  (4)在【效果】选项,在弹出下拉表中选择“无”选项。 (5)单击【同步】选项,在弹出下拉表中选择“事件”、“循环”选项。如下图

  (6)测试动画效果。 (7)保存文件。

  实验结果:

  可以实现基本的资料预览,首页有顶部标题、左侧按钮包括个人概况、教育经历、社会实践、证书奖励和求职意向。右下方有一个返回主页的按钮。总体实现交互式按钮查看,还加有背景音。功能都能实现和查看。

  实验心得:

  通过本次设计,对Flash有了一个更深入的了解,总结下来,不管做什么都需要耐心,不能半途而废,不只是Flash还有其他的东西也是需要多练习多接触才可以做的好的。感觉这一科学到蛮多的东西的,相信以后在动画设计和一些多媒体的运用中是很有用的。毕竟是才开始接触还有很多值得学习的地方,会在以后的学习中多思考,勤学习。

【flash个人简历制作流程】相关文章:

1.小学flash课件制作

2.制作flash教学课件

3.如何制作flash游戏论文

4.我学会了制作flash作文

5.如何用flash制作课件片头

6.小学flash动画课件制作方法

7.flash教学课件制作

8.如何运用flash软件制作小学课件