Flash动画设计在网站中的应用

Flash动画设计在网站中的应用

作者：朱珊虹 李林涛

来源：《合作经济与科技》2011年第15期

提要Flash动画主要为网络应用开发的交互式矢量图形动画格式。网页设计人员经常使用Macromedia Flash创建导航控件、动画徽标、动态广告等。本文着重以网站中常见的嵌入式的部分动画设计元素为例，说明Flash动画在网站中的应用。 关键词：Flash动画；动画设计；网站设计 中图分类号：F49文献标识码：A 一、引言

网络和其他媒体的区别就在于互动性。网络的呈现方式——网页，就必须要足够地体现互动特征。但要以如何的面目呈现给浏览者呢?不但网页的实用性要好，而且艺术设计也成为吸引和留住浏览者的一把钥匙，而构成这一设计的关键因素就是Flash动画，它是在艺术形态上的互动，内容上的交流。因此，网站中Flash动画设计的形式，可以是全部的静态页面，也可以是在静态页面中嵌入部分动画设计或是全部的动画设计。

二、网站中的Flash广告动画

网络广告有动态的、交互的、在视觉和听觉全方位的信息传达与情感体验等特点，它所包含的内容既专业又广泛。其中，动画广告是网页设计中很多广告普遍采用的一种表现方式，动画广告中一些画面有的是纯动画的，也有实拍和动画结合的，在表现一些实拍无法完成的画面效果时就要用到动画来完成或两者结合，现在我们所看到的广告，从制作的角度看，几乎都或多或少地用到了动画，如文字与画面的交替出现、广告文字的放大或醒目处理等。 广告通过动画的效果吸引到浏览者，浏览者可以通过点击来看广告所要诉求的信息。因此，基于它的功能性，這一类广告除了要做成动画效果外，在设计上，不能太杂、太乱，色彩和动画效果更不能太花；同时，在页面的位置选择上，要特别注意，不能遮挡页面的主要信息，以免让浏览者感到烦恼以至于产生厌恶情绪而影响到整个网站的浏览量，网络动画广告的

龙源期刊网 http://www.qikan.com.cn

类型有很多，应用广泛。那么，通常情况下，这类动画不是作为页面的一部分有其区域分配，就是放于页面两侧，作为浮动广告。

（一）网站中的动画声音。如果能在五彩缤纷的网页动画中再加上美妙的声音，则会有锦上添花的效果。在网页中，声音部分有：鼠标点击的链接转入声、背景音乐、网页插入视频或网络电视声音、音乐、广播电台的现场播音等，网上流行的声音格式有：MIDI、WAV、MP3、RealAudio。MIDI格式音乐的特点是占用空间小，但颜色单调；WAV是无压缩声音文件，在所有带有声卡的电脑中都可以播放；MP3压缩音乐文件，占用空间小得多，但是要先下载后收听；RealAudio，比WAV和MP3音质稍差，但占用空间却小许多。可以一边下载一边播放。

网页设计中的鼠标点击的链接转入声和背景音乐，在鼠标点击后，应该发出清脆的声音，来反映出转入链接的快速感，以给予浏览者充分得到回应后的心理满足感，以便充分调动起浏览者再继续浏览其他内容的积极性；而在背景音乐的设计上，可以按照网站的性质来选择音乐风格，选择时要用悦耳的音乐，要考虑到众多种爱好浏览者的接受程度。

同时，最好把声音的控制按钮放于页面的一个位置，可以由浏览者来调节是开或者关，尊重浏览者的个人爱好，还有一点要注意，有很多浏览者会是在安静或办公、又或公共场合下浏览网页，会不希望一打开网页，就马上传出声音，而给其他人造成不便。因此，不能专注于光考虑网页和动画的效果，还得充分尊重到浏览者，背景音乐可以设置为默认关闭，但有可以由访问者亲自调节为“开”的声音控制按钮。

（二）网站中的动画色彩。运用不同的色彩，网站的外观风格有所不同，网站给人的感觉也不同。也就是说，色彩作为传达网站形象的首位视觉要素，会在访问过网站的使用者脑海中留下长久的印象。即使使用者无法清楚地记住自己访问过的网站的外形特征，至少能够容易地想起网站的色彩。也就是说，色彩作为最直接的视觉语言，色彩也一定要遵守一些规范。一般情况下，一个网站的形象展示动画，如同网站的LOGO一般，色彩在设计时应遵循企业的CI规范，按照标准色和辅助色来设计，或者采用网页主色。主要是要在浏览者面前形成统一的形象记忆。其他搭配色则可以依情况采用其他色，或直接插入企业形象产品等。除此以外，色彩的搭配上，要尽量醒目，与整个页面协调。

三、网站中的鼠标动画

