Flash网页制作教程讲义1

1、1Flash 网页设计网页设计 周佳骏周佳骏 jiren_Tel:158565619182第一章第一章 FlashFlash概述概述 Flash发展历程发展历程 Future Splash Animator(1995，Microsoft、Disney) Flash1 (1996.11 ，Macromedia收购收购) Flash2 (1997.6 ，引入库的概念，引入库的概念 ) Flash3 (1998.5 ，增加影片剪辑、，增加影片剪辑、Javascript插件、插件、透明度和独立播放器）透明度和独立播放器） Flash4 (1999.6 ，增加变量、文本输入框、增强，增加变量、文本输入框

2、、增强的的Actionscript、流媒体、流媒体MP3 ) 3第一章第一章 FlashFlash概述概述 Flash发展历程发展历程（续）（续） Flash 5 (2000.8 ，Javascript 、智能剪辑智能剪辑、 HTMLHTML文本格式）文本格式） Flash MX（2002.3，Unicode、组件、组件、XMLXML、流媒、流媒体视频编码）体视频编码） Flash MX 2004 (2003.9，文本抗锯齿、增强的流，文本抗锯齿、增强的流媒体视频、媒体视频、ActionScript 2.0、行为）行为） Flash MX 2004 Pro（2003.9，Web Service

3、s、媒媒体播放组件、体播放组件、 ActionScript2.0的面向对象编程）的面向对象编程） 4第一章第一章 FlashFlash概述概述 Flash发展历程发展历程（续）（续） Flash 8 (2005.9 ，增强了对视频支持，可以打包，增强了对视频支持，可以打包成成Flash视频，即视频，即* *.flv.flv文件，改进了动作脚本面文件，改进了动作脚本面板板) ) Flash 8 Pro (2005.9 ，增强为移动设备开发的功，增强为移动设备开发的功能，方便创建能，方便创建Flash WebFlash Web ，增强的网络视频，增强的网络视频) ) Flash CS3(2007

4、， Adobe公司收购公司收购MacromediaMacromedia公公司后，首次推出的版本，最新的司后，首次推出的版本，最新的AS3.0AS3.0编程语言编程语言替换原来的替换原来的AS2.0AS2.0编程语言编程语言) ) 5第一章第一章 FlashFlash概述概述 Flash发展历程发展历程（续）（续） Adobe Creative Suite 4 Master Collection（简称（简称Adobe CS4Adobe CS4，含有最新版的，含有最新版的Flash CS 4Flash CS 4 ）Adobe CS5 (2011Adobe CS5 (2011年年) )6第一章第一章

5、 FlashFlash概述概述 部分版本的进入界面部分版本的进入界面7第一章第一章 FlashFlash概述概述 部分版本的进入界面部分版本的进入界面（续）（续）8第一章第一章 FlashFlash概述概述 部分版本的进入界面部分版本的进入界面（续）（续）9第一章第一章 FlashFlash概述概述 Flash发展方向发展方向应用程序开发应用程序开发软件系统界面开发软件系统界面开发手机领域的开发手机领域的开发游戏开发游戏开发 WebWeb应用服务应用服务站点建设站点建设 多媒体娱乐多媒体娱乐 10第一章第一章 FlashFlash概述概述 Flash特点特点文件较小，适合传输文件较小，适合传输

6、视觉吸引、动画和交互视觉吸引、动画和交互插件方式、浏览快速插件方式、浏览快速流式技术，同步实时放映流式技术，同步实时放映易集成（影片集成、网页集成）易集成（影片集成、网页集成）多媒体、声音处理多媒体、声音处理优秀工具、集绘图和文字处理于一身优秀工具、集绘图和文字处理于一身11第一章第一章 FlashFlash概述概述 Flash安装要求安装要求（Flash 8版本）版本） CPUCPU：P； 内存：内存：1G； 硬盘剩余空间：硬盘剩余空间：1G； 显示器分辨率：显示器分辨率：1024*768 ； 操作系统：操作系统：Windows98/ME/2000/2003/XP/Vista ；12第一章第

7、一章 FlashFlash概述概述 动画基础动画基础 动画的定义动画的定义l 所谓动画，是利用人类视觉暂留的特性，所谓动画，是利用人类视觉暂留的特性，快速播放一组静态图像，使视觉产生动态快速播放一组静态图像，使视觉产生动态的效果。一般影片采用的效果。一般影片采用2525幅幅/ /秒（秒（PALPAL）或）或3030幅幅/ /秒（秒（NSTCNSTC）。）。 动画的分类动画的分类l 从制作技术和手段角度来看，可分为以手从制作技术和手段角度来看，可分为以手工绘制为主的传统动画和以计算机制作为工绘制为主的传统动画和以计算机制作为主的电脑动画。主的电脑动画。13第一章第一章 FlashFlash概述概

