當前位置:才華齋>設計>動畫設計>

Flash的互動動畫設計介紹

動畫設計 閱讀(6.79K)

隨著網際網路技術的發展,基於Flash的互動動畫廣泛的應用於網際網路的每一個角落,給人們的生活學習帶來了巨大便利,下面是小編為大家搜尋整理的關於Flash的互動動畫設計,歡迎參考閱讀,希望對大家有所幫助!

Flash的互動動畫設計介紹

隨著資訊科技帶來的科技進步,如今網路媒體已經高度發達,互動動畫以及互動技術廣泛的應用於網際網路的每一個角落,給人們的生活學習帶來了巨大便利。與此同時,網際網路的迅猛發展帶來的龐大使用者群,也為形式多樣、內容豐富、動感十足的Flash成為當下熱門話題提供了受眾基礎。隨著許多精品Flash互動動畫的出現,基於Flash的互動動畫設計不斷受到各界人士的關注和青睞,其傳播的方式也逐漸走出單一的網路傳播途徑,走向傳統媒體與新興媒體。隨著 Flash技術本身的成熟與無線網路的發展,基於flash的互動動畫也將在不遠的將來走向更多的國內手機使用者,實現 Flash 網路傳播的新的跨越。

  1 基於Flash的互動性的分析

互動(interactive),在計算機中意思為,參與活動的物件,可以相互交流,雙方面互動。無論是何種互動,必須由三個部分來組成:互動方式、互動響應和互動結果[1]。互動方式指人和計算機打交道的抽象方式,是創作者為了傳達特定資訊,採用必要的技術手段構成的形式,可以分為基於物件和基於活動的兩類[2]。基於物件的互動方式是模擬現實世界的物件,例如,計算器應用程式,是對傳統真實計算器的模擬。基於活動的互動方式包括指示、對話、操作和導航、探索和瀏覽,比如按鈕、圖形元件、文字輸入框或選擇判斷元件等,是創作者為參與者留下的進入作品的資訊輸入口,它決定了動畫作品的外在形式。互動響應是參與者在互動過程中所採取的動作,互動結果則是響應的結果。

在這個瞬息萬變的年代,人與人之間的交流和互動變得越來越容易,通過不同的網路平臺,資訊的傳遞一秒千年,而互動性動畫又有別於一般性的傳統的動畫,其播放過程中的內容發展可以受到瀏覽者特定操作的影響,因而在動畫播放的時間順序方面,會改變固有的線性的或迴圈的播放順序,形成一種受制於受眾的操作結果的播放順序和方式。這種在播放時間方面的開放性改變,會促使受眾對於動畫的內容進行主動的挖掘,獲得豐富的資訊,從而擴大了受眾從動畫傳遞內容中所接受的資訊。因此,互動性的設計就越來越被大家重視和推崇。

伴隨著網際網路在中國的普及,人們越來越關注於如何更加靈活的呈現網路的互動性,促進通過網路的交流與溝通,又同時能流暢的展現細節而不影響使用者的使用體驗。

以網際網路為主要生存環境的FLASH 動畫進入了人們的視線,FLASH 動畫以其短小精緻、製作簡單、形式多樣等特性深受人們的喜愛。Flash 是美國Adobe 公司設計的一種二維動畫軟體,產生於上世紀九十年代中期,Flash 最早期的版本稱為Future Splash Animator。經過數年的發展,其軟體功能不斷加強,應用空間不斷拓展。基於FLASH的動畫檔案佔用空間非常小,有利於在各種網路頻寬的網際網路上傳播;另外,Flash互動動畫的開發週期短,簡便易學,製作成本低。大部分 flash小遊戲都是可以由一個人獨立完成的,所以遊戲的畫面、情節、美工等都比較簡單。因此使得Flash成為人們喜聞樂見的一種資訊傳播載體。

  2 Flash所具有的互動性技術優勢

由於Flash動畫的網路特性,這種互動被應用在網站建設和網路遊戲之中,Flash已成為網頁製作和網路互動的主要技術手段。互動性是新媒體藝術最重要的一個特徵,也是Flash動畫區別於傳統動畫的本質特徵。Flash的互動性優勢表現在以下三個方面:

2.1 支援事件響應和互動功能

在Flash動畫中,每個物件(符號或幀)都可以有自己的事件響應。設計者可以通過預先設定事件響應達到對動畫控制的目的。Flash 軟體中包含的帶有動畫效果的按鈕和選單,在 Flash 軟體中可以隨意建立按鈕、多級彈出式選單、複選框等進行互動設計。

2.2 利用 ActionScript 程式碼,實現互動功能設計

ActionScript 是一種基於 ECMAScript 的面向物件程式語言,用來編寫Adobe Flash 電影和應用程式,還可以設計各種各樣的簡單的和複雜的遊戲。因此,Flash具有互動性技術優勢,使用者通過點選、選擇等動作決定事件的執行過程和結果。

