二维动画的原理和类型 二维动画的设计制作方法 GIF动画和Flash动画的特点及原理 GIF动画和Flash动画的应用

Slides:



Advertisements
Similar presentations
§10.1 生活中的轴对称 一. 中外建筑 二. 脸谱艺术.
Advertisements

今天我们会去一个充满神秘色彩的地方 你知道是哪吗.
领舞者:聋人邰丽华 观看了聋人表演的《千手观音》,你想说点什么呢?.
第八章 多媒体应用软件.
第1章 基础设计知识  学习目标 学习有关动画的相关知识,以及Flash入门中需要掌握的一些基本操作。主要内容包括Flash动画的特点、应用领域, Flash CS5的基本操作,Flash动画制作过程等。同时通过完成本章习题,更好地掌握本章知识点,为以后的学习打下基础。  学习重点 熟悉Flash动画的特点以及应用领域、Flash.
2015退伍士兵焊工专业 第一学期 课程名称:计算机基础(一).
现代教育技术中心 电教中心 罗勇为 计算机教育应用 (计算机辅助教学) (CAI课件制作) 现代教育技术中心 电教中心 罗勇为
制作精美简报 展示班级风采 娄巍 2011年10月29日.
第二章 网页艺术设计的技术基础.
江西省基础教育资源网相关操作 江西省基础教育资源网相关操作
文賢國小101年度上半年在職教師資訊應用培訓 ----自由軟體系列 輕鬆學會做 -Scratch 教材設計:林森富老師.
第七讲 网络教育资源 武法提 教授 北京师范大学教育学部.
第 9 章 多媒體.
加入圖片.
第二章 FrontPage2003概览.
第三课 走向自立人生.
animation-Introduction
第1章 网页、网站制作基础 1.1 网页与网站的概念 1.2 Web标准 1.3 网页制作的常用软件 1.4 构成网页的基本元素
《化工原理》电子教案 主编:王 瑶 韩志忠 主审:匡国柱 都 健 顾问:樊希山 普通高等教育电子教案系列 高等教育电子出版社
《平面图像处理》 精晶课程设计 厦门城市职业学院 计算机教研室.
2007年第 5 期 总第 18 期 2007年3月12日出版.
3.3 动 画 处 理 技 术 本节要点 计算机动画的基本工作原理 计算机动画的分类 使用Flash二维动画工具
大学计算机.
網頁介面設計的基礎理論 講師:鄭靜怡 本教材內容出自於網頁界面設計藝術教程,人民郵電出版社.
一、认识flash.
听完介绍,请你描述一下脑海中的凤城河 新课导入 请你听一段声音:《美在凤城河》
第七章 多媒体应用基础.
FLASH课件制作 2017/3/22.
第一章 Photoshop7.0基础知识 本章要点 本章难点 本章主要介绍使用图像处理软件Photoshop7.0
第8章 多媒体网页制作.
小学语文第三册第八课 难忘的一天 生字 图片 朗读 词语 写字 音乐.
多媒體簡報與製作研習課程 影像處理 2017年4月8日星期六.
欢迎学习Photoshop CS基础教程 目 录 第9章:综合实例 第8章:ImageReady 第7章:滤镜的使用 第6章:通道和蒙版
許麗玲 高雄師範大學工業科技教育學系兼任講師 高雄縣鳳山市新甲國小資訊組長
回主目錄.
项目九 实现任务自动化   如果有大批量的图片需要做统一处理,比如将照片裁剪成统一大小的尺寸或者加水印之类,它们的处理模式是相同的,手动操作的话实在是费力又费时间,需要重操作很多次,这时可以使用photoshop的批处理功能来实现。当然前提是要进行统一的动作时才能应用批处理的哦。 动作是用于记录图像命令的工具,使用动作可以将用户对图像所做的操作步骤记录在动作面板中,当用户需要重复使用该步骤时,只需播放该动作即可。
五年级教材分析与建议 台州市路桥小学 陈晓.
第5章 导入图形图像和视频.
第6章 電腦科技的相關應用─影像處理 6-1 影像處理的基本知識 6-2 PhotoImpact 的基本操作 6-3 影像編輯技巧
目标 理解多媒体的基本概念、多媒体信息及技术的特点、多媒体技术的应用。掌握多媒体计算机系统的基本组成及简单原理。
内容提要: 数字图像处理的发展简史 图像处理的任务 基本的图像处理系统 图像各种形式的表示 MATLAB图像处理工具箱简介。
FrontPage 2003 網頁設計初階 國立臺灣師範大學 資訊中心(ITC) 陳 明 芳 先生
第8章 测试与发布Flash动画  学习目标 了解Flash动画的测试、优化,Flash作品的导出类型以及发布设置与预览的相关知识。 。
数字媒体技术基础 (第6章 数字视频技术) 周苏 教授 浙江大学城市学院 QQ:
3-1 想做出甚麼樣的網站 現在您對網站、網頁已經有基本的概念了,不過要實際開始製作網站,還需要經過規劃的過程。本章中尚未開始動手設計網頁,而先來學習建立網站的重要觀念也就是網站的規劃與設定,首先您必須先對自己要建立的網站有基本的架構,才能動手建立網站,做好後續網頁設計的工作。可別看這個過程,這是能不能建構出一個好網站的重要關鍵,也是設計網站人員必須用心思考、規劃的部分。
數位家庭我的家 大導演開麥拉 社區大學電腦講師 黃仲銘
Microsoft® Office SharePoint® Server 2007 訓練
97學年度嘉義市教師資訊應用評鑑研習(南興國中)
中華技術學院 網頁設計研習會.
网页制作与设计 主编 耿 杰 科学出版社.
第3章 图像和其他媒体.
常見的聲音格式 MP3 聲音格式:有鑑於WAV 聲音檔實在太大, 因此就產生了MP3 聲音格式。其利用MPEG 壓縮法將音樂進行失真性壓縮, 一段50 MB 左右的WAV 檔轉成MP3格式之後, 往往只剩下 4、5 MB。 雖然MP3 是採用失真性壓縮的演算法, 但還能維持不錯的音質, 一般人並無法聽出轉換前後的細微差別。同時也因為儲存空間大幅減少而廣受歡迎。
多媒體素材概要 圖片聲音和視迅.
珍愛一世情 製作青春紀實MV 珍愛一世情 製作青春紀實MV 教學對象:國中二年級 課程範圍:藝術與人文 2上.
多媒體設計 高慧君 台北市立南港高中 2007年6月1日.
第2章 Photoshop 基本操作 2.1 Photoshop的操作环境 2.2图像文件的操作 2.3 图像窗口的基本操作
網頁製作 東海國中資訊組.
小朋友们好! 场景一:线索人物孙悟空自我介绍,配合自动语音。.
W3C标准网页制作 主讲教师:张 涛.
論四端 孟子 一. 關於孟子…… 孟子,名軻,字子輿,戰國時鄒人。他受業於孔子孫子思的門人,是繼孔子後,儒家的另一位代表人物,給人尊稱為「亞聖」。 你想了解孟子更多的生平事蹟嗎?你聽過「孟母三遷」的故事嗎? 試用滑鼠指向孟子畫像,然後在滑鼠左邊連按兩下。
前言 无论从艺术表现形式还是渲染效果来说,动画应是多媒体作品中最具表现力的一种媒体形式。动画源于图像 ,是多幅图像沿着时间坐标轴的重新排列。在多媒体作品中动画表现方式主要包括二维动画和三维动画两各种。
计 算 机 应 用 基 础 潍坊学院 计算机工程学院 主讲人 王鑫.
何謂gif動畫? GIF是Graphics Interchange Format的縮寫,意思是「圖像交換格式」
第1章 Authorware 7.0基础知识 新乡学院 教育技术学教研室.
遮罩动画的概念 (1)什么是遮罩 “遮罩”,顾名思义就是遮挡住下面的对象。 “遮罩动画”是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。 在分析数据时,您经常会问及一些问题,如: 过去两年的招生情况反映出哪些倾向?有哪些异常情况?
项目一 了解网站的概念 项目二 创建个人网站“鸿渐工作室” 项目三 制作“鸿渐工作室”的主页 项目四 HTML语言 项目五 制作“家乡特产”网页 项目六 制作“给我留言”网页 项目七 制作“应用技巧”网页 项目八 模板制作及应用.
多媒体技术与应用 主讲教师:肖平 E_m a i Q Q:
10.4 圓之切線方程 附加例題 6 附加例題 7 © 文達出版 (香港 )有限公司.
¶幻灯片应用基础教程 幻灯片应用基础教程.
第9章 多媒体技术.
Presentation transcript:

