Flash動畫設計在網站中的應用

□文/朱珊虹 李林濤

一、引言

網絡和其他媒體的區別就在于互動性。網絡的呈現方式——網頁，就必須要足夠地體現互動特征。但要以如何的面目呈現給瀏覽者呢?不但網頁的實用性要好，而且藝術設計也成為吸引和留住瀏覽者的一把鑰匙，而構成這一設計的關鍵因素就是Flash動畫，它是在藝術形態上的互動，內容上的交流。因此，網站中Flash動畫設計的形式，可以是全部的靜態頁面，也可以是在靜態頁面中嵌入部分動畫設計或是全部的動畫設計。

二、網站中的Flash廣告動畫

網絡廣告有動態的、交互的、在視覺和聽覺全方位的信息傳達與情感體驗等特點，它所包含的內容既專業又廣泛。其中，動畫廣告是網頁設計中很多廣告普遍采用的一種表現方式，動畫廣告中一些畫面有的是純動畫的，也有實拍和動畫結合的，在表現一些實拍無法完成的畫面效果時就要用到動畫來完成或兩者結合，現在我們所看到的廣告，從制作的角度看，幾乎都或多或少地用到了動畫，如文字與畫面的交替出現、廣告文字的放大或醒目處理等。

廣告通過動畫的效果吸引到瀏覽者，瀏覽者可以通過點擊來看廣告所要訴求的信息。因此，基于它的功能性，這一類廣告除了要做成動畫效果外，在設計上，不能太雜、太亂，色彩和動畫效果更不能太花；同時，在頁面的位置選擇上，要特別注意，不能遮擋頁面的主要信息，以免讓瀏覽者感到煩惱以至于產生厭惡情緒而影響到整個網站的瀏覽量，網絡動畫廣告的類型有很多，應用廣泛。那么，通常情況下，這類動畫不是作為頁面的一部分有其區域分配，就是放于頁面兩側，作為浮動廣告。

（一）網站中的動畫聲音。如果能在五彩繽紛的網頁動畫中再加上美妙的聲音，則會有錦上添花的效果。在網頁中，聲音部分有：鼠標點擊的鏈接轉入聲、背景音樂、網頁插入視頻或網絡電視聲音、音樂、廣播電臺的現場播音等，網上流行的聲音格 式 有 ：MIDI、WAV、MP3、RealAudio。MIDI格式音樂的特點是占用空間小，但顏色單調；WAV是無壓縮聲音文件，在所有帶有聲卡的電腦中都可以播放；MP3壓縮音樂文件，占用空間小得多，但是要先下載后收聽；RealAudio，比WAV和MP3音質稍差，但占用空間卻小許多。可以一邊下載一邊播放。

網頁設計中的鼠標點擊的鏈接轉入聲和背景音樂，在鼠標點擊后，應該發出清脆的聲音，來反映出轉入鏈接的快速感，以給予瀏覽者充分得到回應后的心理滿足感，以便充分調動起瀏覽者再繼續瀏覽其他內容的積極性；而在背景音樂的設計上，可以按照網站的性質來選擇音樂風格，選擇時要用悅耳的音樂，要考慮到眾多種愛好瀏覽者的接受程度。

同時，最好把聲音的控制按鈕放于頁面的一個位置，可以由瀏覽者來調節是開或者關，尊重瀏覽者的個人愛好，還有一點要注意，有很多瀏覽者會是在安靜或辦公、又或公共場合下瀏覽網頁，會不希望一打開網頁，就馬上傳出聲音，而給其他人造成不便。因此，不能專注于光考慮網頁和動畫的效果，還得充分尊重到瀏覽者，背景音樂可以設置為默認關閉，但有可以由訪問者親自調節為“開”的聲音控制按鈕。

（二）網站中的動畫色彩。運用不同的色彩，網站的外觀風格有所不同，網站給人的感覺也不同。也就是說，色彩作為傳達網站形象的首位視覺要素，會在訪問過網站的使用者腦海中留下長久的印象。即使使用者無法清楚地記住自己訪問過的網站的外形特征，至少能夠容易地想起網站的色彩。也就是說，色彩作為最直接的視覺語言，色彩也一定要遵守一些規范。一般情況下，一個網站的形象展示動畫，如同網站的LOGO一般，色彩在設計時應遵循企業的CI規范，按照標準色和輔助色來設計，或者采用網頁主色。主要是要在瀏覽者面前形成統一的形象記憶。其他搭配色則可以依情況采用其他色，或直接插入企業形象產品等。除此以外，色彩的搭配上，要盡量醒目，與整個頁面協調。

三、網站中的鼠標動畫

在鼠標做動畫效果時，需要注意的色彩搭配，其實就是指鼠標移動軌跡的圖案和色彩。這種色彩首先應該區別于頁面色彩，使瀏覽者可以清晰的找到鼠標的位置，以利于用戶更方便地瀏覽頁面信息。而鼠標移動的軌跡不可以阻擋下邊的頁面信息，所以圖形盡量要小，色彩除了脫出于頁面外，可以設計為稍透明的感覺，并且鼠標的移動軌跡不宜太長。當然，鼠標動畫的設計相對其他難度性大些，需要語言編程。

