Fireworks实验指导书Word格式文档下载.docx
- 文档编号:16422645
- 上传时间:2022-11-23
- 格式:DOCX
- 页数:37
- 大小:2.78MB
Fireworks实验指导书Word格式文档下载.docx
《Fireworks实验指导书Word格式文档下载.docx》由会员分享,可在线阅读,更多相关《Fireworks实验指导书Word格式文档下载.docx(37页珍藏版)》请在冰豆网上搜索。
21
22
实验七弹出菜单制作24
24
25
实验八蒙版—花边画框效果26
26
28
实验九蒙版—倒影文字效果29
29
31
实验十 GIF动画制作——Banner32
32
实验十一 网页效果图制作35
35
1.实验要点:
实验十二 WEB网页效果实现37
37
5.实验总结:
38
概述
课本通过理论指导精讲了页图像处理软件——MacromediaFireworks8的操作方法和图像处理的技巧。
内容包括fireworks8使用基础,绘制矢量图形,编辑图形对象及矢量路径,绘制与编辑位图图像,使用文本,使用层与蒙版,使用滤镜和特效,制作动画效果,制作按钮、导航栏和弹出菜单,使用切片和热点,图像的优化与导出等。
但是对于提高学生的实际动手操作能力,创新思想和创作能力,必须使用理论指导和软件的使用技巧结合实训的方式来提高学生对fireworks8操作的掌握与运用能力。
为此,我们精选了10个具有代表性的实验作为学生实训内容。
《Fireworks》实验分12次进行,每次上机学时可按推荐学时进行,也可根据具体情况进行适当的调整,但《Fireworks》实验上机的总学时不小于30学时。
每次上机的内容及推荐学时见下表。
序
号
实验名称
课时
必(选)做
实验一
绘制矢量图形---手提袋
2
必做
实验二
木质相框中照片翻转效果制作
3
实验三
文字的各种效果制作
实验四
按钮制作
实验五
信息框制作
实验六
滑动菜单制作
实验七
弹出菜单制作
实验八
蒙版—花边画框效果
实验九
蒙版—倒影文字效果
实验十
GIF动画制作——Banner
实验十一
网页效果图制作
实验十二
WEB网页效果实现
1.实验设备及环境
1.1硬件要求:
800MHzInterPIII处理器(或同等处理器)或更高频率处理器计算机,256M以上内存,CD-ROM驱动器,2GB以上硬盘。
1.2软件系统要求:
Windows2000或WindowsXP操作系统,分辨率1024*786,16位以上显示器,MacromediaFireworks8。
2.加强实践能力的培养
本实验指导书按照能力本位的设计原则,突出提高学生的职业能力,建立一个实践与教学之间的训练环节,增强学生的实际运用能力和动手能力,以课堂指导为背景,通过实训的方式加强教学内容的针对性和适应性,使学生能熟练掌握基础知识并运用到实验实践及工作中去。
实验的目的是加强对基本理论的理解,操作技巧的使用,培养和提高学生实际动手能力,其中包括:
各种工具的使用,滤镜效果的综合运用,动态图形制作,网页图形的编辑处理,网页设计等。
针对每一个实验,应首先熟悉该实验所需要准备的基础知识,认真了解和掌握实验中所需各种工具,滤镜,效果等的使用,掌握实验步骤,在模仿的同时能够提出自己的想法和创意。
实验一 绘制矢量图形----手提袋
1)熟悉和掌握矢量工具的使用,颜色透明度的应用。
2)三维图形的认识和简单三维图形的绘制。
1)认真阅读课本第四章的内容,理解路径的修改、编辑、删除、调整等操作。
2)路径绘制时注意直线路径与曲线路径的绘制和变换区别。
1)熟悉矢量工具的使用:
2)打开MacromediaFireworks8软件,新建大小为画布400*300,画布颜色为浅蓝色。
首先来分析一下实物图。
想象一个立体的袋子有三个面是可视面,在最外面有六条边。
袋子左侧有两个区域的阴影,上面的阴影颜色较浅,下面的三角形阴影颜色稍微深些;
袋子下部是一个绿色区域,这里必须注意简单的透视效果;
袋子的提绳是钢笔工具绘制的曲线路径。
使用矢量工具栏中的钢笔工具绘制的手提购物袋实验效果图如(图1-1)。
图1-1图1-2
1)绘制轮廓。
选择工具栏矢量工具中的钢笔工具,在画布中间勾勒出手提袋的轮廓,也就是位于最外面的一个六边形,其填充类别为实心,填充颜色为白色,如(图1-2)。
首次绘制的图形不一定是完美的,画好以后可以使用选择工具栏中的部分选择工具,用来拖动线段两端的小原点,使得画好的袋子轮廓满意为止。
2)绘制阴影。
阴影有三块,袋口一个三角形,左侧一个长条形,左侧底部一个小三角形。
由于袋口的阴影和左侧的长条形阴影是相同颜色,在绘制的时候可以将两个阴影连起来。
三角形阴影可以单独绘制,如图(图1-3)。
画好以后,使用放大镜工具将每个角放大查看一下,将没有与外轮廓对齐的点重合。
为了对比外轮廓,先将这个两个阴影区域均设置填充颜色为黑色。
从阴影的明暗程度分析,上面大块的阴影颜色较浅,下面一块颜色较暗,设置上面颜色透明度为10,下面颜色透明度为20,这样就可以突出袋子的立体感。
图1-3图1-4
3)绘制下摆边。
下摆边同样是一个六边形外轮廓,紧贴手提袋的外边框,填充颜色设置成绿色。
颜色填充好以后会发现前面设好的阴影部分被遮盖了,解决办法是设置颜色透明度为50,如图(图1-4)。
4)绘制提绳出口。
提绳的两个出口,使用矢量工具中的椭圆工具绘制一个圆,出口颜色看起来中间部分会有些暗,可以将填充类别设置成线性下的放射状填充。
为了两个出口有相同的效果,使用复制处理。
按住【CTRL】键拖动出口拉动到适当位置,再松开【CTRL】键,即看到如图所示效果。
图1-5图1-6
5)绘制提绳。
使用钢笔工具在其中一个出口中间点击,松开鼠标再点击另外一个出口,点击后按住鼠标拖动使得绳的弯曲程度符合提绳长度,再调整笔触的大小设置绳的粗细。
至此一个颇具立体感手提袋就已经基本完成,以后还可以在上面加上文字和图片。
1)完成实验后请认真填写实验操作,并在实验操作中总结本次实验中遇到的问题及解决方法或体会。
2)认真思考以下问题,并在实验操作中总结:
①手提袋下摆边绿色区域和左侧的阴影区域的绘制顺序能否改变?
如能,请按照你所想的重新绘制,如不能,请说明理由。
②如果要在袋子上加图案,应该怎样操作?
实验二 木质相框中照片翻转效果制作
本例将制作一个木质相框,相框内嵌有照片。
当鼠标从相框上滑过时,相框内的照片产生翻转效果。
希望同学们能够掌握这种制作方法,为自己制作出几个风格不同的相框。
1)熟悉和掌握修改工具,缩放变形工具的使用、材质填充、打孔技术、特效应用,以及利用切片技术制作翻转图像。
2)对层的了解和应用及切片添加交换图像行为的使用。
3)熟悉多种技术的混合使用,熟悉各种特效的应用。
1)认真阅读课本第4、5、7章的内容,熟悉矢量工具的使用,层的概念和使用方法,各种滤镜和效果的综合运用等。
2)打孔技术的方法是使用上层对象来裁剪掉与底层对象的的相交部分,改变底层对象的形态。
1)熟悉各种工具的使用:
2)打开MacromediaFireworks8软件,新建大小为画布300*330,画布颜色为白色。
首先来分析一下这种木质相框和它的翻转效果。
使用两个矩形打孔形成相框的轮廓;
依次对相框轮廓使用了斜角和浮雕滤镜效果,投影滤镜效果,内侧发光效果和内斜角滤镜效果形成了相框的立体感,光感和质感;
使用层共享使相框轮廓一致,使用切片的添加交换图像行为来变换照片呈现效果。
图2-1图2-2
1)制作相框轮廓。
使用矢量工具栏中的矩形工具在画布中间画一个矩形,同样的方式画一个稍小的矩形,将两个矩形居中对齐和水平对齐。
选中小矩形,使用修改工具栏中的合并按钮,将该矩形结合路径。
使用矢量工具栏中的修改区域形状工具制作相框内侧的弯曲形状之后,选中全部对象,再次使用修改工具栏中的合并按钮。
图2-3图2-4
2)对图形填充材质。
选择合成后的图形对象,在填充类别里面选择图案中的木纹2材质,改变填充方向直至填充效果满意为止。
3)制作相框轮廓效果。
选择相框对象,依次添加斜角和浮雕滤镜效果(设置如图2-5),投影滤镜效果,内侧发光效果和内斜角滤镜效果(设置如图2-6),相框最终滤镜效果如图2-4。
将
图2-5
图2-6
4)新建一个图层命名为“层2”,在层2下面导入一张照片。
选择工具箱中的缩放工具,调整照片的尺寸,使它略小于相框的尺寸。
如果照片遮盖了相框,则拖动层2放至层1的下边,使照片位于相框的底层,这时出现了图2-1的效果。
5)制作另一张照片效果。
选择层1,在层面板菜单中勾选共享图层命令,将相框所在层共享。
打开帧面板,单击底部新建/复制帧按钮,添加一帧为帧2。
选中帧2,同样的方式导入另一张照片,调整尺寸和位置。
此时出现的是图2-2的效果。
6)制作切片。
选中相框,在编辑菜单中选择“插入”-“矩形切片”,或者直接使用工具箱中的切片工具将相框作为矩形切片。
使用选择工具点击切片中间的小圆,选择菜单中“添加交换图像行为”,在弹出的对话框右侧单击“确定”按钮就完成了翻转照片效果。
图2-7
至此,木质相框内照片的翻转就制作完成了。
单击工作窗口中上方的预览选项卡,即可看到图2-1所示照片;
将鼠标移动到相框上,相框内的照片翻转显示图2-2所示照片。
①制作相框内侧无规则弯曲之前为什么要选中里面的矩形使用修改工具栏中的合并按钮结合路径?
如果不按此按钮将会出现什么样的问题?
想想还有没有别的方法代替此操作。
②若对相框使用的几种滤镜效果的顺序调换,其最终效果是否相同?
请尝试。
③若制作过程中不新建图层2,而是在层1中直接导入照片,会出现什么情况?
为什么这样不行?
实验三 文字的各种效果制作
Fireworks制作特效字相对来说比较方便,网页上应用也比较多,本例简要实现了几种文字特效的制作,运用Fireworks各种工具,滤镜效果等综合处理文本。
希望同学们能够掌握这种制作方法,发挥自己的创造能力,想象力,综合使用各种效果,充分发挥Fireworks工具的强大功能,制作出各种文字效果。
1)熟悉和掌握颜色填充类型,颜色的调节,文本工具的使用,添加滤镜效果等。
2)熟悉和掌握路径的拆分和合并等。
3)熟悉多种技术的混合使用,熟悉各种特效的应用,滤镜的设置等。
1)认真阅读课本第6、7、8、9章的内容,熟悉文本工具、滤镜、效果应用、颜色管理等的使用,层的概念和使用方法,各种滤镜和效果的综合运用等。
2)注意滤镜的使用顺序带来的不同效果。
2)打开MacromediaFireworks8软件,新建大小为画布300*100,画布颜色为灰色。
4.1渐变字效果
在画布中间使用文本工具输入文本对象“渐变字”,选中字体对象,打开属性面板,字体大小设置为95,字体为隶书,颜色使用填充选项的线性渐变类型。
点击鼠标可以在色带下边添加一个五边形,在五边形上点击鼠标选择自己喜欢的渐变颜色,也可在预置选项中选择某几种颜色;
用鼠标按住五边形拖离色带下方即可删除此颜色。
设置好以后,拉动字体上面的方向杆可以调整渐变方向。
其最终效果如图3-1所示。
图3-1
4.2立体字效果
在画布中间使用文本工具输入文本对象“立体字”,选中字体对象,打开属性面板,字体大小设置为95,字体为隶书,填充颜色为黑色,填充类别为实心。
选中文本,选择文本菜单中的“转换为路径”命令。
再给文本依次添加斜角和浮雕中的“内斜角”滤镜效果、调整颜色中“亮度/对比度”滤镜效果,其亮度值为-5,对比度为50。
其最终效果如图3-2所示。
图3-2
4.3弧形字效果
在画布中间使用文本工具输入文本对象“弧形字弧形字弧形字”,选中字体对象,打开属性面板,字体大小设置为20,字体为隶书。
用钢笔工具绘制一条曲线,同时选中曲线和文本,选择文本菜单中的“添加到路径”命令,可以看到文本沿曲线延伸。
选择“文本”-“对齐”-“两端对齐”;
“文本”-“方向”-“垂直倾斜”。
其最终效果如图3-3所示。
图3-3
4.4木纹凹字效果
在画布中间使用文本工具输入文本对象“木纹凹字”,选中字体对象,打开属性面板,字体大小设置为70,字体为隶书。
给文本填充材质为木纹,选择文本给文本添加斜角与浮雕中外斜角滤镜效果,其基本设置如图3-4所示。
图3-4图3-5
4.5立体凹字效果
1)为突出字体效果,用矩形绘制工具在编辑区绘制一个矩形对象,作为背景。
2)在编辑区输入文字,字体采用了一种较粗的字体“ArialBlack”,字号采用了“120”大小,字体颜色为黄色,具体效果如下图所示。
图3-6
3)选中文本对象,按组合键“Ctrl+Shift+P”,将文字转化为路径对象。
按组合键“Ctrl+J”将转化的文本对象接合为一个单独的路径对象,此刻编辑区效果如下图所示。
图3-7
4)给文字添加Effect效果--阴影和光晕--投影,投影设定采用默认值即可。
此刻编辑区效果如下图所示。
图3-8
5)选中文本对象,按组合键“Ctrl+Shift+D”,克隆一个文本对象。
选中克隆对象,选择菜单命令“修改|改变路径|扩展笔触”,在弹出的“展开笔触”的设定窗口中进行如下图所示的设定。
图3-9
6)编辑区文字效果出现。
图3-10
①按照前面几种文字效果,结合滤镜,效果等的使用,设计属于自己的一种或几种文字效果。
实验四 按钮制作
网页中,按钮是一种常用的图形。
对于Fireworks来说是比较简单的,网页上应用也比较多。
希望同学们能够掌握这种制作方法,发挥自己的创造能力,想象力,综合使用各种效果,充分发挥Fireworks工具的强大功能,制作出各种按钮效果。
1)熟悉和掌握线性填充类型,颜色的调节,文本工具的使用,添加滤镜效果等。
2)熟悉和掌握路打孔工具制作出的效果等。
1)认真阅读课本第4、6、7、8章的内容,熟悉文本工具、滤镜、效果应用、颜色管理等的使用,修改菜单部分功能的使用方法,各种滤镜和效果的综合运用等。
2)注意图形堆叠方式对打孔工具制作的效果的影响。
2)打开MacromediaFireworks8软件,新建大小为画布250*200,画布颜色为白色。
首先分析按钮效果实例图。
此按钮的颜色为灰白渐变色,看上去有立体感。
拆分来看,是由一个圆角矩形和另一个圆角矩形的上半部分组成。
其最终效果如图4-1所示。
图4-1
1)绘制圆角矩形。
使用矢量工具栏中的圆角矩形工具绘制一个宽170,高70的圆角矩形,通过四周的小菱形调整矩形圆角到合适的弯曲程度,如图4-2所示;
填充类别为线性,颜色选取为灰色和白色渐变,拉动方向杆调整渐变方向如图所示。
给该矩形添加内侧发光的滤镜效果,其参数设置如图4-3所示。
图4-2图4-3
2)绘制按钮的高光部分。
按钮的高光部分是一个半圆角半矩形的图形,我们可以通过打孔的方式来获取。
先绘制一个宽165,高50的圆角矩形,填充颜色为黑色,填充类别为实心;
再画一个宽180,高50的矩形,为了区别圆角矩形,将其填充颜色设为灰色,填充类别也是实心。
将两个图像堆叠在一起,如图4-4所示。
同时选中两个图形,执行“修改”—“组合路径”—“打孔”,如图4-5所示。
图4-4图4-5
3)给图4-5所示图形添加线性渐变的颜色,渐变颜色设置如图4-6所示,颜色调好以后,拉动方向杆将渐变方向调至如图4-8所示。
图4-7图4-8
4)把图4-8拖动到图4-2圆角矩形之上,将两个图形组合在一起,可以通过方向键调整至适当位置,如图4-9所示。
图4-9
5)使用文字工具在按钮上面写上“首页”,字体华文隶书,字号45,将文本移动到按钮中间。
同时选中图形的各个部分,执行“修改”—“组合”,一个具有光感,立体感的按钮就完成了。
其最终的效果如图4-1所示。
①按照自己的想法,运用各种手段,创作自己的按钮作品。
②思考还能使用怎样的方式制作图4-5所示图形?
③能否在一个圆角矩形上面制作出立体效果的按钮?
实验五信息框制作
网页中,信息框是一种常用的图形。
希望同学们能够掌握这种制作方法,发挥自己的创造能力,想象力,综合使用各种效果,充分发挥Fireworks工具的强大功能,制作出各种效果的信息框。
1)熟悉和掌握线性填充类型,颜色的调节,文本工具的使用,层操作,滤镜应用等。
2)熟悉和掌握矢量工具制作出效果的方法。
1)认真阅读课本第4、5、6、7章的内容,熟悉文本工具、滤镜、效果应用、颜色管理等的使用,修改菜单部分功能的使用方法,各种滤镜和效果的综合运用等。
2)注意挂绳阴影对最终效果的影响。
2)打开MacromediaFireworks8软件,新建大小为画布500*300,画布颜色为白色。
首先分析信息框效果图。
此信息框难点是制作框上的挂绳,如图5-2。
其组成是两个灰色椭圆,一个大的圆角矩形,一个小的圆角矩形,及一个渐变矩形。
其他包括一个加滤镜效果的圆角矩形对象和几个文字对象。
其最终效果如图5-1。
图5-1图5-2
1)首先绘制图5-2所示挂绳。
使用矢量工具栏中的椭圆工具绘制一个椭圆,填充为灰色,笔触为透明色,按住ALT键制作一个副本,将其拖动到源椭圆的下方。
选中两个图形“修改”-“对齐”-“垂直居中”。
使用矢量工具绘制适当大小的圆角矩形,颜色为白色,笔触为透明,拖动位于两个灰色椭圆的上方。
2)绘制挂绳阴影。
在白色圆角矩形的左侧绘制一个细长的灰色圆角矩形,作为绳的掩饰。
使用矩形工具绘制一个矩形,填充为灰色与灰色的渐变颜色,左上角设置透明度为100,右上角设置透明度为0,笔触为透明,如图5-3所示。
自上而下拉动颜色方向杆设置灰度渐变。
将制作好的阴影矩形放置于源椭圆的下面(在层面板中拖动阴影矩形对象至最底层,也可以使用右击鼠标“排列”-“移到最后”)。
图5-3图5-4
3)将挂绳所有对象选中右击鼠标组合,制作三个副本后按照图示方式排列,同时选中四个挂绳对象,执行“修改”-“对齐”-“顶对齐”操作。
4)绘制一个圆角矩形,颜色为白色,笔触为灰色。
给该矩形添加一个“内侧发光”滤镜效果,参数如图5-4所示。
将其移动到挂绳的下边适当位置,选择所有对象组合。
5)打开层面板,新建一个层,命名为“层2”。
选择层2,然后使用文字工具在信息框上面添加图5-1所示文字。
选中所有对象组合。
最终效果如图5-1所示。
至此,一个颇具立体感的信息框就完成了。
①按照自己的想法,运用各种手段,创作自己的信息框作品。
②使用本次实验所绘制的图5-1所示图形应用到其他场合,例如活页笔记本等。
实验六滑动菜单制作
随着web标准的概念深入人心,导航的设计也随之发生变化。
色彩明快,简洁,我就一种最具代表性网站导航滑动菜单的制作供大家借鉴学习。
1)熟悉和掌握线性填充类型,颜色调节,文本工具的使用,按钮制作,钢笔工具,文件导出等。
2)熟悉和掌握按钮效果的制作方法。
1)认真阅读课本第11章的内容,熟悉网页按钮,弹出菜单等的制作。
2)制作过程中注意按钮四个基本状态对最终效果的影响。
2)打开MacromediaFireworks8软件,新建大小为画布800*400,画布颜色为白色。
首先分析滑动菜单效果图。
单看图6-1(a)滑动菜单,感觉跟其他一般的导航条没什么两样,但是当鼠标移到到文字上面时候效果就出现了,如图6-1(b)。
图6-1(a)
图6-1(b)
1)用矩形工具画一个渐变的矩形,这里这个矩形是要做为导航条的背景,所以你可以调配自己喜欢的颜色,或者设置渐变等。
图6-2
2)然后用直线工具画了一条直线,设置笔触为4像素,描边种类
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Fireworks 实验 指导书