基于flash的多媒体课件设计与实现.docx
《基于flash的多媒体课件设计与实现.docx》由会员分享，可在线阅读，更多相关《基于flash的多媒体课件设计与实现.docx（24页珍藏版）》请在冰豆网上搜索。
基于flash的多媒体课件设计与实现
赣南师范学院科技学院学士学位论文
基于Flash的多媒体课件设计与实现
系别数信与科学系
届别计算机08级1班
专业计算机科学与技术
摘要
多媒体课件制作技术是各级教师、教育工作者、多媒体设计等从业者必须掌握的技能。
在众多的多媒体制作软件中，Flash是功能最强大、使用最广泛的一种。
Flash在实现课件的多媒体性、交互性、网络性等方面，具有其他软件不可比拟的优势。
Flash8是Macromedia公司最新推出的动画制作软件，也是目前最受欢迎、功能最强，同时又简单易学的一种开发工具。
与以往的版本相比，Flash8在原有基础上新增了很多功能，例如实时滤镜效果、新的文本渲染引擎、动态载入外部GIF图片、自定义淡入淡出功能、全新的视频编码技术等。
这些新增功能大大增强了Flash在网页设计和动画制作中的作用，成为备受关注的闪亮焦点。
本系统针对多媒体课件设计与实现，通过对Flash8这款软件的熟练运用，制作一个关于计算机系列的教材——《Authorware多媒体课件制作实用教程》的多媒体课件，其中结合了交互地综合处理文字、图形、图像、动画、音频等多种信息。
本系统操作简单，内容丰富，观赏性强，适合大多数人群学习使用。
课件实现时遇到的问题就是代码的填写，课件的整体结构和配色方案。
这些问题都通过网络得以解决。
关键字：
多媒体课件课件设计实用教程
Abstract
Multimediacoursewareproductiontechnologymustmastertheskillsofteachersatalllevels,educators,andmultimediadesignpractitioners.Flashisthemostpowerful,theuseofthemostwidelyusedinmanymultimediaauthoringsoftware.Flashmultimedia,interactive,networkandotheraspectsofcoursewarehastheincomparableadvantageofothersoftware.Flash8isMacromedia'slatestanimationsoftware,andiscurrentlythemostpopular,mostpowerful,andeasytolearnasadevelopmenttool.Comparedwiththepreviousversion,basedontheoriginalFlash8addedmanyfeatures,suchasreal-timefiltereffects,newtextrenderingengine,dynamicloadingofexternalGIFimages,customfadeinfadeoutfunction,thenewvideoencodingtechnology..ThesenewfeaturesgreatlyenhancedtheroleofFlashinwebdesignandanimationbecomeshinyfocusofconcern.
Thissystemformultimediacoursewaredesignandimplementation,throughtheskilleduseoftheFlash8thissoftware,makingaseriesofcomputermaterials-Authorwaremultimediacoursewaretomakeatutorial"multimediacourseware,whichcombinestheinteractiveintegrationofwordprocessing,graphics,images,animations,audioandotherinformation.Thesystemoperationissimple,content-rich,ornamental,suitableformostofthecrowdtolearntouse.Problemsencounteredattheimplementationofthecoursewareisthecodefillintheoverallstructureandcolorschemeofthecourseware.Theseissuesareresolvedthroughthenetwork.
Keywords:
multimediacourseware,coursewaredesign,practicalcourse
引言
在计算机应用日益广泛的今天，计算机技术除了已经走进了我们日常的工作，生活外，也走进了我们的课堂教学中。
多媒体教学课件不仅可以更加自然、逼真地表现多姿多彩的视听世界，使原本艰难的教学活动充满了魅力，还可以对宏观和微观事物进行模拟，对抽象、无形事物进行生动、直观的表现；对复杂过程进行简化再现，因此也提高了学生的学习兴趣。
多媒体、交互性、网络化是多媒体课件最基本的3个特性，多媒体教学方式打破了时间和空间的限制，且在多媒体方面，Flash具备完善的媒体支持功能，它能导入图形图像、声音、视频、三维动画等各种媒体。
将教学内容与教学所涉及到的事物，通过声音、图像、动画等形式表现出来。
使学生通过事物形、色、声的不变化和发展直接获取知识，感知世界，并且使许多抽象的概念形象化、具体化，更使教学有难有易，增加教学效果，提高教学效率，具体传统教学所不能比拟的优越性。
1需求分析
（1）、《Authorware多媒体课件制作使用教程》这本书以实例带动教程，详细讲述了用Authorware制作多媒体教学课件的方法与技巧。
全书共12章，分别介绍了多媒体课件入门知识和课件素材制作，Authorware课件基础知识，文字和图形在课件中的应用、等待和擦除图标在课件中的应用，视频、声音和动画在课件中的应用，移动图标在课件中的应用，课件的交互控制，控制课件的程序流程，课件编程基础，增强课件的功能，课件典型结构，课件的调试和发布等内容。
（2）、Flash8在原有功能上有较大的改进，并且新增了一些功能，更利于开发者使用。
它提供了更强大的表现手法、文本支持、脚本增强和视频支持。
下面就分别介绍一下这些新增的功能。
1、渲染滤镜
Flash8已经能够合并内建的滤镜效果，像阴影、模糊、内外发光、倒角、渐变倒角、颜色调整，以获得更丰富的用户体验。
2、位图缓冲
将自身无变化的矢量图按位来显示，以提高影片播放速度。
3、文本渲染引擎
Flash8同时允许用户使用FlashType字体作更多的控制。
Flash包含字体渲染的预置，为动画文本提供等同于静态文本的高质量优化。
新的渲染引擎使得文本即使使用较小的字体看上去也会更加清晰，这一功能是Flash的一大重要改进。
4、自定义淡入淡出功能
动画设计者将会享受新的自定义淡入淡出功能所带来的乐趣，这一功能允许设计者直观地控制所有的动作补间属性。
新增的曲线图功能提供对位置、旋转、大小、颜色及滤镜的独立控制，使用它能够精确控制动画的速率。
5、全新的视频编码技术
Flash8采用新的视频编码，并扩展的面积Web的视频解码选项。
制作多媒体课件是计算机专业学生的基础技能，本设计以《Authorware多媒体课件制作实用教程》为蓝本，介绍基于该课程开发的课件，详细的设计过程和所涉及到的问题及解决方法。
2开发工具
多媒体课件制作软件非常多，比如Authorware、Flash、PowerPoint等等，在众多多媒体制作软件中，普及率最高、实用最广泛的专业多媒体创作工具就是Flash。
Flash是Macromedia公司推出的一种集动画设计、游戏、Web网页站点开发等功能于一身的优秀软件。
Flash开拓了网页设计与多媒体制作的新领域，从简单的动画到复杂的交互式Web应用程序，从丰富的多媒体支持到流媒体FLV视频文件在线播放，Flash给开发者更多的想象空间的技术支持，开发者可以结合个人的创意做出有声有色的动画作品及互动性商业网站作品。
而Flash8简体中文版是最新发布的软件版体，在诸多功能上有较大的改进，更利于开发者使用。
2.1Flash8的运行环境
Flash8以便捷、完美、舒适的动画编辑环境，深受广大动画制作爱好者的喜爱。
在制作动画之前，先对运行环境进行介绍，包括一些基本的操作方法及运行环境的组织和安排。
1、flash8启动
运行Flash8，首先映入眼帘的是“开始页”，“开始页”将常用的任务都集中放在一个页面中，包括“打开最项目”、“创建新项目”、“从模板创建”、“扩展”，以及对官方资料的快速访问，如图2-1所示。
图2-1启动页
2、工作窗口
在“开始页”，选择“创建新项目”下的“Flash文档”，这样就启动了Flash8的工作窗口并新建了一个影片文档，如图2-2所示。
图2-2工作窗口
Flash8的工作窗口由标题栏、菜单栏、主工具栏、文档选项卡、编辑栏、时间轴、工作区和舞台、工具箱，以及各种面板组成。
①标题栏：
显示当前操作的Flash文件的名称。
②菜单栏：
集合了Flash8提供的所有功能。
③绘图工具栏：
集中了绘制特殊形状的图形或图画时所用到的工具。
④时间轴：
制作Flash影片的操作空间。
⑤操作标识栏：
可以了解当前操作的位置。
⑥舞台：
编辑Flash影片的操作空间。
⑦操作空间：
在完成的Flash影片中看不到的操作空间。
⑧属性栏：
可以细致设置选择的对象的属性。
3、代表功能的面板
制作质量较高的Flash影片时需要各种功能，为了更加方便地使用这些功能，在Flash8中，将它们以面板的形式集中在一起。
并且可以将经常使用的面板放置在一起，也可以放置到所需位置。
下面列举其中一部分面板作介绍。
1）选择所需颜色的混色器面板和颜色样本面板
在制作影片时与颜色相关的功能都集中在混色器面板和颜色样本面板中。
在混色面板中，利用RGB值和透明值可以直接创建颜色，颜色样本面板用于管理和保存创建的颜色，如图2-3所示。
图2-3颜色样本面板、混色器面板
2）便于整理的信息面板和排列面板
在信息面板中可以细致调整对象的大小和位置，在排列面板中可以一次性整理多个对象，如图2-4所示。
图2-4信息面板、排列面板
3课件的功能及实现过程
3.1模块的设计及其功能
课件主要包括四大模块:
1、主要内容：
列出该章节的主要内容。
2、知识点讲解：
通过图片、文字说明课文的内容及知识点。
3、难点分析：
出示本课的难点，进一步分析说明。
4、举例说明：
通过练习使掌握的内容加以巩固。
3.2总体流程图
整体设计的原则是体现多媒体课件的交互性、直观性。
其中最主要的是交互性的实现，交互性主要体现在课件内部的交互、章节和章节之间的交互。
每个章节内部要实现前翻、后翻，章节和章节之间的跳转，如果在每个页面内都放置可以查找相应章节的按钮，按钮太多整个页面看上去就很单调了，所以根据简单的原则直接在每个页面内设置一个返回目录的按钮，这样再进行重新选择就比较简单、直观了。
总体设计的流程图如图3-1所示：
图3-1总体流程图
3.3整体结构
本课件主要采用“化整为零，分而治之”的模块设计方法，如图3-2所示。
根据课件的内容，将其分解为一个主控模块和三个功能模块，四个模块都要制作成独立的Flash影片。
上机习题
图3-2结构模型
主控模块主要用来控制和调度各个功能模块的播放，因此主要是设计一个导航菜单。
导航菜单由若干按钮组成，按钮和课件的功能模块相对应，单击导航菜单中的按钮可以载入相应的课件功能模块SWF影片，在每个功能模块影片中也设计一个返回到主控模块的按钮。
这些导航按钮上的程序代码的一般形式，如图3-3所示，程序代码的功能是，当单击并释放按钮时，加载指定的SWF影片。
图3-3导航按钮上的程序代码
各个课件功能模块具体实现相应课件内容的展示，为第一、第二章节。
利用LoadMovie（）函数在一个SWF影片中加载外部的SWF影片。
由于三个模块都是独立的Flash影片，利用了此函数实现了它们间的相互调用。
4课件的总体设计
4.1背景的设计
4.1.1主色调的选择和搭配
课件用的比较多的是在教学方面，性质还是像课本一样，老师和学生都要看着课本来教和学，多出来的功能就是交互性。
无论是老师和学生一直看着同一页内容看久了眼睛都会疲倦，而且人的情绪上也会觉得很乏味和烦躁。
这样的情况下主色调就不能采用暖色来填充了，因为暖色更容易让人产生烦躁的心情。
所以我主要采用冷色调搭配，比如蓝色、绿色、紫色等一些生命的颜色，还有一些稍微淡一点的冷色搭配在一起，这样看上去就不会那么单调、疲乏，反而会给人一种清新、活力，这样可以起到缓解疲劳的作用。
4.1.2背景图片的设计
课件的本质还是跟课本相似的，除了具有相当的实用性以外，最主要的是视觉效果。
用户在应用课件的时候除了文字以外，还会注意到背景的搭配。
所以图片的设计及色彩的搭配起到很大的作用。
首先图片风格的选定。
图片的风格不能过于卡通，这样给人的感觉很幼稚，主观上在威信方面会打折扣的；同时也不能像专业的宣传广告那样太注重商业价值的宣传；还不能太严肃，太死板，这样会给人一种距离感同样不能引起学生的兴趣。
综上所述，整体的风格要淡雅、清新、美观但不花哨，实用性强但不失兴趣的启发因素。
另外风格要大体一致，但是又不能太相似，不然还是会起到重复，厌烦的效果。
在风格保持一致的同时要注意每个背景的个性设计。
根据课本的实际内容总共分为十二个章节，课件的实际是两个章节，除此以外另加上封面和封底。
1、素材的搜集
根据具体的需要我需要十八张背景图片，因为一共是十二章节，每一章节我采用的背景图片是不同的，如图4-1所示。
但每章节内的每个页面都是相同的背景图片。
封面我采用的是课件中用到频率比较高的图片组成的，目录则是十二副小图片组成，每幅图片代表一个章节。
封面跟正文部分的背景风格还是不一样的，封面要体现的是整个课件的风格，可以说是正文部分背景图片风格的整合，也就代表了整个课件的风格。
而其他正文部分的背景在保持大的风格上一致以外还要体现不同的个性。
图4-1主界面
2、图片的处理
首先图片的处理工具是Fireworks,为Fireworks比较方便、简单、功能也比较多。
而且在各种平面处理工具中对fireworks是最熟悉，使用起来最顺手的。
图片的大小设置为800*630，与Flash文档的大小相同。
4.2封面的设计
封面的起到一个书面的作用，就像书的封面一样，在封面上可以了解到书名。
当然多媒体课件的封面同样具有这样的功能，首先要介绍所要学习的科目，课件名等信息。
但是课件不会像翻书一样直接翻到下一页，而是要通过交互作用跳转到下一个页面---目录页面。
如图4-2所示。
图4-2封面
封面右上角放置了三个按钮，用于跳转到目录页面、封面和结束，按钮的实现在以下的章节中都有所介绍。
4.3目录布局的设计
4.3.1目录造型的设计
多媒体课件的目录不会像书本的目录那么单调，除了文字就是符号，如图4-3所示。
图4-3课件的目录
4.3.2目录功能的设计
目录的功能就是通过章节的名称可以找到对应的页码，很快就可以翻到对应的章节。
而多媒体课件的目录的功能是在点击按钮后就可以跳转到相应的章节了，然后进行教学。
首先十二个章节用了十二副图片按钮元件，每幅图片就是一个按钮。
按钮上加的控制代码是
on（release）
{gotoAndPlay（"xx"）;
}
其中的xx是该场景内帧标签，方便跳转的实现。
每一章节都对就不同的帧标签，其中图层设计如图4-4所示。
图4-4目录场景的图层设计
图层e1存放的是代码stop（），e2层放的是按钮，e4、e5放的是文字，e6、e7放的是图片。
在封面上点击Comein按钮就可以进入目录页面，其中页面中按钮的具体代码在按钮的设计中详述。
4.4页面的设计
4.4.1普通页面效果的设计
以第1章的其中一个页面为例，其制作过程如下：
首先，新建一个名为“整数加法”的影片剪辑元件，在这个元件的编辑场景中，用绘图工具绘制一个653×306的黑色矩形。
将图层一命名为“文字”，选择[文本工具]，在第一帧将文字输入。
制作遮罩动画，新建一个图层，命名为“横线一”，在第一帧，用绘图工具绘制一条直线，并将该帧命为帧标签“a”。
再新建一个名为“横线一0”的图层，在第一帧，绘制一个1.0×4.0的直线，遮住在“横线一”图层绘制的直线的最左端，在第十九帧，将该直线拉长，完全覆盖在“横线一”图层的直线。
选择第一帧，定义补间动画。
将该层设置为“遮罩层”，如图4-5所示。
“横线二”，“横线三”，“注释部分”等，制作方法类似，就不再重述。
图4-5多媒体课件入门
按钮的制作，新建一个按钮元件，在“图形”图层，用绘图工具，绘制一个颜色为“#CC00CC”的不规则圆形，新建一个名为“文字”的图层，在[指针经过]帧，插入关键帧，用[文本工具]输入“a”。
返回到影片剪辑，将该按钮添加代码：
on（release）{gotoAndPlay（"a"）;}。
其余按钮的制作方法类似，就不再重述。
新建一个名为“代码”的图层，在第一帧添加代码stop。
至此，此页面制作过完成。
4.4.2习题页面效果的设计
习题页面主要由题目部分和参考答案部分组成，题目页面的制作，一共有四道题目，因此需要制作四个页面，这里就以第一道题目的页面与参考答案页面为例进行介绍。
习题页面共有六个图层，命名如图4-6所示。
图4-6图层命名
1、题目部分页面的设计
第一道题目页面的制作方法，是在图层“习题1”的第65帧到第71帧间创建补间动画，将第65帧命名为“p0”，第72帧为“p1”，在第71帧插入stop动作。
然后，在图层“翻页”的第71帧处将按钮“元件18”插入舞台的合适位置，代码为on（release）{gotoAndPlay（"p1"）;}，通过该按钮进入下道题，具体的图层设计如图4-7所示。
其中，单选题的“单选按钮”是从“组件”面板的“UserInterface”组件类别中选取的，它们的参数设置如图4-8所示，最终的效果图如图4-9所示。
图4-7图层设计
图4-8参数设置
图4-9第一章习题最终效果
2、参考答案页面的设计
这张页面采用了滚动按钮，使显示内容上下移动，在较小空间里能看到更多的内容。
效果图如图4-10所示。
图4-10参考答案效果图
操作步骤如下：
1.将库中的“文本”图形元件拖动至舞台中后，按F8键将其转换为“滚动影片”的影片剪辑。
2.切换到“滚动影片”的编辑界面，然后按F6键在第100帧上添加关键帧，拖动文本内容，一直向上拖动直到显示最底部的内容，在中间帧处创建补间动画。
3.在“action”图层的第1帧和第100帧上指定stop动作，切换到主界面。
4.单击前面制作的“滚动影片”，将其实命名设置为scroll。
5.在“按钮”图层，将库面板中的按钮调整并拖动到适当位置，单击下按钮，然后打开动作面板输入以下代码：
on（rollOver）{
_root.scroll.nextFrame（）;
gotoAndStop（93）;
}
6.在上按钮的动作面板中，将以上代码复制过来，将nextFrame改为prevFrame。
7.在第2帧插入关键帧，将对应的动作面板中“93”都改为“92”。
8.在遮罩层“MASK”中，绘制一个矩形，其大小可遮住文本内容。
至此，该页面制作完成，具体的图层设计如图4-7所示。
4.4.3封底页面效果的设计
页面的效果主要由SWF文件和影片剪辑制作而组成。
该页面共有六个图层，命名如图4-11所示。
图4-11封底图层命名
“顶部按钮”、“音乐”、“背景”图层的制作不再重述，这里主要介绍百页窗的制作。
具体操作步骤如下：
1.新建一个影片剪辑，命名为“1”。
双击进入其编辑界面，在第1帧，运用[矩形工具]绘制一个宽为8，高为630的黑色矩形。
在第20帧处，插入关键帧，运用[任意变形工具]将宽改为18。
创建补间形状，并在第20帧处添加动作“stop”。
2.新建影片剪辑，命名为“2”。
双击进入其编辑界面，在第1帧，将库面板中的影片剪辑“1”拖入编辑界面中，并复制多个。
打开[对齐]面板，调整矩形间的间隔，使总长为800×630。
3.新建一个图形元件，命名为“封底”。
双击进入其编辑界面，绘制一个800×630的淡黄色矩形，运用[文本工具]输入文字。
4.新建一个按钮元件，命名为“链接到论文”。
双击进入编辑界面，进行编辑，如图4-12所示。
图4-12按钮“链接到论文”
5.回到场景1，选择“文字”图层，将图形元件“封底”拖入场景，并将制
按钮“链接到论文”也插入其中，并放于适当位置。
选中该按钮，打开动作面板，设置如下代码：
on（release）{
getURL（"论文.doc"）;
}
必需将*.DOC文件与导出的SWF文件放在同一个文件夹中。
6.选择“遮罩”图层，将影片剪辑2插入到第1帧处。
并将其设置为遮罩层。
7.按下[Ctrl]+[Enter]快捷键播放。
则页面以百页窗的效果出现，单击“链接到论文”按钮，则在浏览器中出现*.DOC文件。
4.5翻页效果的实现
每一张页面都是由影片剪辑组成，使用影片剪辑元件可以创建可重用的动画片段，影片剪辑拥有它们自己的独立于主时间轴的多帧时间轴，可以将影片剪辑看作是主时间轴的嵌套时间轴，它们可以包含交互控件、声音甚至其他影片剪辑实例，也可以将影片剪辑实例放在按钮元件的时间轴内，以创建动画按钮。
每个章节页面之间的翻页效果相同，所以只选择前两个页面详细介绍，前翻后翻主要依靠按钮来实现。
这里以第七章节来介绍。
1、目录的设计
目录是由四个章节的小标题组成，当然还包括了声音控制按钮及显示按钮。
这时主要介绍标题的设计，制作方法省略。
小标题既是文本也是按钮，每一个标题按钮对应各自的章节，运用按钮的跳转来实现翻页，如图4-13所示。
第一个标题按钮链接的页面不同，因而，所对应的代码也不同，以第一个标题7.1地址和指针的概念为例，在其上添加动作on（release）{gotoAndStop（45）;}，其中“45”是指第一标题链接到的该节的第一个页面。
图4-13第一章目录
2、页面的设计
在“影片剪辑”图层的时间轴设计如图4-14所示。
第45帧到第63帧依次插入所设计好的页面。
第45帧到第49帧为7.1节的内容，第50帧至第58帧为7.2节，其余的为7.3节，7.4的设计如图4-7所示。
分别在每一章节的首尾页面插入帧标签，以便于设计“按钮”图层的按钮。
图4-14页面时间轴
在“按钮”图层的第45帧处插入所需用到的翻页按钮，如图4-15所示。
在第46、49、51、52、58、59、
升级会员 