四、網站中的動畫導航系統

如今，豐富多樣的動態效果逐漸出現。新媒體具有的網絡雙向互動特點極大地支持了新環境下的交互式設計環境。使用者雖然仍然是通過單純的鼠標點擊和鍵盤操作來瀏覽網頁，但是使用者選擇菜單的導航方式卻已經豐富多樣。交互式導航不僅僅是單純的鼠標移上效果，它能夠帶給人新鮮感和愉快感，但更優越于其使用性的交互式導航功能，使用者的參與是交互式導航的必需條件，在這種情況下，必須要有誘導使用者互動的設計。

交互式導航欄的設計必須是在實現其功能性的前提下來進行動畫交互和視覺設計的。在功能性上，導航欄有著引導用戶瀏覽信息的作用，設計時通常需要分出幾個級別的導航欄，并在這幾個級別的醒目程度上做出區分，特別是一級導航欄一般要突出其立體感和鮮明感。在色彩的運用上，可以選用亮麗、透明、清爽的色彩搭配，引導瀏覽者去點擊、甚至享受這一過程的喜悅。同時，導航鏈接最好是設置成“打開新的頁面”，這樣有利于瀏覽者分別條理性地瀏覽每一個導航菜單下的內容。在具備以上條件的基礎上，通過動畫設計的導航欄，不但從視覺上達到美觀特別，還充分體現出瀏覽者的點擊快感，甚至可以配以清脆的聲音。而在導航欄造型和動畫效果的設計上，可以充分發揮想象力，充滿特別的樂趣，使瀏覽者很欣喜地參與進去。

除此以外，諸如網頁中的“按鈕”，按鈕是網頁的重要組成元素之一，在網頁中發揮著十分重要的作用。要達到信息良好的交互傳達，導航系統的設計十分重要，每一級導航都要有清晰明了的導航設置，并在其醒目的位置設置下一級頁面信息的鏈接。盡量以明確而有條理的設計使瀏覽者按網頁中設置的瀏覽主線訪問每一個頁面。動畫導航系統不但可以獲得瀏覽者的青睞，而且其交互性的設計使網頁以強有力的信息交互作用留住大量的用戶群。

Flash動畫導航系統交互性的設計，通常需要調動它的腳本語言：Action script。它的基本語法接近于VBScript，中文可以直接譯為“動作腳本”，它是Flash專用的一種程序語言，采用面向對象編程的思想，采用Flash中的事件對程序進行驅動，以動畫中的關鍵幀、按鈕或電影片斷作為對象來對腳本語言ActionScript進了二定義和編寫。例如，在Flash軟件中“舞臺”上選定一個圖形或按鈕作為對象，然后通過關鍵幀里的腳本程序代碼、電影剪輯符實例內的腳本代碼或某個按鈕內的腳本程序代碼來對這個已選定的對象的各種屬性進行控制，如位置、顏色、形狀等。

另外，也可以通過一個按鈕所產生的事件來控制某個對象，例如鼠標指針經過按鈕事件、鼠標單擊事件等。在瀏覽者松開鼠標和將鼠標移上按鈕，甚至用鼠標點擊時的反應都可以是不一樣的，可以是按鈕的顏色發生變化，也可以是其上顯示的文字的變化，更可以是其形狀大小的變化。這一個個動畫效果，可以跟瀏覽者達成互動，讓瀏覽者看到他的動作是有回應的，同時更能調動起瀏覽者的積極性。設計中，每個按鈕甚至都可以設置出動畫效果，只要我們在設計其顯示效果時，盡量注意同時實施一種或兩種左右的設計方案，以避免因動畫設計的不統一使瀏覽者感到煩亂。

五、結論

Flash動畫作為網頁設計元素中的重要組成部分，已經得到網站設計者的重視和應用。因此，要想更好地發揮網頁設計中Flash動畫的特性，必須從各個方面來了解和分析，這是一個值得關注的問題。希望本研究在今后可以得到完善和運用，以啟示我國網頁設計及Flash動畫交互設計的愛好者們能夠注意到這個問題，研究并設計出更杰出的作品來，同時來帶動我國網頁動畫設計的整體水平，形成真正的交流傳播平臺。

[1]姜兆龍，張漩.網頁設計師完全手冊[M].北京：清華大學出版社，2006.

[2]賈否，路盛章.動畫概論[M].北京：中國傳媒大學出版社，2005.

[3]廖嘩.網頁界面設計及其學科相關性研究[J].湖南：湖南師范大學，2006.

[4]李學進，楊微.Flash在教學中的應用[J].電腦學習，2006.2.

[5]姜軍，張光帥.網絡動畫設計[M].北京：清華大學出版社，2007.