《电子商务网站动画设计》课程大作业

《《电子商务网站动画设计》课程大作业》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、学号20510811119《电子商务网站动画设计》课程大作业2013～2014学年第一学期教学单位：经济管理系电商教研室指导教师：代四广专业班级：电商1111学生姓名：费志安2013年11月25日“WEB之星”网站动画设计报告书一、构建网站的目的：制作该网站是为了检验本学期学习的Flashcs3动画设计的学习成果，在学习的过程中锻炼动手能力，让平时学习到的知识得到实际应用。该网站是一个网页设计评选比赛的宣传与报名的窗口，主要用于对比赛的宣传与报名。网站的内容涉及网页动画效果以及对活动的介绍，参赛条件，报名方式等。二、准备工作：动手制作网站之前先得收集一些音视频及

2、图片材料，这里直接利用老师提供的素材。其次是网站的整体构思。首先是网页布局，主页主要分为三大块，呈T字型：上面是本次比赛的一个大的LOGO，logo下面正中间是网页的主体内容，内容的左边是导航。网页以深蓝色为主色调，辅助色为黄色。网站要实现的功能有闪烁的动画效果、位移动画效果、按钮、影片剪辑、页面跳转、按钮点击播放音乐等。三、网页制作过程记录：制作过程分为三步，第一步制作页面最上面的LOGO部分，第二步制作左边的导航栏部分，第三部就是正文部分以及整个页面的排版。（一）LOGOLOGO的最终效果如下所示：1、首先来制作黄色的椭圆：选择椭圆工具，画一个扁平的椭圆，选

3、择颜料桶工具将颜色改为黄色，删掉椭圆的边线然后将其转换成元件，取名为椭圆转换为元件前应将椭圆全部选中。2、然后制作“星”字。“星”字的上面是一个星星，而且在后面的也要用到，因此先来制作星星图案，并将其转化为元件。选择多角星形工具，在属性面板中选择选项，选择样式中的星形点确定，换一种黄色，将边线设置为白色。然后再给添加白线，选择线条工具，将笔触颜色改为白色，将其转换为元件。接下来制作星字，但是上面的日字中间缺一行，所以先输入星字，再把字体转换为散件删去中间的一行。星字的边框是黄色的，因此给它添加边框，选择直线工具，将笔触颜色改为黄色，线型改为实线，打开磁铁工具，沿

4、着字体的边沿画直线，如上中图。星字上面还有一个光条来回闪烁的效果，因此先来制作光条，先用矩形工具画一个矩形，利用变形工具调成平行四边形的形状，填充渐变色，颜色为白色，将两边的不透明度调为10%，选择颜料桶工具填充颜色。然后新建图层，将之前做好的星字放在新建的图层2，然后将光条放在星字的左边，在图层2的第15帧处插入关键帧，将光条移动到星字的右边，创建补间动画，光条移动到右边后还要回去，所以在第29帧处插入空白关键帧，将第1帧原位复制粘贴到第29帧，在图层1的第29帧处按F5，然后新建图层3，复制图层2的第一帧，粘贴到图层3的第一帧，选中第29帧，按F5，将星星图

5、案放到图层3，调整好位置和图层层次关系：接下来制作“Web”“之”字和后面的圆。接下来制作网页设计师评选大赛几个字及其后面的背景、边框：首先做一个矩形，填充渐变色，在改变其形状：再用相同的办法制作里面黄色的背景图案然后在里面添加文字将其转换为元件。LOGO所需的图案全都做完后进行排版为了方便后面的操作，将其转换为元件。至此，LOGO部分制作完成。（一）导航栏当点击导航栏时可以跳转页面，所以导航栏必须是按钮。制作按钮之前先要制作好素材。用椭圆工具画两个椭圆，带边框，利用散件的性质将两个椭圆拼成月牙状然后删掉重合的部分删去红色椭圆，利用墨水瓶工具将月牙的边框填上。然

6、后将其转换为影片剪辑新建元件，取名流星，制作流星。将原来做好的星星放到舞台中间，在图层1的第10帧处插入关键帧，在第1帧与第10帧之间插入补间动画，选中图层1单击右键选择创建引导层进入流星轨迹元件里面复制轨道上边的边线粘贴到流星元件内的引导图层的第1帧，然后选中流星所在图层，打开磁铁工具，在第1帧处将流行放在引导线的右端，在第10帧处将流星放在引导线的左端。新建元件，制作椭圆形按钮画一个带外边框的椭圆，填充渐变色，将其复制缩小，填充方向相反的渐变色都做好后，开始创建按钮，新建元件，将库面板中的星星、流行轨迹、圆拖到舞台中来，摆放好位置，在第二帧处插入关键帧，这时

7、选中星星，删除，将流星拖到原来星星的位置，将流星轨迹排列到底层。选中圆，在属性面板中将亮度调整为负的百分之十在第3帧处插入关键帧，再把圆的亮度调整为正数，然后输入文字。用同样的方法制作另外一个按钮。（一）现在开始制作闪烁的星星及背景。将原先做好的星星拖到舞台，做成闪烁的影片剪辑效果：新建影片剪辑元件，将星星图案拖到舞台，在第2帧处插入关键帧，选中第2帧的图案，打散为散件，修改其颜色，即可做成闪烁的效果。然后将虚线效果用图像元件来实现。接下来制作整个页面的背景。选用矩形工具，将边框颜色设为无，填充颜色为浅蓝色，画一个矩形，CTRL+T快捷键打开对齐面板将矩形满画布

8、显示，然后利用钢笔工具在