2.3 元件為Flash互動動畫設計提供了更多的方式

元件是 Flash 應用程式的一部分,主要通過在互動元件中與應用程式進行互動來做出響應。 典型互動元件的響應可以是回答一個問題(如,填空),從真或假中進行選擇(如,判斷、單選或多選),或單擊螢幕的某個區域(如,選取某個圖形)。因此,利用元件可以實現填空、判斷、選擇、拖放、熱區等多種形式多樣、而又豐富的互動活動。可以很容易實現用鍵盤、滑鼠控制圖形物件,實現互動小遊戲的開發和設計。

  3 Flash互動動畫的應用領域

Flash動畫互動性改變了傳統動畫的線性敘事方式,使使用者可以置入其中,根據個人需要使動畫以非線性敘事的方式呈現出來,充分調動了的積極性,從而引導使用者為了獲得資訊或愉悅體驗而進行一系列人機互動。進一步符合了廣大受眾對於個性化的要求,被廣泛的運用到人們的日常生活當中,具有很強的實用性。

Flash 動畫同時是一門新興的藝術與科學相結合而形成的、具有非常廣泛學科優勢的綜合性藝術形式[4]。在 Flash 動畫的創作和製作過程,實際上就是多種藝術門類和科學技術的綜合過程,因此,Flash互動動畫具備很高的實用價值和藝術價值。Flash 動畫應用領域十分廣泛——網站建設、廣告宣傳、教育教學、故事短片、遊戲等,下面對幾種領域作一下著重介紹。

3.1 網站建設

基於Flash的互動動畫網站(如圖1所示)色彩豔麗、風格獨特,使得頁面生動而富有吸引力。

Flash互動動畫特別適合網站建設,幾乎所有的網頁介面裡都可以見到Flash互動動畫。在網站建設中,廣告、字幕、網站視窗、按鈕等都可以用 Flash 互動動畫來製作,由於 Flash 動畫的應用,網頁介面一改過去的簡單、枯燥,而變得動感、多變、時尚、藝術感強、內容更豐富,迎合了現代人的要求。

3.2 廣告宣傳

由於 Flash 動畫互動性強的特點,很多企業用 Flash動畫進行企業產品的展示,生動活潑的展現公司產品。例如,迪斯尼公司的宣傳廣告(如圖2所示)就用色彩明快的Flash互動動畫展示了特有的公司主題,充分體現了符合少年兒童年齡特點的活潑和可愛,吸引消費者的關注。

3.3 教育教學

