行业动态
当前位置: 主页 > 行业动态 >

澳门赌场flash动画制作步骤

发布日期:2020-07-30 13:25

 

  flash动画制作步骤_IT/计算机_专业资料。模块四 企业网站动画的制作 4.1 模块功能分析 根据网站建设方案,在与企业沟通、协调下分析设计网站宣传动画。 【能力目标】 ? 能够根据网站布局要求选择合适的动画尺寸,分析设计网站宣传动画 ? 能够

  模块四 企业网站动画的制作 4.1 模块功能分析 根据网站建设方案,在与企业沟通、协调下分析设计网站宣传动画。 【能力目标】 ? 能够根据网站布局要求选择合适的动画尺寸,分析设计网站宣传动画 ? 能够根据不同的动画选择不同的元件 ? 能够创建补间动画、引导层动画和遮罩效果 【知识目标】 ? 认识帧(Frame)、时间轴、图层 ? 熟悉图形元件、按钮元件和影片剪辑元件的不同用法 ? 理解补间动画、引导层动画和遮罩效果的制作方法 【素质目标】 ? 挖掘学生的创造力、激发学生的艺术设计能力 ? 培养学生的沟通、合作能力 ? 培养学生自我学习、解决问题的能力 4.2 模块任务实施 任务 1 企业宣传动画的制作 一 任务分析 根据需求方提出的设计要求和沟通,确定了网站的 Banner 条采用 Flash 设计制作,以达到 增加页面动态效果和美化页面的效果。 二 任务实施 步骤 1 新建一个 Flash 文档,命名为“banner.fla”,设置【属性】面板中的文档大小属性 为宽 900 像素、高 260 像素,如图所示 图 文档属性 步骤 2 选择【文件】【导入】【导入到库】菜单选项,在打开的对话框中选择需要导入的 素材文件“banner-1.jpg”和“xiaotu.gif”两个图片,单击【确定】按钮,此时素材导入 到库中,如图所示。 图 库面板 步骤 3 将“banner-1.jpg”拖动到舞台中,调整其大小使其覆盖整个舞台。 步骤 4 单击【时间轴】面板下方的添加新图层按钮 ,添加【图层 2】。 步骤 5 鼠标单击【图层 2】的第一帧,然后选择工具箱中的【文本】按钮 ,在打开的【属 性】面板中,设置【字体】为“华文楷体”,【字体大小】为“53”,【字体颜色】为“#003300”。 步骤 6 在舞台中输入“选择森兴选择品质”这 8 个文字。 步骤 7 选中文字,选择【修改】【分离】命令,文字被打散。效果如图所示。 图 分离文字 步骤 8 选择【图层 1】的第 40 帧,插入一个普通帧。按住【CTL】键,选中【图层 2】的第 1 帧、第 5 帧、第 10 帧、第 15 帧、第 20 帧、第 25 帧、第 30 帧、第 35 帧、第 40 帧,插 入一个关键帧。 步骤 9 选择【图层 2】的第 1 帧,按下【Delete】键删除所有的文字。 步骤 10 选择【图层 2】的第 5 帧,删除“择森兴选择品质”这 7 个字。 步骤 11 选择【图层 2】的第 10 帧,删除“森兴选择品质”这 6 个字。 步骤 12 同理设置【图层 2】的第 15 帧、第 20 帧、第 25 帧、第 30 帧、第 35 帧、第 40 帧 上的文字。 步骤 13 单击【时间轴】面板下方的添加新图层按钮 ,添加【图层 3】。单击【图层 3】的 第一帧,从【库】面板中拖入“xiaotu.gif”,选中图片,按下【F8】将其转换成图形元件。 步骤 14 单击【图层 3】的第 40 帧添加关键帧;在【变形】面板中设置第 1 帧图形为“10%”, 在属性面板中设置【颜色】为“alpha”值为“20%”,如图所示;在【变形】面板中设置第 40 帧图形为“100%”,在属性面板中设置【颜色】为“alpha”值为“70%”;在第 1 帧和第 40 帧之间添加【补间动画】;至此动画设置如图所示。 图 变形面板 步骤 14 按下【CTRL】+【ENTER】,测试效果,如图所示。 图 动画界面 三 知识梳理 知识结构如图所示。 图 banner 条动画效果 Flash 工作界面 站 点 的 建 立 企 业 宣 传 动 画 的 制 作 Flash 工具箱 Flash 元件 Flash 动画 图 知识结构图 1 Flash 工作界面 打开一个 Flash 文档进入其工作界面,它包括标题栏、菜单栏、工具箱、时间轴、舞台、属 性面板和面板区,如图所示。 图 Flash 工作界面 (1)标题栏 每一个应用程序窗口文档的最上方都会有一个标题栏,显示当前文档的名称。 (2)菜单栏 Flash 菜单栏共包含 11 菜单项,每个菜单项有包含若干操作项,具体如图所示。 图 文件菜单 图 编辑菜单 图 视图菜单 图 修改菜单 图 插入菜单 图 文本菜单 图 命令菜单 图 测试菜单 图 窗口菜单 2 Flash 工具箱 工具箱位于窗口的左侧,用户可以随意拖动到合适的位置。它提供了 Flash 常用的各种工具。 ? 选择工具 选择工具 是最常用的工具之一。使用它不仅可以选择对象,还可以移动对象 选中选择工具后,在舞台中单击鼠标左键并拖动鼠标即可选择图形,如图所示。 图 选择工具 ? 部分选择工具 部分选择工具 是修改和调整路径时经常使用的工具,它可以通过选择对象的锚点实现编 辑、移动和变形。 单击部分选择工具 按钮,然后单击舞台中图形的轮廓线,就会出现很多控制点,如图所 示。鼠标移动到控制点上变成 形状时,单击可以移动控制点;鼠标移动到 2 个控制点之 间时变成 形状,单击可以拖动图像。 图 部分选择工具 ? 任意变形工具 任意变形工具主要是对选中的对象进行旋转、扭曲和缩放。 ? 套索工具 套索工具主要是对对象局部进行选区。它分成魔术棒和多边形模式。 ? 铅笔工具 它用来绘制任意形状的线条和图形。单击铅笔按钮会在选项区域出现铅笔模式选择:伸直、 平滑和墨水 3 个选项,如图所示。 图 铅笔模式 【伸直】模式可以在绘制过程中将线条自动伸直,使其尽量直线化,简单的说伸直模式可以 画出平直的线条,并可将近似于三角形、椭圆、矩形和正方形的图形转换为标准的几何图形。 【平滑】模式可以在绘制过程中将线条自动平滑,使其尽可能成为有弧度的曲线,简单的说 平滑模式可画出平滑的曲线。 【墨水】模式则是在绘制过程中保持线条的原始状态,即墨水模式可随意画线。 除此之外,通过属性面板可以对铅笔工具进行笔触颜色、笔触高度(线宽)和笔触样式(线 形)或者自定义笔触样式设置,如图所示。 图 铅笔属性面板 ? 钢笔工具 使用钢笔工具可以绘制出直线或者平滑流动的曲线,在绘制过程中可以通过调整路径节点或 节点控制手柄来绘制出复杂的线段或图形。 单击钢笔工具,在舞台上单击一点,然后在另一边单击一点,则可以画出一条直线,如图所 示。如果单击另一点的同时拖动鼠标则可以绘制一条曲线,如图所示。 图 直线 图 曲线 【添加锚点】工具:选择该工具单击现有路径,可添加一个锚点。 【删除锚点】工具:选择该工具单击现有路径上的一个锚点,则删除该锚点。 【转换锚点】工具:选择该工具单击现有路径上的一个锚点,将其转换为带有独立方向线的 转角点。 ? 橡皮擦工具 橡皮擦工具有两种模式:一种是水龙头 ,一种是橡皮擦 。 选择【水龙头工具】 ,单击你需要擦除的填充区域或笔触段,可以快速将其擦除。如果 你只擦除一部分笔触或填充区域,就得通过拖动进行擦除。 橡皮擦 提供了 5 种擦除模式: 【标准擦除】:擦除同一层上的笔触和填充。 【擦除填色】:只擦除填充,不影响笔触。 【擦除线条】:只擦除笔触,不影响填充。 【擦除所选填充】:只擦除当前选定的填充,并不影响笔触(不管笔触是否被选中)。以这 种模式使用橡皮擦工具之前,请选择你要擦除的填充。 【内部擦除】:只擦除橡皮擦笔触开始处的填充。如果从空白点开始擦除,则不会擦除任 何内容。以这种模式使用橡皮擦并不影响笔触。 3 Flash 元件 Flash 中的元件有图形元件、按钮元件和影片剪辑元件 3 种。 ? 图形元件是可以重复使用的静态图像,它是作为一个基本图形来使用的,一般是静止的 一副图画,每个图形元件占 1 帧。例如创建一个星星图形元件。 步骤 1 新建一个 Flash 文档,单击【插入】菜单【新建元件】命令,在弹出的对话框中输 入“星星”,类型选择“图形”。 图 创建元件对线 单击确定按钮后进入星星图形元件的编辑界面。选择工具栏中的多变形工具 ,在 属性面板中设置笔触为“无”,填充为“线性白黑渐变”;单击【选项】按钮,设置样式为“星 形”、边数“8”、星形顶点大小“0.01”,如图所示。 图 工具设置 步骤 3 在界面中单击鼠标左键拖动,即可画出一个星星图形,如图所示。 图 星星图形 ? 按钮元件实际上是一个只有 4 帧的影片剪辑,但它的时间轴不能播放,只是根据鼠标 指针的动作做出简单的响应,并转到相应的帧,通过给舞台上的按钮添加动作语句而实 现 flash 影片强大的交互性。例如创建一个椭圆形按钮元件。 步骤 1 新建一个 Flash 文档,单击【插入】菜单【新建元件】命令,在弹出的对话框中输 入“椭圆形”,类型选择“按钮”。 图 创建元件对线 单击确定按钮,进入“椭圆形”按钮元件编辑界面,它有 4 个状态,如图所示。 图 按钮编辑界面 步骤 3 在【弹起】状态,选择工具栏中的椭圆工具按钮 ,设置属性面板笔触为“无”, 填充为“#009900”,单击鼠标左键在界面中拖动,即可画出一个椭圆形按钮的形状,如图所 示。 图 【弹起】状态 步骤 4 在【鼠标经过】状态,添加一个关键帧。选中椭圆形,在属性面板中设置填充颜色 为“#33cc33”,同理在【按下】和【单击】状态也可以改变椭圆形的颜色。 步骤 5 将库中的按钮拖动到场景的舞台中,设置舞台大小和按钮一致,使用【对齐】面板 设置按钮的位置为水平居中、垂直居中,预览效果如下。 图 对齐面板 图 按钮预览 步骤 6 选择舞台中的按钮,在属性面板中选择【滤镜】,单击 按钮可以添加一种滤镜效果, 单击 按钮可以删除一种已经添加的滤镜效果,如图所示。 图 滤镜效果设置 ? 影片剪辑元件可以理解为电影中的小电影,可以完全独立于场景时间轴,并且可以重复 播放。影片剪辑是一小段动画,用在需要有动作的物体上,它在主场景的时间轴上只占 1 帧,就可以包含所需要的动画,影片剪辑就是动画中的动画。“影片剪辑”必须要进 入影片测试里才能观看得到。例如创建一个 3s 的星空星星闪烁的效果。 步骤 1 新建一个 Flash 文档,首先创建一个星星图形,如图所示。 步骤 2 新建一个影片剪辑动画“闪烁的星星”。选中图层 1 的第一帧,将星星图形从库中拖 到影片的编辑界面,然后单击图层 1 的第 36 中添加一个关键帧,修改星星图形的颜色为 “ALPHA”,值为“20%”;然后在图层 1 的第 1 到第 36 帧之间添加补间动画;效果如图所示, 这样一个星星的颜色由深到浅的影片剪辑动画就创建好了。 图 星星闪烁影片剪辑 步骤 3 将影片剪辑拖动到场景 1 的舞台中,运行就可以看到效果了。为了更好的模拟星空 的效果,可以多做几个不同效果的星星闪烁的影片剪辑。 4 Flash 动画 Flash 动画归纳起来包括逐帧动画、补间动画、遮罩动画和引导层动画 4 类。 (1)逐帧动画 在时间帧上逐帧绘制帧内容称为逐帧动画,由于是一帧一帧的画,所以逐帧动画具有非常大 的灵活性,几乎可以表现任何想表现的内容。 常用的几种创建逐帧动画的方法: 方法 1:用导入的静态图片建立逐帧动画,用 jpg、png 等格式的静态图片连续导入 Flash 中,就会建立一段逐帧动画。 方法 2:绘制矢量逐帧动画,用鼠标或压感笔在场景中一帧帧的画出帧内容。 方法 3:文字逐帧动画,用文字作帧中的元件,实现文字跳跃、旋转等特效。 方法 4:导入序列图像,可以导入 gif 序列图像、swf 动画文件产生的动画序列。 例如创建一个文字逐帧动画。 ? 步骤 1 新建一个 Flash 文档,命名为“文字逐帧动画.fla”,设置【属性】面板中的文 档大小属性为宽 800 像素、高 150 像素,如图所示。 图 文档属性 步骤 2 选择【文件】【导入】【导入到库】菜单选项,在打开的对话框中选择需要导入 的素材文件,单击【确定】按钮,此时素材导入到库中,如图所示。 图库 步骤 3 将“Beijing.jpg”拖动到舞台中,调整其大小使其覆盖整个舞台。 步骤 4 单击【时间轴】面板下方的添加新图层按钮 ,添加【图层 2】。 步骤 5 鼠标单击【图层 2】的第一帧,然后选择工具箱中的【文本】按钮 ,在打开的【属 性】面板中,设置【字体】为“华文楷体”,【字体大小】为“70”,【字体颜色】为“#009900”。 步骤 6 在舞台中输入“森兴送您大自然”这 7 个文字。 步骤 7 选中文字,选择【修改】【分离】命令,文字被打散。效果如图所示。 图 分离文字 步骤 8 选择图层 1 的第 35 帧,插入一个普通帧。按住【CTL】键,选中【图层 2】的第 1 帧、第 5 帧、第 10 帧、第 15 帧、第 20 帧、第 25 帧、第 30 帧、第 35 帧,插入一个关键帧, 如图所示。 图 添加关键帧 步骤 9 选择【图层 2】的第 1 帧,按下【Delete】键删除所有的文字。 步骤 10 选择【图层 2】的第 5 帧,删除“兴送您大自然”这 6 个字。 步骤 11 选择【图层 2】的第 10 帧,删除“送您大自然”这 5 个字。 步骤 12 同理设置【图层 2】的第 15 帧、第 20 帧、第 25 帧、第 30 帧、第 35 帧上的文字。 步骤 13 选择【控制】菜单【测试影片】命令,效果如图所示。 图 文字逐帧动画 (2)补间动画 Flash 中在两个关键帧中间要做“补间动画”,才能实现图画的运动,插入补间动画后 两 个 关 键 帧 之 间 的 插 补 帧 由 计 算 机 自 动 运 算 生 成 ;补 间 动 画 分 成 两 类 :一 类 是 形 状 补 间,用于形状的动画;另一类是动作补间用于图形及元件的动画 ? 形状补间动画 形状补间动画是在 Flash 的时间帧面板上,在一个关键帧上绘制一个形状,然后在另 一个关键帧上更改该形状或绘制另一个形状等,Flash 将自动根据二者之间的帧的值 或 形 状 来 创 建 的 动 画 ,它 可 以 实 现 两 个 图 形 之 间 颜 色 、形 状 、大 小 、位 置 的 相 互 变 化 。 形 状 补 间 动 画 建 立 后 ,时 间 帧 面 板 的 背 景 色 变 为 淡 绿 色 ,在 起 始 帧 和 结 束 帧 之 间 也 有 一 个 长 长 的 箭 头 ;构 成 形 状 补 间 动 画 的 元 素 多 为 用 工 具 栏 工 具 绘 制 出 的 形 状 ,而 不 能 是图形元件、按钮、文字等,如果要使用图形元件、按钮、文字,则必先打散( Ctrl+B) 后才可以做形状补间动画。 例如创建一个形状补间动画,一个圆逐渐变成一个字。 步骤 1 新建一个 Flash 文档,命名为“形状补间.fla”。 步骤 2 单击【图层 1】的第 1 帧;选择工具箱中的【圆形】工具按钮 ,在【属性】 面板中设置【笔触】为“无”、【填充】为“红色”;在舞台中画一个宽 90.5 的一个圆, 修改其相对舞台的对齐方式为“水平居中、垂直居中”。 步骤 3 单击【图层 1】的第 25 帧,添加一个关键帧,按下【delete】删除原来的圆; 选择工具箱中的【文字】按钮 ,在打开的【属性】面板中,设置【字体】为“华文楷 体”,【字体大小】为“70”,【字体颜色】为“红色”;在舞台中输入一个字“变”,修改其相 对舞台的对齐方式为“水平居中、垂直居中”。 步骤 4 选中文字,然后选择【修改】菜单【分离】命令。 步骤 5 鼠标单击他【图层 1】的第 1 帧到第 25 帧中的任意帧,在属性面板中设置【补间】 为“形状”。 步骤 6 按下【CTRL】+【ENTER】,测试效果,如图所示。 ? 动作补间动画 图 形状补间 动作补间动画是指在 Flash 的时间帧面板上,在一个关键帧上放置一个元件,然后在 另一个关键帧改变这个元件的大小、颜色、位置、透明度等,Flash 将自动根据二者 之间的帧的值创建的动画。动作补间动画建立后,时间帧面板的背景色变为淡紫色, 在 起 始 帧 和 结 束 帧 之 间 有 一 个 长 长 的 箭 头 ;构 成 动 作 补 间 动 画 的 元 素 是 元 件 ,包 括 影 片剪辑、图形元件、按钮、文字、位图等,但不能是形状,只有把形状组合或者转换 成 元 件 后 才 可 以 做 动 作 补 间 动 画 。下 面 的 遮 罩 动 画 和 引 导 层 动 画 中 用 的 都 是 动 作 补 间 动画,这里就不再举例了。 (3)遮罩动画 遮罩动画是 Flash 中的一个很重要的动画类型,很多效果丰富的动画都是通过遮罩动 画来完成的。 “遮罩”主要有 2 种用途,一个作用是用在整个场景或一个特定区域,使场景外的对 象 或 特 定 区 域 外 的 对 象 不 可 见 ,另 一 个 作 用 是 用 来 遮 罩 住 某 一 元 件 的 一 部 分 ,从 而 实 现一些特殊的效果。 例 如 设 置 遮 罩 动 画 ,在 一 个 全 黑 的 界 面 中 ,一 个 圆 在 运 动 ,下 面 显 示 一 个 一 幅 风 景 图 的部分内容。 步骤 1 新建一个 Flash 文档,命名为“遮罩.fla”,在【属性】面板中设置文档【背景】为 “黑色”。 步骤 2 添加一个【图层 2】,选择【文件】菜单【导入】【导入到库】命令,选择一幅图 片。 步骤 3 从【库】中将该图片拖入舞台,在【对齐】面板中设置【匹配大小】为“宽度匹配、 高度匹配”。 步骤 4 添加一个【图层 3】,选择工具箱中的【圆形】工具按钮 ,在【属性】面板中 设置【笔触】为“无”、【填充】为“红色”;在舞台中画一个宽 100 的圆。选中该圆,按 【F8】将该圆转换成一个图形元件。 步骤 5 在【图层 3】的第 25 帧、第 50 帧分别添加关键帧;分别改变第 25 帧、第 50 帧是圆 的位置;在第 1 帧到第 25 帧和第 25 帧到第 50 帧之间添加【补间动画】。 步骤 6 选中【图层 3】,单击右键在弹出的菜单中选择【遮罩】,如图所示。 图 设置遮罩层 步骤 7 按【CTRL】和【ENTER】测试影片,效果如图所示。 图 遮罩效果 (4)引导层动画 在影片中将一个或多个图形链接到一个引导路径,使这些图形沿着既定的路径运动的形式被 称为引导层动画。 例如设置引导层动画,一辆汽车沿着事先预定的路线 新建一个 Flash 文档,命名为“引导层.fla”,设置文档【背景】为“绿色”。 步骤 2 添加一个【图层 2】,选择【文件】菜单【导入】【导入到库】命令,选择一幅汽 车图片。 步骤 3 从【库】中将该图片拖入舞台,选则汽车图像,按下【F8】转换成图形,如图所示。 图 添加汽车元件 步骤 4 单击时间轴上的【图层 1】右击在弹出的下拉菜单中选择【添加引导层】,鼠标单击 【引导层】的第 1 帧;然后单击工具箱中的铅笔按钮 ,在舞台中划出一条曲线,如图所 示。 图 添加引导层 步骤 5 选中【图层 1】和【引导层】的第 40 帧,添加关键帧。 步骤 6 调整【图层 1】的第 1 帧汽车的位置和第 40 帧汽车的位置,并添加【补间动画】,可 以看到汽车沿着曲线运动,但是当汽车上坡和下坡时车头方向不对,需要在适当的位置添加 关键帧,对汽车进行微调。 步骤 7 设置完成的效果如图所示。 图 最终效果 4.3 模块完成情况评估 Flash 宣传动画设计应以商业化为目标,需要设计者与企业进行不断的沟通,一方面要满足 企业行业需求,另一方面要满足浏览者得审美需求。 设计完成后,从专业技能和职业素养方面进行考核,考核内容如表所示。 情境 评价方式 评价标准 分值 学生互评 过程考核 企业网站动 教 画的制作 师 评 价 网站宣传动 画 答辩 能够小组成员互相协作、敬 10% 业、认真完成分工任务 遵守学校的各项规章制度 拥有分析问题、解决问题的能 30% 力 拥有独立思考意识、勇于克服 困难的素质 作品: ? 色彩搭配要和整个界面 40% 和谐统一 ? 宣传动画设计要有创意 设计报告:规范合理 ? 语言表达:口齿清楚流利 20% ? 仪表气质:举止大方 ? PPT 设计:内容充实、设 计美观