二维动画的原理和类型 二维动画的设计制作方法 GIF动画和Flash动画的特点及原理 GIF动画和Flash动画的应用 GIF Animator 5的操作和应用实例 Flash MX的操作和应用实例

计算机动画以很强的表现力,直观形象的向人们展示着各种运动现象和动画艺术作品。它以强有力的视觉冲击力和风趣幽默的艺术特点,已成为多媒体素材中最具吸引力的信息媒体。 在影视作品、科学研究、模拟演示、课堂教学、仿真实验、建筑造型、多媒体应用程序、教学课件等方面,都呈现出了它具大的作用。

7.1 二维动画基础 二维动画又叫作“平面动画”,它是沿用传统动画的概念而称呼的。它们所具有特点就是把一些原本没有生命活力的静态对象,通过拍摄,制作成了在视觉中具有生命活力、可以活动的动态对象。并且这些动态的影像,可以是现实的,也可以是虚幻的。它是影视艺术中深受欢迎的一种作品形式。

7.1.1 二维动画原理 “动画”,顾名思义,就是“动着的图画”。它是由一组连续的画面而组成的,每一张画面与它前后的画面都有一些不同的差别,当把这些画面连续播放时,在人的视觉中就可以形成连续的动画,产生动态效果。 产生这种动态效果的原理,是因为人类的眼睛具有一种视觉滞留效应。即人类眼睛在看物体的时候,物体的影像在人的大脑神经中会停留一定的时间,当看到的物体在人眼的视觉中已经消失时,大脑中还会残留有该物体的影像。

