网页动画设计与制作flashmx2004项目2-图形的绘制

《网页动画设计与制作flashmx2004项目2-图形的绘制》由会员分享，可在线阅读，更多相关《网页动画设计与制作flashmx2004项目2-图形的绘制（27页珍藏版）》请在金锄头文库上搜索。

1、网页动画设计与制作Flash,项目2-图形的绘制,项目2-图形的绘制,【项目背景】 经过前面的项目，小张学会了如何为一部动画短片做导演，并能设置动画设计环境。现在，经理要求他开始创作动画中的各个角色与主要的画面，主要有“南浦大桥”的造型、“个性签名”造型，并要求他设计“翻书”与“手写签名”两个较简单的动画。,【项目分析】,Flash中有哪些用于创作图形的绘图工具？ 绘制好的图形对象怎么修改？ 文字如何进行输入？,【任务分解】,任务1：绘制曲线。 任务2：绘制色块。 任务3：调整图形形状。 任务4：擦除图形。 任务5：使用文本。,任务1 绘制曲线,了解矢量图和位图的区别。 了解矢量曲线和矢量色块

2、的特点。 熟悉常用的曲线绘图工具。 利用曲线图形绘制“南浦大桥”造型。,1了解矢量图和位图的区别,（1）矢量图形：矢量图形使用直线和曲线描述图像，还包括颜色和位置属性。在编辑矢量图形时，可以修改描述图形形状的线条和曲线的属性，可以对矢量图形进行移动、调整大小、重定形状以及更改颜色的操作，而不更改其外观品质。矢量图形无论如何缩放都不会失真。 （2）位图图形：位图图形使用在网格内排列的像素点来描述图像。在编辑位图图形时，修改的是像素，而不是直线和曲线。位图图形跟分辨率有关，因为描述图像的数据是固定到特定尺寸的网格上的，所以编辑位图图形会更改它的外观品质。特别是调整位图图形的大小，会使图像的边缘出现

3、锯齿，在比图像本身的分辨率低的输出设备上显示位图图形时也会降低它的品质，有时甚至完全失真。,2了解矢量曲线和矢量色块的特点,（1）矢量曲线：矢量曲线包括直线和曲线，用于描绘图形对象的轮廓，是没有面积的。它的主要属性是颜色和位置。例如，五角星的轮廓曲线。 （2）矢量色块：矢量色块就是图形对象的色彩填充，它的属性包括颜色、位置、面积等。例如，红色的五角星。,3熟悉常用的曲线绘图工具,（1）“线条工具” （2）“铅笔工具” （3）“铅笔工具” （4）“墨水瓶工具” （5）“椭圆工具” （6）“矩形工具” （7）“多角星形工具”,4利用曲线图形绘制“南浦大桥”造型,（1）新建Flash文件，命名为“南

4、浦大桥”； （2）在工具箱选择“矩形工具”，在“颜色”栏将填充色设置为透明，将笔触色设置为黑色，如图2-4所示； （3）使用“矩形工具”绘制两长一短三个矩形，构成桥桩的大致轮廓； （4）使用“选择工具”将桥桩修改绘制成型； （5）使用“钢笔工具”绘制桥面和外轮廓，可分别绘制五段光滑曲线围成桥面和桥体； （6）使用“线条工具”绘制多条垂直钢索； （7）使用“选择工具”将多余的线条选中，然后按 Delete 键删除。,任务2 绘制色块,熟悉常用的色块绘制工具。 利用已有的轮廓曲线得到填充色块。 利用笔刷工具设计“个性签名”。,1熟悉常用的色块绘制工具,（1）“刷子工具” （2）“颜料桶工具” （3

5、）“椭圆工具” （4）“矩形工具” （5）“多角星形工具”,2利用已有的轮廓曲线得到填充色块,（1）打开任务1完成的Flash文件“南浦大桥”； （2）将绘制好的轮廓曲线复制一份留存，以免后面操作如果失误破坏原稿还要重新绘制； （3）在工具箱选择“颜料桶工具”，在“颜色”栏将填充色设置为黑色； （4）使用“颜料桶工具”为南浦大桥填充色块，只需单击需要填充的各个封闭区域即可； （5）使用“选择工具”将轮廓曲线选中，然后按 Delete 键删除。,3利用笔刷工具设计“个性签名”,（1）新建Flash文件，命名为“个性签名”； （2）在工具箱选择“笔刷工具”，在“颜色”栏将填充色设置为黑色； （3）