在鼠标做动画效果时，需要注意的色彩搭配，其实就是指鼠标移动轨迹的图案和色彩。这种色彩首先应该区别于页面色彩，使浏览者可以清晰的找到鼠标的位置，以利于用户更方便地浏览页面信息。而鼠标移动的轨迹不可以阻挡下边的页面信息，所以图形尽量要小，色彩除了

龙源期刊网 http://www.qikan.com.cn

脱出于页面外，可以设计为稍透明的感觉，并且鼠标的移动轨迹不宜太长。当然，鼠标动画的设计相对其他难度性大些，需要语言编程。

四、网站中的动画导航系统

如今，丰富多样的动态效果逐渐出现。新媒体具有的网络双向互动特点极大地支持了新环境下的交互式设计环境。使用者虽然仍然是通过单纯的鼠标点击和键盘操作来浏览网页，但是使用者选择菜单的导航方式却已经丰富多样。交互式导航不仅仅是单纯的鼠标移上效果，它能够带给人新鲜感和愉快感，但更优越于其使用性的交互式导航功能，使用者的参与是交互式导航的必需条件，在这种情况下，必须要有诱导使用者互动的设计。

交互式导航栏的设计必须是在实现其功能性的前提下来进行动画交互和视觉设计的。在功能性上，导航栏有着引导用户浏览信息的作用，设计时通常需要分出几个级别的导航栏，并在这几个级别的醒目程度上做出区分，特别是一级导航栏一般要突出其立体感和鲜明感。在色彩的运用上，可以选用亮丽、透明、清爽的色彩搭配，引导浏览者去点击、甚至享受这一过程的喜悦。同时，导航链接最好是设置成“打开新的页面”，这样有利于浏览者分别条理性地浏览每一个导航菜单下的内容。在具备以上条件的基础上，通过动画设计的导航栏，不但从视觉上达到美观特别，还充分体现出浏览者的点击快感，甚至可以配以清脆的声音。而在导航栏造型和动画效果的设计上，可以充分发挥想象力，充满特别的乐趣，使浏览者很欣喜地参与进去。 除此以外，诸如网页中的“按钮”，按钮是网页的重要组成元素之一，在网页中发挥着十分重要的作用。要达到信息良好的交互传达，导航系统的设计十分重要，每一级导航都要有清晰明了的导航设置，并在其醒目的位置设置下一级页面信息的链接。尽量以明确而有条理的设计使浏览者按网页中设置的浏览主线访问每一个页面。动画导航系统不但可以获得浏览者的青睐，而且其交互性的设计使网页以强有力的信息交互作用留住大量的用户群。

Flash动画导航系统交互性的设计，通常需要调动它的脚本语言：Action script。它的基本语法接近于VBScript，中文可以直接译为“动作脚本”，它是Flash专用的一种程序语言，采用面向对象编程的思想，采用Flash中的事件对程序进行驱动，以动画中的关键帧、按钮或电影片断作为对象来对脚本语言ActionScript进了二定义和编写。例如，在Flash软件中“舞台”上选定一个图形或按钮作为对象，然后通过关键帧里的脚本程序代码、电影剪辑符实例内的脚本代码或某个按钮内的脚本程序代码来对这个已选定的对象的各种属性进行控制，如位置、颜色、形状等。

另外，也可以通过一个按钮所产生的事件来控制某个对象，例如鼠标指针经过按钮事件、鼠标单击事件等。在浏览者松开鼠标和将鼠标移上按钮，甚至用鼠标点击时的反应都可以是不一样的，可以是按钮的颜色发生变化，也可以是其上显示的文字的变化，更可以是其形状大小

龙源期刊网 http://www.qikan.com.cn

的变化。这一个个动画效果，可以跟浏览者达成互动，让浏览者看到他的动作是有回应的，同时更能调动起浏览者的积极性。设计中，每个按钮甚至都可以设置出动画效果，只要我们在设计其显示效果时，尽量注意同时实施一种或两种左右的设计方案，以避免因动画设计的不统一使浏览者感到烦乱。 五、结论

Flash动画作为网页设计元素中的重要组成部分，已经得到网站设计者的重视和应用。因此，要想更好地发挥网页设计中Flash动画的特性，必须从各个方面来了解和分析，这是一个值得关注的问题。希望本研究在今后可以得到完善和运用，以启示我国网页设计及Flash动画交互设计的爱好者们能够注意到这个问题，研究并设计出更杰出的作品来，同时来带动我国网页动画设计的整体水平，形成真正的交流传播平台。 （作者单位：新乡学院计算机与信息工程学院）

主要参考文献：

[1]姜兆龙，张漩.网页设计师完全手册[M].北京：清华大学出版社，2006. [2]贾否，路盛章.动画概论[M].北京：中国传媒大学出版社，2005. [3]廖哗.网页界面设计及其学科相关性研究[J].湖南：湖南师范大学，2006. [4]李学进，杨微.Flash在教学中的应用[J].电脑学习，2006.2. [5]姜军，张光帅.网络动画设计[M].北京：清华大学出版社，2007.