帧和帧速率 帧(Key Frame):指在一段活动影像中,每幅的静止画面,又称为“帧画面”。 帧速率 :指每秒钟播放帧画面的数值。 电影为24帧/秒 PAL制式的电视为25帧/秒 NTSC制式的电视为30帧 Flash动画为12帧/秒

动画和视频影像之间的差别 动画中的帧画面是由人工绘制或由计算机软件绘制而成的,画面中的形象都是由点、线、面构成的。动画具有颜色单调、色彩不丰富、形象不真实的特点。 视频影像由于是用摄录设备对真实景物拍摄而形成的,它的帧画面不是由人工而绘制形成的,每个帧画面可以说就是一张相片,每幅画面都是对影像的真实记录,它具有颜色种类多,色彩层次丰富,形象真实自然等特点。

计算机二维动画的特点 二维动画属于计算机辅助动画,主要是借助计算机来完成传统手工绘制动画的工作。 二维动画的制作,具有相当高的准确性和一致性,在编辑修改方面具有一定的方便性和可靠性。 可以充分利用拷贝、粘贴、放大、缩小、翻转、旋转、变形等操作降低工作的重复性和劳动强度,有效的提高制作效率和缩短制作周期。

7.1.2二维动画的设计制作方法 形象设计 对象 动画设计 动作 绘制图像 图片 动画制作 动画

7.1.2.1 动画的设计 确定一个对象的基本动态形式。 将动态过程分解成即有连续性又有差别性的基本单元。 设计绘制连续的图像,画面数量可多可少,但应多于两幅画面。 毫无规律和杂乱无章的画面对动画的制作无实际意义。

1、设计原则 动画必须是由多个画面而组成的,并且画面的内容必须是连续有规律性的。 画面中对象的动作在相邻两幅画面的变化中只能有微小的差别,后一幅画面往往是前一幅画面的继续。 可以在严格遵循运动规律的前提下,进行适当的夸张和突出。 动画的节奏要以符合自然运动规律为标准。

2、二维动画的表现形式 关键帧动画 路径动画 变形动画

①关键帧动画 主要是通过对关键帧(Key Frame)图画来完成整个动画的设计制作过程。 先将图画中对象发生转折变化的画面进行设计和制作,然后再由计算机对关键帧中间的画面进行插值补充,就可以形成动画效果。它可以对物体的位置、方向、颜色等运动参数进行组合插值,产生中间的帧画面。

关键帧动画原理

②路径动画 主要是通过路径(线路)的设置来完成动画的设计制作过程。 先设计制作好一个物体对象 。 再设置固定一个运动路径 ,路径是直线,也可以是曲线或折线。 将对象设置到沿路径的线路进行运动 。

路径动画原理