6、在“选项”栏将模式设置为标准绘画，将笔头大小设置为最大，将笔头形状设置为斜向排笔，如图2-11所示； （4）使用“笔刷工具”拖曳书写你的签名，就象写毛笔字那样； （5）完成绘制,任务3 调整图形形状,熟悉常用的图形调整工具。 熟悉变形菜单中的常用命令。 运用形状调整工具设计“翻书”动画。,1熟悉常用的图形调整工具,（1）“选择工具” （2）“部分选取工具” （3）“任意变形工具”,2熟悉变形菜单中的常用命令,（1）“缩放”命令：可以沿水平方向、垂直方向或同时沿两个方向放大或缩小对象，通过拖曳或在“变形”面板中输入值来缩放对象。 （2）“旋转”命令：旋转对象会使该对象围绕其变形点旋转，变形点默认

7、位于对象的中心，但可以通过拖曳来移动该点，通过使用“旋转”命令、用任意变形工具拖曳或在“变形”面板中指定角度来旋转对象。 （3）“倾斜”命令：倾斜对象可以通过沿一个或两个轴倾斜对象来使之变形，通过拖曳或在“变形”面板中输入值来倾斜对象。 （4）“扭曲”命令：对选定的对象进行扭曲变形时，可以拖曳边框上的角手柄或边手柄，移动该角或边，然后重新对齐相邻的边。 （5）“封套”命令：封套功能键允许弯曲或扭曲对象，封套是一个边框，其中包含一个或多个对象，更改封套的形状会影响该封套内的对象的形状，可以通过调整封套的点和切线手柄来编辑封套形状。 （6）“翻转”命令：翻转可以沿垂直或水平轴翻转对象，而不改变其在

8、舞台上的相对位置。,3运用形状调整工具设计“翻书”动画1,（1）新建Flash文件，命名为“翻书”； （2）在工具箱选择“矩形工具”，在“颜色”栏将填充色设置为黑白线性渐变，将笔触色设置为透明； （3）在“选项”栏选择园角矩形属性，设定边角半径为4； （4）使用“矩形工具”绘制一个矩形，构成书页的大致轮廓 ； （5）使用“选择工具”将书页修改绘制成型：先使用选择工具拖曳矩形的顶点，将其变成梯形，然后再拖曳梯形的上下底，将直线变成弧线； （6）使用“钢笔工具”在书页右上角添加锚点，并使用“部分选取工具”调整新锚点左右两侧的曲线，使书页产生厚度感； （7）使用“线条工具”在书页右侧的厚度区域画线，

9、增加书页的立体感； （8）选中绘制完成的整个书页，执行“修改”“变形”“水平翻转”命令，得到书的另一半，移动到左侧拼成一本完整的书； （9）在第60帧上单击鼠标右键，执行“插入帧”命令，确定动画时间为五秒钟； （10）新建一个图层2，分别在第1帧、第60帧上单击鼠标右键，执行“插入关键帧”命令；,3运用形状调整工具设计“翻书”动画2,（11）在图层1中选择右侧书页的主体部分，即最上一页，执行“编辑”“复制”和“粘贴到当前位置”命令，将其复制到图层2的第1帧； （12）使用相同的方法，将图层1中左侧书页的主体部分复制到图层2的第60帧； （13）在图层2的第15、30、31、45帧插入关键帧；

10、（14）在第15帧选中单页书，执行“修改”“变形”“扭曲”命令，得到翻书的中间状态； （15）在第30帧选中单页书，执行“修改”“变形”“扭曲”命令，得到书页近乎直立的状态 ； （16）在第15帧上单击右键，执行“复制”命令，再在第45帧上单击鼠标右键，执行“复制”命令，将第15帧复制到第45帧； （17）使用同样的方法，将第30帧复制到第31帧； （18）在第31、45帧分别执行“修改”“变形”“水平翻转”命令，得到书页翻到左侧时的两个关键帧 ； （19）单击第1帧上，在“属性”面板上将“补间”属性设置为“形状”； （20）用与上一步同样的方法在第15、31、45帧设置“形状”补间属性 （2

