《动画及网页制作》课程教案
课程名称：动画及网页制作 任课班级：美术学院2005级动画班
任课时间：2007年5月28日 至 2007年6月28日 周数：5周 教学目的及要求：
《动画及网页制作》是多媒体专业学生重要的必修基础课。通过对本课程的学习，学生能够使用Flash，制作网页动画，课件。了解网络动画的制作过程，游戏的制作过程，制作出有趣的游戏和精彩的动画片。
教学方法：
以教师的实例演示与学生的上机练习相结合的方法为主，同时组织学生观看优秀的flash动画和网页，辅导学生独立完成一个完整的flash动画或网页制作。
教学重点及难点：
教学重点：掌握并理解flash的操作界面，熟练使用flash中几种实现动画的基本方式来制作flash动画，学会并理解flash中的各种链接方式和AS语言来，学会编写动画应用脚本，利用flash及相关辅助软件制作网页动画。
教学难点：flash中的各种链接方式和flash的AS语言，独立编写动画应用脚本，网页的制作和链接。
教学内容：
第（1）章 认识FLASH 多媒体简介及其多种相关软件，初步把握用FLASH进行设计的一般方法和思路；了解FLASH动画的基本特点，以及Flash5.0的基本工作环境。
第（2）章 窗口介绍
本章简单介绍FLASH的基本界面组成，包括标题栏、菜单栏、工具栏、工具箱、舞台、层选择、和时间轴。
1、舞台(Stage)就是工作区，最主要的可编辑区域。在这里可以直接绘图，或者导入外部图形文件进行安排编辑，再把各个独立的帧合成在一起，以生成电影作品。
2、时间轴窗口(Timeline)用它可以调整电影的播放速度，并把不同的图形作品放在不同图层的相应帧里，以安排电影内容播放的顺序。
3、绘图工具栏(Drawing Toolbar)放置了可供图形和文本编辑的各种工具，用这些工具可以绘图，选取，喷涂，修改以及编排文字，还有些工具可以改变查看工作区的方式。在选择了某一工具时，其所对应的修改器(Modifier)也会在工具条下面的位置出现，修改器的作用是改变相应工具对图形处理的效果。
4、标准工具栏(Standard Toolbar)列出了大部分最常用的文件操作，打印，剪贴板，撤消和重做，修改器以及控制舞台放大比例的图标和选项，便于进行更为快捷的操作。
5、控制器面板(Controller)控制电影的播放操作的工具集合，一般不大常用，处于隐藏状态。
第（3）章 工具箱
了解工具箱的作用，掌握铅笔工具、钢笔工具、墨水瓶工具、橡皮工具、两种箭头工具、笔刷工具、吸管工具的用法。图形和文字是Flash动画的基础，所以掌握绘图工具的使用对于制作好的Flash作品是至关重要的。由于Flash的绘图工具种类比较多，其相应的修改器也各不相同。和画线条一样，按住SHIFT键时，用椭圆工具可以画出正圆，用矩形工具可以画出正方形来。掌握椭圆和矩形工具的使用方法，可以用不同颜色的边框，填充色，不同线宽线型作出各种各样的圆和矩形来。
第（4）章 时间轴
时间轴是FLASH中最重要的概念，时间轴(Timeline)是Flash中最重要的工具之一。他决定了动画的组织形式。所有的设计都是围绕着时间轴展开的。熟悉和充分利用好这四种模式，会给开发和调试工作带来许多便利。熟练掌握层的分类以及各种操作。会制作遮罩动画、按轨迹移动动画，简单的MOTION动画，逐帧动画。了解洋葱皮的作用，在制作动画的过程中，会使用洋葱皮。用它可以查看每一帧的情况，调整动画播放的速度，安排帧的内容，改变帧与帧之间的关系，从而实现不同效果的动画。
第（5）章 几种重要窗口设置
Flash中动画设置的过程，主要就是各种属性设置的过程。本章重点介绍了几个最常见窗口的意义，掌握帧、库窗口、动画、场景、符号、实例等属性的设置。符号的分类以及各种符号的制作与用法，性质。我们学习了有关图符和图库的一些基本知识，而创建图符的目的是要在动画制作的过程中运用它生成相同或不同的实例，创建图符的方法有两种：可以从工作区中选取对象转换成图符，或者先创建一个空的图符，然后在图符编模式下添加内容。实例创建好后，可以通过属性菜单对实例进行裁剪，粘贴，缩放，旋转。
第（6）章 ACTION初步
ActionScript是Flash的脚本语言,使用ActionScript可以给Flash动画添加交互性。可以说掌握了该语言，你的Flash技术将上一个台阶,多加运用后，当可成为Flash高手。Flash 5的ActionScript为创建包含复杂游戏、表单、调查表和实时交互性的网站提供了许多新的特性。可以对自己制作的动画进行设置，让用户事件（如按钮单击和按钮）触发脚本，告诉动画执行什么动作。
第（7）章 发布与输出
FLASH的动画的主要优势是在广域网上发行，本章主要介绍了这种发布技术。掌握优化动画的一些小技巧，测试动画下载技能，会根据需要将FLASH源文件发布成网页文件，各种图像文件，以及可执行文件。
第（8）章 基本技巧实例
本章详细介绍了几个有代表性的FLASH动画设计的例子，基本上涉及了所有基本技能和技巧。制作片头的LOADING效果，可结合ACTION中的ifframeloaded（）命令使用，鼠标属性和对象属性的同步变化，可结合ACTION中的startdrag()命令和stopdrag()命令，Setproperty()命令使用,文本滚动窗口可结合ACTION中的loadvariablesnum()和telltarget()命令使用。详细介绍文本框的用法。随鼠标飘落的雪花，了解隐形按钮的用法。
第（9）章 ACTION高级应用实例
本章主要介绍应用一些程序设计技巧，利用RADIO,CHECKBOX,COMBOBOX成MOVECLICP,并且具有通用性。
FLASH
制作
《网页制作》复习题）
第1章 网页制作概况 网页的概念
网页是用HTML（超文本编辑语言）语言编写，通过WWW传播，并被WEB浏览器翻译成为可以显示出来的集文本、超链接、图片、声音和动画、视频等信息元素为一体的页面文件。
网页HTML文件与web浏览器间的关系理 参照P5
首页和主页的异同点
首页与主页的区别:浏览网站时最先访问的页为首页，一般为欢迎信息，通过链接再进入主页（例如：榕树下网站）。主页是整个网站的导航中心（例如：163网站）。有些网站首页即主页。
网页制作的常用工具软件有哪些
FrontPage、网页制作三剑客（Dreamweaver与Flash、Fireworks并称为Macromedia的网页制作三剑客）、Photoshop „„
网页正文区
《网页制作：Flash动画制作》课程设计具体要求
一、Flash动画设计作品设计题目
1、见“题目1”。
2、见“题目2”。
上述题目任选其一，这两个题目的素材均已给出，考生须按照所给素材及“考试说明”中的操作步骤完成设计作品，完成的最终.swf作品形式可参考“题目1”或“题目2”中的相关实例。
二、Flash作品参考实例
可以参考题目1或题目2的“考试说明”文件或《网页制作：Flash动画制作》课件中的“单元九 综合实例”中的“任务1时装广告动画”、“任务2精品购物网站”。
三、Flash动画设计需要提交的文档及要求
1、所制作完成的作品.swf格式及作品对应的源文件.fla格式。
2、课程设计报告（报告附录部分为所使用的全部素材的截图），字数为800～1000字，写作模版参见“课程设计报告写作模板”。
3、所提交的作品（含源文件及最终作品）和设计报告应放在一个压缩包内，命名规则为：姓名+Flash动画设计稿件，如吴名Flash动画设计稿件。稿件大小应控制在10M以内。
4、作品的命名规则为：姓名+作品主题，如吴名题目1。
网页制作与设计教案
第一讲 网页设计概述....................................................................................................................3 1.1WWW和URL.....................................................................................................................3 1.2IE5的使用............................................................................................................................3 1.3 网页中所使用的技术............................................................................................................4 1.4 制作网页的基本方法............................................................................................................4 第二讲 HTML的基本标志与格式标志.......................................................................................4 2.1 HTML文档的基本结构.........................................................................................................5 第三讲 HTML的文本、图片与超级链接标志...........................................................................5 2.2 插入文字................................................................................................................................6 2.3 插入图片................................................................................................................................8 2.4 建立超级链接........................................................................................................................8 第四讲 HTML表格、表单与框架标志.......................................................................................9 2.5 插入表格................................................................................................................................9 2.6 表单的应用..........................................................................................................................10 2.7 框架窗口..............................................................................................................................10 第五讲 HTML标志综合运用案例.............................................................................................11 第六讲 DREAMWEAVER中简单WEB站点建立与管理.....................................................12 3.1 DREAMWEAVER概述............................................................................................................12 第七讲 DREAMWEAVER中静态网页设计.............................................................................13 3.2 在页面中加入文字和图像..................................................................................................14 3.3 超级链接的运用..................................................................................................................14 3.4.表格的应用.........................................................................................................................14 3.5.在网页中创建表单.............................................................................................................15 第八讲 DREAMWEAVER中动态网页设计.............................................................................15 第九讲 DREAMWEAVER综合性网页设计案例.....................................................................16 第十讲 VBSCRIPT概述.............................................................................................................17 4.1 VBSCRIPT语言简介.............................................................................................................17 第十一讲 VBSCRIPT的基本元素与输入输出.........................................................................18 4.2.基本数据类型.......................................................................................................................18 4.2.表达式和运算符.................................................................................................................19 第十二讲 VBSCRIPT的条件语句、循环语句和过程.............................................................20 4.3 VBSCRIPT基本语句.............................................................................................................20
第一讲 网页设计概述
【教学内容】
讲解网页设计的相关术语及网站制作的基本流程。【教学目的】
使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣。【教学重点】
网页设计中的若干术语。【教学难点】
理解网页设计中的若干术语。【教学方式】
讲授式、讨论式、案例分析式。【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《Internet 网页工场》Wittime工作室 重庆出版社。
3、《WEB网站设计》Joel Sklar著 高等教育出版社。
4、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
1.1 WWW和URL 1.1.1 Web的起源
Web是World Wide Web的简称，一般也称之为WWW或3W 1.1.2 Web的特点和结构
Web最大的特点是使用了超文本（Hypertext）WWW采用C/S（客户机/服务器）工作模式
在浏览器和服务器之间应用HTTP（Hyper Text Transfer Protocol，超文本传输协议）作为网络应用层通信协议 1.1.3 URL URL的完整格式
协议://主机名或IP地址：端口号/路径名/文件名
1.2 IE5的使用
Web浏览器是浏览Internet资源的客户端软件
在Windows环境下使用的浏览器主要有Internet Explorer、Netscape Navigator、Mosaic等
1.2.1 IE5的界面 1.2.2 IE5的使用
列表标志的使用。【教学方式】
讨论式、案例分析式、练习式。【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《WEB网站设计》Joel Sklar著 高等教育出版社。
3、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
2.1 HTML文档的基本结构
2.1.1 HTML语法
1、双标记
语法：
<标记>内容
2、单标记 语法：<标记> 最常用的单标记是
3、标记属性 语法
<标记
属性1 属性2 属性3 … > 例子
4、注释语句 格式
例子
2.1.2 HTML文档的基本结构 【课后小结】
通过本次课的学习,要求能熟练掌握网页面的基本标志与格式标志,并能灵活运用 列表,有序列表,无序列表标志及属性。
第三讲 HTML的文本、图片与超级链接标志
【教学内容】
讲解HTML标准中的文本、图片与超级链接标志 【教学目的】
* 使学生了解标题元素,掌握字体,上下标,及特殊字符的标志。
< EM>......，强调文字，通常用斜体。
< STRONG>......，特别强调的文字，通常用黑体。
......，以等宽体显示西文字符。
......，使文字大小相对于前面的文字增大一级。
......，使文字大小相对于前面的文字减小一级。......，使文字成为前一个字符的上标。......，使文字成为前一个字符的下标。......，使文字显示为闪烁效果。2.2.6
文本修饰 2.2.7
预格式化文本 使用预格式化标记
不再忽略在此之间的空格、制表符与回车符等元素 2.2.8 转义字符与特殊字符
一般转义符都是以“&”开始，以“；”结束，一个转义符之间不能有空格 2.2.9 文本强制换行和不换行 文本强制换行
不换行 2.2.10 插入水平线 使用
标记
属性：Width，Size，Align，Noshade，color 2.2.11 使用列表
1、无序列表
2、有序列表
- 列表条目1
- 列表条目2......
3、定义列表
- 列表条目1
- 条目1的说明
- 列表条目2
- 条目2的说明 ……
...... 2.4.4 图像地图 【课后小结】
本节介绍了在网页中加入文本、图片和超级链接的标志与相应属性，熟练运用这些标志是制作多媒体网页的基础。超级链接标志中，书签链接是一类特殊的链接方式，理解和使用书签链接学习HTML中超级链接标志的难点。
第四讲 HTML表格、表单与框架标志
【教学内容】
讲解HTML中制作表格、表单与框架的标志。【教学目的】
使学生掌握简单表格、表单与框架的制作。【教学重点】
* 表格中单元格的合并以及表格嵌套和叠加操作。* 框架的嵌套使用。* 表单元素标志与属性。【教学难点】
* 理解表格属性rowspan与colspan的含义以及表格嵌套实现的基本思想。* 理解框架属性name、target的意义。
* 理解表单中相应元素对应标志及属性的含义。【教学方式】
案例分析式、项目教学 【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《WEB网站设计》Joel Sklar著 高等教育出版社。
3、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
2.5 插入表格
2.5.1 在网页中插入表格
表格的基本构成元素：表头，单元格，列，行
| 第一行第一列 | 第一行第二列 |
| 第二行第一列 | 第二行第二列 | FrameSpacing=“2“
BorderColor=”#008000“ >
2.7.3 子窗口属性设置
2.7.4 常见的框架窗口划分方法（1）标题和正文，分为上下两部分（2）层次结构，分为上中下三部分
（3）目录和标题，分为左上、左下、右三部分
（4）标题、目录和正文，分为上、左下、右下三部分（5）嵌套目录，分为左、右上、右下三部分 2.7.5 不支持框架的网页