8、述 传统动画的制作传统动画的制作l制作流程制作流程u人工绘制静态画面人工绘制静态画面拍摄并存储到胶片拍摄并存储到胶片标准速度播放，模拟真实运动效果。标准速度播放，模拟真实运动效果。 l特殊效果的制作特殊效果的制作u高速拍摄，常速播放；高速拍摄，常速播放；u低速拍摄，常速播放。低速拍摄，常速播放。14第一章第一章 FlashFlash概述概述 传统动画的制作传统动画的制作l 传统动画制作的四个阶段传统动画制作的四个阶段创意阶段：创意阶段：根据当前的材料构造影片内容，确定多根据当前的材料构造影片内容，确定多少人参与影片的规划和制作。少人参与影片的规划和制作。 i 剧本剧本/脚本脚本描述整个故事的详

9、细文本，不考虑摄制细节描述整个故事的详细文本，不考虑摄制细节 ii 故事板故事板导演根据剧本绘制类似连环画的草图，片段、场导演根据剧本绘制类似连环画的草图，片段、场景、镜头景、镜头 iii摄制表摄制表整个影片制作的进度规划表，指导动画创作集体整个影片制作的进度规划表，指导动画创作集体各方面人员统一协调工作，合理利用人力资源各方面人员统一协调工作，合理利用人力资源15第一章第一章 FlashFlash概述概述 传统动画的制作传统动画的制作l 传统动画制作的四个阶段传统动画制作的四个阶段设计阶段：设计阶段：i 设计设计人物设计和情节设计。确定前景、背景及道具的形式、人物设计和情节设计。确定前景、背

10、景及道具的形式、形状和关系，完成场景环境好背景图的设计制作。对动画人形状和关系，完成场景环境好背景图的设计制作。对动画人物或其他角色进行造型设计，绘制不同角度的标准页，供其物或其他角色进行造型设计，绘制不同角度的标准页，供其他动画人员参考他动画人员参考 ii音轨音轨对话与音乐要匹配。在动画制作前进行录音，把声音对话与音乐要匹配。在动画制作前进行录音，把声音精确的分解到每一幅画面的位置，最后的音轨必须和画面位精确的分解到每一幅画面的位置，最后的音轨必须和画面位置是对应的置是对应的 16第一章第一章 FlashFlash概述概述 传统动画的制作传统动画的制作l 传统动画制作的四个阶段传统动画制作的

11、四个阶段具体创作阶段具体创作阶段i 原画创作原画创作由动画师完成，一般一个动画师完成一个特定的动由动画师完成，一般一个动画师完成一个特定的动作和情节作和情节Ii 中间画创作中间画创作两幅原画之间的画，先由助理动画师设计一些中两幅原画之间的画，先由助理动画师设计一些中间画，其余再由美术人员内插绘制一些角色动作的连接画，原间画，其余再由美术人员内插绘制一些角色动作的连接画，原则是，在各原画之间追加的内插的连续动作的画，要符合指定则是，在各原画之间追加的内插的连续动作的画，要符合指定的动画时间，使之能表现的接近自然动作的动画时间，使之能表现的接近自然动作iii静电复制和墨水扫描静电复制和墨水扫描使用

12、特定的静电复制摄像机将草图使用特定的静电复制摄像机将草图转移到醋酸纤维胶片上，然后再用手工给印在胶片上的画面的转移到醋酸纤维胶片上，然后再用手工给印在胶片上的画面的线条进行描墨线条进行描墨iv着色渲染着色渲染对胶片进行着色对胶片进行着色17第一章第一章 FlashFlash概述概述 传统动画的制作传统动画的制作l 传统动画制作的四个阶段传统动画制作的四个阶段拍摄摄制阶段拍摄摄制阶段i 检查检查动画师对每一个动作进行细致的检查动画师对每一个动作进行细致的检查ii 拍摄拍摄将动画拍摄到彩色胶卷或录像带上。背景放在最将动画拍摄到彩色胶卷或录像带上。背景放在最下层，中间各层是不同的角色或前景等，通过移

13、动各层下层，中间各层是不同的角色或前景等，通过移动各层产生动画效果产生动画效果iii剪辑剪辑动画制作最后一步，是后期制作阶段一部分动画制作最后一步，是后期制作阶段一部分18第一章第一章 FlashFlash概述概述 电脑动画的制作电脑动画的制作l什么是电脑动画？与传统动画的区别？什么是电脑动画？与传统动画的区别？u利用传统动画基本原理，配合科学与艺利用传统动画基本原理，配合科学与艺术，突破静态、平面图像的限制，创造术，突破静态、平面图像的限制，创造出栩栩如生的动画作品。出栩栩如生的动画作品。u与传统动画相比，后者制作精细、艰苦，与传统动画相比，后者制作精细、艰苦，制作费用相当昂贵。制作费用相当