11、1）测试影片，修改动画效果中一些不理想的细节,任务4 擦除图形,熟悉图形的一般擦除方法。 熟悉通过拖动擦除图形的方法 运用擦除图形功能设计“手写签名”动画。,1熟悉图形的一般擦除方法,方法有以下两种。 （1）快速删除舞台上的所有内容：可以双击橡皮擦工具。 （2）删除笔触段或填充区域：可以先单击橡皮擦工具，然后单击“水龙头”功能键，再选择要删除的笔触段或填充区域。,2熟悉通过拖动进行图形擦除的方法,除了一般的图形擦除方法外，还可以通过拖动进行图形擦除，其使用以下方法。 （1）选择橡皮擦工具。 （2）单击“橡皮擦模式”功能键并选择一种擦除模式： “标准擦除”模式：擦除同一层上的笔触和填充。 “擦除

12、填色”模式：只擦除填充，不影响笔触。 “擦除线条”模式：只擦除笔触，不影响填充。 “擦除所选填充”模式：只擦除当前选定的填充，并不影响笔触 “内部擦除”模式：只擦除橡皮擦笔触开始处的填充。 （3）单击“橡皮擦形状”功能键并选择一种橡皮擦形状和大小。确保不要选中“水龙头”功能键。 （4）在舞台上拖动。,3运用擦除图形功能设计“手写签名”动画,（1）打开任务二完成的Flash文件“个性签名”，另存为“手写签名”； （2）第1帧已经有了完整的“龙”字； （3）在第2帧上单击鼠标右键，执行“插入关键帧”命令，创建新的关键帧； （4）在工具箱选择“橡皮擦工具”，在“选项”栏将模式设置为标准擦除，将笔头大

13、小设置为合适大小，与要被擦除对象的笔画粗细相似； （5）使用橡皮擦工具，将“龙”字的最后书写笔画部分擦去一段； （6）在后续的各帧上反复重复步骤3到5 ； （7）不断擦除，直到整个“龙”字完全消失 ； （8）现在观看动画，将是文字逐渐消失的效果。选择所有的24帧：单击第1帧，再按住 Shift键单击最后一帧 ； （9）执行“修改”“时间轴”“翻转帧”命令，将所有帧的位置翻转过来； （10）测试影片,任务5 使用文本,创建不断加宽的文本块。 创建宽度固定的文本块。 更改文本属性。,1创建不断加宽的文本块,（1）在工作区中的空白区域单击，确保未在舞台上选定任何时间轴帧或对象。 （2）在工具栏中，单

14、击“文本工具” 。 （3）相应的文本“属性”面板出现。 选择对齐方式，如“左对齐”。 （4）在时间轴中，新建或选择一个放置文字的图层，如“静态文本”。 （5）在“文本工具”仍处于选中状态时，在要放文字的左边缘处单击舞台，然后键入文字，在键入文字时文字区域会不断加宽。在不断加宽的一行静态文本块的右上角，有一个圆形控制块 。 （6）如有必要，可在工具栏中单击“选择工具”并将所键入的文本拖动，从而使该文本放置到所需的位置。,2创建宽度固定的文本块,（1）确认要放文本的层（如“静态文本”）仍在时间轴中处于选中状态，并使用“选择工具”取消选择舞台上的任何对象或时间轴帧（在工作区中远离对象的区域单击）。

15、（2）在工具栏中，选择“文本工具”。 （3）在“属性”面板中，将文本的大小更改，如20 磅。 （4）在舞台上，将指针拖曳拉出所需的区域。此时，在宽度固定的静态文本块有一个方形控制块，而前面提到的不断加宽的一行静态文本块的右上角有一个圆形控制块。 （5）在所创建的文本块内部，输入所需的文本。 （6）如有必要，可以在工具栏中单击“选择工具”并将所键入的文本移动到所需的位置。,3更改文本属性,方法一：在输入文本后，可以利用“文本”菜单进行文本属性修改 方法二：在输入文本后，也可以利用“属性”面板进行文本属性修改,项目小结,要设计成功的Flash动画，必须能够首先绘制出漂亮的矢量图形对象。 Flash中有多种功能强大而齐备的绘图工具，每一个从事动画设计的人员都应该尽量熟悉这些工具的使用。 在学习绘图过程中自己画的一些图形，特别是自己原创的内容，要注意整理保存下来。 绘制图形除了模仿已有的作品，更需要进行一定的创意，而创意是需要不断积累、不断思考的。,