③变形动画 先设置两个内容截然不同的关键帧。 然后再两个关键帧之间设定一定数量的过渡帧。 最后通过计算机软件的功能,在过渡帧中插值形成连续过渡的图画,形成渐变过渡变化的效果。

变形动画原理 关键帧 过渡帧

7.1.2.2二维动画的制作 设置编辑关键帧 中间过渡帧画面的生成 分层制作整体合成 交互方式的设置 测试和预演

7.1.3二维动画软件及文件格式 不同的动画制作软件可以制作不同形式和不同文件格式的二维动画。 常用的二维动画软件有Animator Por、Animation Studio、GIF Animator、 ImageReady、 Director、 Flash等。 在Web网页面的制作过程中,应用最多最广泛的动画制作软件有GIF Animator和 Flash。

1、常用二维动画制作软件 常用的二维动画制作软件,主要有: Ulead GIF Animator Maroomedia Flash MX这两种软件。

① Ulead GIF Animator 是Ulead公司推出的一个操作简单、实用方便、制作灵活、功能强大的GIF动画软件。它也是网页设计制作中一种有效的辅助工具。 Ulead GIF Animator 5.0的功能很强大,可以将图像、动画、视频文件进行相互的转换,可以用作Photoshop的插件使用。 不能添加声音、无交互性能。

②Flash MX 是Maroomedia公司的产品,它是基于矢量图形的系统。 用少量的矢量数据就可以描述一个复杂的对象,生成的文件数据量很小,非常适合于在网络中使用。 它支持声音的导入和交互链接的功能,是一种流式动画文件 。

2、常用二维动画的文件格式 二维动画的文件格式很多,但多应用于网页制作中装饰和美化页面,因而把这些动画又称为网页动画 。 网页动画应具有如下特点: 具有文件数据量小,便于下载和传输; 具有表现力强、易吸引观看者的注意力; 具有良好的观赏视觉效果; 具有一定的交互控制能力;

① GIF动画 是图像文件中一种特殊的格式,它是网页上最常见的动画文件格式,它可以存储静态的图画,又可以存储动态的动画。 它的动画实际就是由多幅帧画面而组成的。 支持256色和更低的色彩模式,支持透明色,可以制作具有透明背景的动画文件,文件的数据量较小,并且可以对文件进行优化处理。没有声音效果,只能循环播放,并且不具有交互能力。

Microsoft Gif Animator Animagic GIF Ulead Gif Animator Image Ready

② Flash动画 是网络动画中的主力军,也是二维平面动画的主要形式。 是以矢量图为基础的一种动画文件。具有文件数据量极小,放大不易变形。 可导入声音文件,具有交互控制能力和多种动画形式的特点。 文件的格式为swf 、它也可以打包成能脱离制作环境自动运行的exe文件。

制作Flash动画的软件 它的制作软件主要是Macromedia公司的Flash MX。 也可以通过其它动画软件转换生成。

3、二维动画的应用 多媒体应用程序 多媒体影视广告制作 课堂教学课件 网络教学课件 网页制作 网络广告动画 网络游戏

7.2 Ulead GIF Animator 5.0功能简介 GIF Animator是Ulead公司最早在1992年发布的一个GIF动画的制作工具,现在的版本是GIF Animator 5.0。它具有操作简单、使用方便、效果明显的特点。可以将图像、动画、数字视频进行相互的转换,可以在GIF动画中增加特殊效果,可以制作各种运动方式的动态标题文字,制作能独立运行的电子贺卡文件。

7.2.1 Ulead GIF Animator 5的界面简介

7.2.2 Ulead GIF Animator 5应用实例 图像 主要应用 视频 动画

7.2.2.1 使用图像帧制作GIF动画 利用素材文件夹中的“xy1.bmp”~“xy4.bmp”四幅图片,制作一个尺寸为98×83像素的GIF动画,并把它保存为xy.gif动画或xy.swf动画。 xy1 xy2 xy3 xy4 xy.gif

7.2.2.2 将GIF动画拆分成图像帧 将素材文件夹中的“XL.GIF”动画,拆分成单张的图像帧,并将它们保存为XL的jpg图像文件。 ••••••••••••••••••••• xl001 xl002 xl003 xl004 xl005 xl025

7.3 Flash动画基础知识 Flash是美国Macromedia公司推出的二维动画软件,由于其简便易用,功能强大,因此在网页制作和多媒体制作领域得到了广泛的应用。是二维动画中最具有影响力的一种动画形式,Flash动画也已成多媒体技术中最有实用价值的一种动画媒体。