14、昂贵。 19第一章第一章 FlashFlash概述概述l二维电脑动画的制作二维电脑动画的制作u设计剧本设计剧本u绘制或摄取手稿图像绘制或摄取手稿图像u将绘制或摄取图像转换为透明画面将绘制或摄取图像转换为透明画面u画面的调整和修改画面的调整和修改u着色渲染着色渲染 u预演预演u录制录制20第一章第一章 FlashFlash概述概述l三维电脑动画的制作三维电脑动画的制作u设计剧本设计剧本u预处理预处理u造型造型u材质材质u光效光效 u运动设定运动设定u动画的渲染动画的渲染u动画的预演动画的预演u后期处理后期处理u录制录制21第一章第一章 FlashFlash概述概述l电脑动画的运动控制生成电脑动画

15、的运动控制生成u关键帧插值技术；关键帧插值技术；u变形动画技术（变形动画技术（FFDFFD）；）；u过程动画。过程动画。l动画脚本描述语言动画脚本描述语言uLogoLogo语言语言 uASASASAS语言语言 uCINEMIRACINEMIRA语言语言 uTDI ExploreTDI Explore脚本语言脚本语言 22第一章第一章 FlashFlash概述概述l电脑动画的应用与发展趋势电脑动画的应用与发展趋势u制作影片特技、制作游戏等；制作影片特技、制作游戏等；u研究虚拟现实的动画系统，其运动控制研究虚拟现实的动画系统，其运动控制将是使人工智能和机器人技术自动执行。将是使人工智能和机器人技术

16、自动执行。 23第一章第一章 FlashFlash概述概述 Flash动画设计的知识体系动画设计的知识体系 摘要摘要l 明确阐述了在应用明确阐述了在应用FlashFlash进行动画创作和部进行动画创作和部署的完整知识，对知识体系进行了总结归署的完整知识，对知识体系进行了总结归纳，在知识不断增长和爆炸的时代，我们纳，在知识不断增长和爆炸的时代，我们建立一个逻辑的知识体系，以利于用户快建立一个逻辑的知识体系，以利于用户快速、准确、完整地掌握它。速、准确、完整地掌握它。 24第一章第一章 FlashFlash概述概述 Flash动画设计的知识体系动画设计的知识体系 （续）（续） 关键词关键词l 动画

17、、三大基本功能、绘图、编辑图形、动画动画、三大基本功能、绘图、编辑图形、动画补间、形状补间，引导线，遮罩、时间轴，影补间、形状补间，引导线，遮罩、时间轴，影片剪辑、滤镜、图像混合模式、声音、视频、片剪辑、滤镜、图像混合模式、声音、视频、 Flash、Flash Player、ActionScript。25第一章第一章 FlashFlash概述概述 Flash动画设计的知识体系动画设计的知识体系（续）（续） 正文正文l Flash动画设计的三大基本功能是整个动画设计的三大基本功能是整个FlashFlash动动画设计知识体系中最重要、也是最基础的，包画设计知识体系中最重要、也是最基础的，包括：绘图

18、和编辑图形（括：绘图和编辑图形（基本基本）、补间动画（）、补间动画（核核心心）和遮罩（）和遮罩（出彩点出彩点）。）。l 这是三个紧密相连的逻辑功能。这是三个紧密相连的逻辑功能。Flash动画说到动画说到底就是底就是“遮罩遮罩+ +补间动画补间动画+ +逐帧动画逐帧动画”与元件与元件（主要是影片剪辑）的混合物，通过这些元素（主要是影片剪辑）的混合物，通过这些元素的不同组合，从而可以创建千变万化的效果。的不同组合，从而可以创建千变万化的效果。 26第一章第一章 FlashFlash概述概述 Flash的工作界面的工作界面菜单栏（菜单栏（1010大功能）大功能） 工具栏（工具栏（4 4部分）部分）舞台与标尺栏舞台与标尺栏时间轴时间轴属性面板属性面板面板（面板（3 3类）类）2728第一章第一章 FlashFlash概述概述 Flash动画的制作过程动画的制作过程 动画创意设计动画创意设计 l 明确目的明确目的构造影片内容构造影片内容写出详细剧本写出详细剧本设计具体场景；设计具体场景；l 人物设计和情节设计。人物设计和情节设计。 动画场景和镜头的制作动画场景和镜头的制作l 在制作过程中，一般以镜头为制作单位，在制作过程中，一般以镜头为制作单位，最终把镜头串接起来构成场景；最终把镜头串接起来构成场景；l FlashFlash中，软件可以自动完成三种