项目三2图像的效果化解释.ppt

网页设计与制作 任务二 图像的效果化（2） 一、工具的使用二、静态图像的效果处理 【知识回顾】 网页设计与制作 任务二 图像的效果化（2） 【回顾练习】 1、制作旋转图像 2、制作螺旋渐隐效果 提示：1、克隆、修改、变形 2、命令、创意 网页设计与制作 任务二 图像的效果化（2） 一、静态图像效果 1、样式和特效 2、状态延迟 3、CS4的光晕特效 4、滤镜 5、切片和热点 【知识准备】 网页设计与制作 【知识准备】 二、动态图像效果 1、逐帧动画 2、补间动画 形状补间——矢量图形 运动部件——元件 网页设计与制作 【任务】 制作旋转的椭圆 制作上升的气球 模拟探照灯效果 网页设计与制作 【任务一】制作旋转的椭圆 要求：采用逐帧的制作形式实现 示例： 网页设计与制作 【任务一实施】 1、【文件】|【新建】命令 2、“椭圆”工具，绘制椭圆 3、【窗口】|【状态】 4、复制椭圆，新建状态、粘贴，调整图形角度 5、重复4操作，查看播放效果 6、【文件】|【导出】 网页设计与制作 【任务二】制作上升的气球 要求：采用补间动画的制作形式模拟气球的升空过程 示例： 网页设计与制作 【任务二实施】-制作上升的气球 1、打开背景图片素材，“层”面板 “选项”按钮 ，选中“在状态中共享层”命令，将该层共享 2、新建元件：【编辑】|【插入】|【新建元件】，导入气球元件。 3、新建运动气球元件：【编辑】|【插入】|【新建元件】，确定气球元件的始末位置，并建立补间，【修改】|【元件】|【补间实例】。 4、新建层，拖放运动气球元件到画布 5、保存导出文件 网页设计与制作 【任务三】模拟探照灯效果 要求：采用补间动画的制作形式模拟探照灯效果 示例： 网页设计与制作 【任务三实施】-模拟探照灯效果 1、新建600*300的文件，画布颜色浅蓝 2、【编辑】/【插入】/【新建元件】“球” 网页设计与制作 3、椭圆工具，绘制球，元件中心与球心重合 元件画布编辑 库中生成元件 网页设计与制作 4、插入运动球元件 注：导出时不能设置导出的文件格式，导出的文件格式是在优化中设定的 在文件画布中插入元件 选择动画 网页设计与制作 5、拖动”ball“元件到”runningball“元件 6、克隆，调整初始和终止位置 7、【修改】/【元件】/【补间实例】创建补间，设置参数 元件画布编辑 网页设计与制作 8、新建层，文本工具，设置属性：“字体”为“楷体”，“颜色”为“白色”，“字号”为“96像素”，输入文本。 9、制作蒙版：文本层，【编辑】|【剪切】；图层1的“运动球”对象，执行【编辑】|【粘贴为蒙版】命令 10、保存导出 网页设计与制作 【拓展练习】 1、制作图片叠加效果 （提示：混合模式：叠加） 网页设计与制作 【拓展练习】 2、制作淡入淡出效果 （提示：不透明度） 网页设计与制作 【实训作业】 要求： 1、创建图像切片并为切片添加交互效果 2、 优化并导出图片 切片效果图 交互效果图 网页设计与制作 原始图片 交互图片 【实训素材】 提示：【编辑】|【插入】|【矩形切片】； “指针”拖动，设定交换区域 设置交换图像