7.3.1 Flash MX软件知识 Flash MX中文版是Macromedia公司最新的版本, Flash MX中文版新增了支持视频播放、声音导入、脚本查找与替换等功能,还可以支持更多的多媒体文件类型。它超强的网页动画制作能力和较小的文件数据量,以及对一些脚本语言(如JavaScript)和强大的XML语言的支持,使其更适合于网络传输。

7.3.1.1 Flash MX中文版的 硬件配置及运行环境 在 Microsoft Windows系统中 CPU>200MHz、内存>64MB、安装空间85MB、显示器支持1024×768、16位增强色、有CD-ROM。 在Macintosh系统中 Mac OS 9.1或 Mac OS X 10.1系统 、内存>64MB、安装空间85MB、显示器支持1024×768、16位增强色、有CD-ROM。

7.3.1.2 Flash MX中文版的主要功能 绘图功能 动画功能 支持动画和声音的功能 编程功能 有绘图工具箱、可导入图像素材。 关键帧动画、路径动画、变形动画和各种脚本动画。 支持动画和声音的功能 可以支持GIF动画、swf动画和声音文件编程功能。 编程功能 利用脚本语言进行各种交互动作的设置 。

7.3.1.3 Flash MX中文版的 窗口操作界面

时间轴面板

7.3.1.4 Flash MX的动画格式 fla格式:为Flash软件编辑动画的源程序,在编辑制作时会自动新建生成。可以在编辑过程中用于再次编辑。 swf格式:属于Flash的动画文件格式,可以直接应用于网页、多媒体应用程序和教学课件当中。但需要有相应的播放器才可以播放使用。 exe格式:是Flash发布为Windows系统下的一种可执行文件,双击时即可自动播放,可脱离制作环境,不需要任何播放器支持,多用于教学课件和电子贺卡的制作。

7.3 .2 Flash MX基本操作应用实例 在学习了解了Flash动画的基础知识和Flash MX软件的窗口界面的结构后,通过以下的操作应用实例示例来了解Flash MX软件的主要功能,熟悉掌握它的基本操作使用方法。

7.3.2.1 网页广告条的制作 设计制作一个尺寸为468×120像素,由Flash动画制作的网页广告条。要求有广告条有具体的文字内容,有广告单位的名称,所有文字必须有运动动画效果,最后停留到画面上静止不动。广告动画中要有与内容相关的图片或装饰图和线条,背景颜色要能达到突出主体的作用。

主要操作步骤 一、创建背景 二、制作动画文字 三、创建应用新元件 四、创建装饰动画 五、测试发布动画

7.3.2.2 课件结构制作应用实例 用Flash MX制作一个页面为400 px×300px,背景为浅绿色,文件名为“课件结构”的swf格式的动画文件。

该动画文件由5个页面构成,第一个页面为封面,封面上用四朵花渐变成“课件结构”字样的变形动画作为标题,在页面中有一个飞动的小天使在运动,单击页面上的“单击进入”的提示文字时,可以进入目录页面。

在目录页面上分别有“第一章”、“第二章”、“第三章”和“退出”的文字,每行文字前有一个相应的按钮,单击按钮可以跳转到相应页面上,单击“退出”按钮,即刻退出动画的播放。

在目录页下共有三个页面,单击页面上的“返回”按钮,可以返回到目录页面上。

主要操作步骤 一、创建封面制作变形动画 二、利用GIF动画文件制作路径动画 三、制作音效按钮 四、创建各场景 五、利用动作脚本建立交互链接 六、测试发布

7.3.2.3 花木图片展播制作应用实例 利用素材文件夹中提供的图片和声音文件,制作一个界面为500×400的动画演示程序,要求打开动画时出现标题,背景音乐同时响起。单击页面右下方的凸凹按钮,可以切换观看图片的内容。

主要操作步骤 一、制作“场景1 ”(标题封面) 二、制作“场景2” (主界面) 三、制作凸凹按钮 四、添加背景音乐 五、测试发布

小结 二维动画的原理和帧的概念 动画的分类和制作原理 二维动画软件和文件格式 GIF动画和swf动画文件格式的特性和应用 用Ulead GIF Animator 5制作GIF动画 用Flash MX进行基本的绘画编辑操作 和制作Flash动画