用Flash動畫可以將文字、圖形、影象、動畫、聲音、視訊集成於一體,設計出精彩有趣的多媒體學習課件,並具有一定的互動功能,被廣泛應用在計算機輔助教學中。它使教學內容豐富多彩,形象直觀,使那些原本枯燥無味的知識變得富有趣味性,使學生產生極大的`好奇心,從而激發了學生學習的興趣。例如,我們在講解逐幀動畫理論的時候,就可以利用Flash動畫課件來輔助學生更快理解(如圖3所示)。通過直接使用Flash設計互動動畫,先向學生展示1.2.3幅圖片,讓學生觀察區別,再連續播放,產生國旗飄動效果,就很直觀的向學生展示了逐幀動畫的應用了。

3.4 故事短片

Flash 動畫技術門檻低,取材廣泛,幾乎所有的文學作品、相聲作品、小品、流行音樂,都能改編為動畫作品。學生在經過一段時間學習後,就能掌握設計Flash互動動畫的基本要領了。例如,在2010年學生帶領學生製作的《升國旗》、《金色的秋》兩部動畫作品裡(如圖4所示),學生以身邊的故事為藍本,用細膩的感情勾畫出了青年人內心對於美好的描述。

3.5 遊戲

由於使用Flash的動畫可以實現互動控制,操作起來十分簡便,可以很好地將向量圖的靈活性和精確性與聲音、點陣圖、視訊融合起來,並且檔案佔用儲存空間小,因而 Flash動畫技術被廣泛的應用於各種遊戲製作。由於Flash的動畫形式多樣、內容豐富、色彩豔麗、互動性強,從而深受廣大使用者的喜愛。《瘋狂猜猜猜》,就是一款利用Flash互動技術實現的動畫遊戲,在網際網路和移動裝置上都能夠使用,並能帶給使用者很好的遊戲體驗。由於大受歡迎,排在17173網站的最受歡迎小遊戲首位。

  4 Flash中互動動畫設計方法

Flash 中提供的ActionScript 程式語言使Flash 具有了互動功能,動畫的互動過程叫行為,它包含兩個部分:一是事件,一是事件引發的動作。通常情況下,計算機程式就是計算機分步執行的一系列指令語句,甚至一些簡單的計算機程式僅包括幾個步驟指令以及程式的結束指令。然而,在Flash中提供的ActionScript 程式可以保持執行、等待使用者輸入或等待其它事件發生。Flash互動中的“事件”是確定計算機執行哪些指令以及何時執行的機制。從本質上講,“事件”就是所發生的、ActionScript 能夠識別並可響應的事情。

在Flash中,互動是設計絕大部分“事件”的目的,許多事件都與使用者互動有關。我們通過對“事件”的設計,來實現使用者的互動體驗。例如,使用者點選按鈕,或者按下滑鼠或者鍵盤等等。在ActionScript語言執行的過程中,Flash如同在等待使用者的響應,即事件的觸發,而後執行時間引發的動作,即執行事件制定的特定的ActionScript 程式碼。因此,建立互動式動畫的關鍵是設定當指定的事件發生時要執行的動作。使用者的響應對“事件”的觸發,既可以在動畫播放到特定幀時觸發動作,也可以在使用者單擊按鈕或按鍵時觸發動作設計著可以為事件的響應設計一定的動作。事件一般包含滑鼠事件、幀事件、電影片段事件等等,動作指令碼也可以有很多,可由開發者根據需要來設計和編寫ActionScript 程式碼。

通常Flash互動動畫作品主要是藉助滑鼠、鍵盤的移動或點選來實現。例如,下面這個指令碼語言程式碼是為了實現當用戶單擊按鈕時,開始播放當前的影片剪輯的事件。其中,“playButton” 是按鈕的例項名稱,而 this 是表示“當前物件”的代指名稱:

();

function playMovie(event:MouseEvent):void

{

();

}

ventListener(K, playMovie);

通過上面的指令碼語言程式碼就實現了在使用者響應互動動畫的點選動作時,觸發播放影片的事件了。Flash互動動畫的最主要的互動形式就是通過對按鈕的點選。當滑鼠經過或者點選Flash 中嵌入的 “動態按鈕”時,就會連結到下一個視窗。而有時,按鈕除了具有連結的使用功能,還具有了裝飾作品的獨立意義。

還有一類Flash互動動畫在設計指令碼是的主要目的是為了豐富畫面,一般常見的形式有滑鼠跟隨、磁鐵滑鼠和三維滑鼠跟隨。有時為了更好實現互動效果,我們會通過使用在 Flash 中設計的滑鼠指標來代替標準滑鼠指標(如圖6所示),可以將使用者的滑鼠移動更緊密地整合到 SWF 檔案中。

而想要實現這個非常容易集中使用者注意力的互動動畫效果卻並不複雜。首先,建立一個用來代替原有滑鼠指標的影片剪輯,並將這個剪輯的例項放置在舞臺上。 在舞臺上選擇該影片剪輯例項。 在“屬性”面板中的講例項的名字命名為 new_mc。

在時間軸中選擇第 1 幀,然後在“動作”面板中新增下面的程式碼:

();

new_useMove = function() {

this._x = _xmouse;

this._y = _ymouse;

updateAfterEvent();

};

這時測試影片就會得到想要看到的指標若隱若現的動畫效果了。通常這個應用會廣泛用於互動動畫中,根據設計者製作的形式多樣、圖形各異的代替滑鼠指標的影片剪輯,通過點陣圖、向量圖、聲音等元素的融合,滑鼠指標在互動動畫中就會有豐富的變化和效果,從而使瀏覽和使用者獲得更好的視覺體驗。

Flash 中提供的ActionScript指令碼語言的功能也隨著Flash版本的更新,在逐漸的完善和強大。隨著設計者對於程式語言的深入學習和研究,ActionScript指令碼語言中提供的豐富的計算機語言元素:常量、變數、運算子、表示式、函式、屬性、動作、物件等等,為設計者們提供了更寬廣的互動設計平臺。

  5 總結和展望

Flash軟體從1995年誕生以來,從作為一個互動外掛發展成為綜合的數字動畫、互動式Web站點、桌面應用程式以及手機應用程式開發和創作編輯環境。Flash已經逐步成為一種動畫創作與應用程式開發於一身的創作軟體。這其中離不開Flash軟體開發團隊的不懈努力,同時也是眾多Flash互動動畫設計者們十幾年來努力研究Flash使用方法、提升Flash互動功能實現效果的結果。

由於Flash動畫的互動設計功能實現的方式不唯一,途徑和表現形式也豐富多樣,因而在追求Flash互動動畫設計技術提高的同時,我們也應當注重Flash互動動畫設計過程中所體現出的藝術性。

Flash是計算機技術與動畫藝術相結合的產物,技術的不斷髮展使Flash互動動畫的藝術表現空間更加廣闊,而Flash互動動畫的藝術性又使得廣大設計者不斷追求計算機技術的提高。因而,在這個周而復始Flash 互動動畫的不斷創作和實踐過程中,技術和藝術得到了充分的結合。從而不斷拓展Flash互動動畫的應用領域,不斷推動Flash互動動畫向著更有影響力的方向發展。