FLASH交互性動(dòng)畫在網(wǎng)頁設(shè)計(jì)中的應(yīng)用與研究

楊遠(yuǎn)峰

摘要：隨著計(jì)算機(jī)信息技術(shù)的不斷發(fā)展，通過Flash設(shè)計(jì)網(wǎng)頁對(duì)提高網(wǎng)頁的質(zhì)量起到著重要的作用。與此同時(shí)，在新時(shí)期，隨著互聯(lián)網(wǎng)絡(luò)與人們的生活、工作變得更加緊密相連，F(xiàn)lash動(dòng)畫已經(jīng)被越來越多的人關(guān)注，并被頻繁運(yùn)用到網(wǎng)絡(luò)社交與軟件開發(fā)領(lǐng)域，特別是在多媒體網(wǎng)站的制作上，越來越普遍。對(duì)此，本文關(guān)于網(wǎng)頁設(shè)計(jì)中對(duì)Flash動(dòng)畫的應(yīng)用研究，筆者首先對(duì)Flash動(dòng)畫的相關(guān)概念及其表現(xiàn)特點(diǎn)簡要論述，然后依據(jù)著Flash動(dòng)畫的設(shè)計(jì)特征，更進(jìn)一步的論述Flash動(dòng)畫的相關(guān)應(yīng)用以及交互性設(shè)計(jì)。

關(guān)鍵詞： Flash動(dòng)畫； 交互性； 網(wǎng)頁設(shè)計(jì)

中圖分類號(hào)：TP37 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1009-3044（2017）04-0197-02

21世紀(jì)是全新的互聯(lián)網(wǎng)知識(shí)經(jīng)濟(jì)時(shí)代，互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展，讓網(wǎng)絡(luò)發(fā)展成為了人們生活、工作中必不可少的重要組成部分。換言之，在這種大發(fā)展趨勢(shì)下，人們對(duì)于互聯(lián)網(wǎng)技術(shù)的應(yīng)用與標(biāo)準(zhǔn)要求也越來越高。比如在網(wǎng)頁設(shè)計(jì)技術(shù)應(yīng)用這一領(lǐng)域，包括在生活中、在工作中、在學(xué)習(xí)中，人們對(duì)于以往傳統(tǒng)的靜態(tài)網(wǎng)頁表現(xiàn)出了更多的不滿，正因如此，基于Flash動(dòng)畫視覺的網(wǎng)頁成為了今后網(wǎng)絡(luò)發(fā)展的主要趨勢(shì)。

1 相關(guān)概念界定

1.1 網(wǎng)頁設(shè)計(jì)

“網(wǎng)頁”是指在互聯(lián)網(wǎng)絡(luò)環(huán)境下，網(wǎng)絡(luò)用戶瀏覽信息的一個(gè)載體平臺(tái)，可以獲取、了解自己想要知道和查詢的信息。在網(wǎng)頁瀏覽中，無異于以下幾種情況，工作需要、學(xué)習(xí)資料查詢、休閑娛樂等等?？傊?，網(wǎng)頁設(shè)計(jì)能夠吸引人才是成功的起點(diǎn)、關(guān)鍵，通常情況下，網(wǎng)頁設(shè)計(jì)質(zhì)量直接影響著網(wǎng)民瀏覽信息的興趣。對(duì)此，在網(wǎng)頁設(shè)計(jì)中，均改變了傳統(tǒng)的一套策略理念與設(shè)計(jì)形式，通過優(yōu)化網(wǎng)絡(luò)頁面的排版，注重網(wǎng)頁具有清晰的主次，強(qiáng)調(diào)中心，色彩和諧，重點(diǎn)突出等。當(dāng)然，需要特別注意的是，動(dòng)態(tài)的元素不宜太多?？傮w上來看，在Flash技術(shù)的嵌入下，網(wǎng)頁設(shè)計(jì)已然變成了一種交互式的多媒體系統(tǒng)平臺(tái)。第一，通過夸張的動(dòng)畫效果與內(nèi)容情節(jié)吸引更多的用戶關(guān)注；第二，交互式優(yōu)勢(shì)更加明顯，網(wǎng)民的參與性比較強(qiáng)；第三，可以降低整個(gè)網(wǎng)頁設(shè)計(jì)與后期運(yùn)營管理成本，更重要的是提升了網(wǎng)頁質(zhì)量，將核心內(nèi)容盡情突出。

1.2 Flash動(dòng)畫

Flash是由macromedia公司推出的一種交互式矢量圖和Web動(dòng)畫的標(biāo)準(zhǔn)。目前，主要被應(yīng)用于各類多媒體及其網(wǎng)站設(shè)計(jì)領(lǐng)域。比如在網(wǎng)頁設(shè)計(jì)中，設(shè)計(jì)者使用Flash相應(yīng)的軟件及其技術(shù)來創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面，或者融入一些其他元素來達(dá)到一種奇特、吸引人的效果。是全世界出現(xiàn)的第一個(gè)商用的二維矢量動(dòng)畫設(shè)計(jì)類軟件，多用于文檔編輯設(shè)計(jì)，而本文所重點(diǎn)提到的Flash則是美國Macromedia公司所設(shè)計(jì)的一種二維動(dòng)畫軟件。就目前而言，F(xiàn)lash不僅僅只看作是一種動(dòng)畫創(chuàng)作軟件，同時(shí)還具有開發(fā)應(yīng)用程序的功能作用。目前在市場(chǎng)上最新的商用版本為Adobe Flash Professional CS6 ，它可以創(chuàng)建數(shù)字動(dòng)畫，還有交互式Web站點(diǎn)，以及各類桌面應(yīng)用程序（包括電腦和手機(jī)）。Flash之所以會(huì)被廣泛應(yīng)用于網(wǎng)頁設(shè)計(jì)中，主要在于其包含豐富的視頻、聲音、圖形和動(dòng)畫。

2 Flash交互式動(dòng)畫在網(wǎng)頁設(shè)計(jì)領(lǐng)域發(fā)展現(xiàn)狀及優(yōu)勢(shì)

2.1 發(fā)展現(xiàn)狀概括

發(fā)展到今天，F(xiàn)lash動(dòng)畫已經(jīng)與社會(huì)大眾的生活、學(xué)習(xí)、工作等方方面面密不可分，作為一種新的互聯(lián)網(wǎng)活力標(biāo)志，與社會(huì)大眾的生活變得更加緊密，并且在個(gè)別領(lǐng)域不斷被拓展、研究。例如，無論是在電視節(jié)目、影視、廣播中，還是在街頭巷尾的廣告宣傳制作上，或者是多媒體網(wǎng)站設(shè)計(jì)中，F(xiàn)lash動(dòng)畫無處不在。通過應(yīng)用Flash動(dòng)畫這一技術(shù)與電視、廣告、卡通、MTV制作等加以結(jié)合，成為了互聯(lián)網(wǎng)信息時(shí)代下一種新的商業(yè)運(yùn)作與推廣模式。特別是在近些年的發(fā)展，F(xiàn)lash動(dòng)畫技術(shù)體系及其運(yùn)用框架愈發(fā)成熟，在音樂、傳媒、廣告、游戲等多個(gè)領(lǐng)域已經(jīng)被當(dāng)成一種新興產(chǎn)業(yè)來對(duì)待、發(fā)展，開拓出了無限的商業(yè)機(jī)會(huì)。比如在網(wǎng)頁設(shè)計(jì)這一領(lǐng)域，技術(shù)的革新、新產(chǎn)品軟件的研發(fā)更新，從簡單流式動(dòng)畫發(fā)展到復(fù)雜交互性Web動(dòng)畫，在每一個(gè)發(fā)展階段、領(lǐng)域，均體現(xiàn)著Flash動(dòng)畫的獨(dú)有優(yōu)勢(shì)。筆者以為，從目前國內(nèi)網(wǎng)絡(luò)發(fā)展的視角，以及Flash動(dòng)畫軟件技術(shù)前進(jìn)的態(tài)勢(shì)，基本可以預(yù)知在未來一段時(shí)期內(nèi)的主流發(fā)展方向。

2.2 技術(shù)優(yōu)勢(shì)分析

關(guān)于Flash動(dòng)畫應(yīng)用到網(wǎng)頁制作、網(wǎng)站設(shè)計(jì)中的技術(shù)優(yōu)勢(shì)，筆者結(jié)合著自身的一些認(rèn)識(shí)，將其總結(jié)歸納為五個(gè)方面。第一，專業(yè)性。無論是從網(wǎng)頁設(shè)計(jì)者的理念視角，還是從網(wǎng)民的審美瀏覽視角，更加專業(yè)、漂亮的設(shè)計(jì)是大家所追求的、所希望看到的。而Flash動(dòng)畫就具備這樣一種設(shè)計(jì)優(yōu)勢(shì)。通過使用專業(yè)的設(shè)計(jì)工具，使用Flash繪圖工具創(chuàng)建圖形，并將其他媒體元素導(dǎo)入到Flash文檔中來，生成SWF格式，即可通過用戶（電腦/手機(jī)）自帶的網(wǎng)頁瀏覽器來瀏覽、播放。第二，靈活性。靈活性是Flash的又一大特征，因此也被公認(rèn)為是“最為靈活的前臺(tái)”。在一些多媒體網(wǎng)站上，比如騰訊、新浪網(wǎng)站的體育板塊，擁有導(dǎo)航按鈕、地圖、動(dòng)畫按鈕、圖形，期間還毫無違和感摻雜著部分廣告條?？傮w，結(jié)合Action Script 的對(duì)象和流程控制，可以將最為小巧的Flash動(dòng)畫前臺(tái)展示給廣大的網(wǎng)絡(luò)用戶。第三，快速性。關(guān)于這一點(diǎn)，相信很多網(wǎng)民用戶都很清楚，比如在騰訊、百度等聊天論壇，F(xiàn)lash動(dòng)畫實(shí)際上可以邊下載邊播放。即便網(wǎng)民當(dāng)時(shí)的網(wǎng)絡(luò)寬帶信號(hào)非常差，也不需要花費(fèi)過多的時(shí)間來等待。第四，壓縮技術(shù)。關(guān)于這一點(diǎn)，前文中在也提到了一點(diǎn)，使用矢量技術(shù)使得產(chǎn)生的網(wǎng)頁文件比以往變得更小，無論是窗口模式還是全屏播放，絲毫不受影響。尤其是Flash動(dòng)畫在播放的時(shí)候，網(wǎng)頁中所提供的Shockwave Flash插件也非常的小，在170KB以下。第五，交互性 + 通用性。設(shè)計(jì)者通過Flash動(dòng)畫將內(nèi)容呈現(xiàn)給受眾，通過全智能的數(shù)字化導(dǎo)航系統(tǒng)，產(chǎn)生互動(dòng)。此外，F(xiàn)lash動(dòng)畫可以實(shí)現(xiàn)跨平臺(tái)播放。

3 Flash動(dòng)畫在網(wǎng)頁設(shè)計(jì)中的應(yīng)用

3.1 Flash動(dòng)畫在網(wǎng)頁設(shè)計(jì)中的應(yīng)用

Flash動(dòng)畫作品多是以“流式播放動(dòng)畫”形式展示出來，常見的類型有，F(xiàn)lash動(dòng)畫短片、FlashMV等。比如國內(nèi)的一些出行旅游類服務(wù)網(wǎng)站，在制作設(shè)計(jì)上，一般都將網(wǎng)站的引導(dǎo)界面制作成Flash動(dòng)畫的形式。在設(shè)計(jì)中，所采用的大多是Dreamw eaver 軟件。絕大部分均是制作成動(dòng)畫的形式，包括網(wǎng)絡(luò)廣告、企業(yè)與產(chǎn)品形象展示、圖片展示、交互動(dòng)畫等。它們?cè)谡麄€(gè)多媒體網(wǎng)站內(nèi)所扮演的角色以及所起到的作用，表面上看上去無所謂，其實(shí)所非常重要。因?yàn)镕lash動(dòng)畫環(huán)境下對(duì)于整個(gè)網(wǎng)頁起到裝飾的效果，對(duì)于瀏覽者來說，更容易調(diào)動(dòng)他們的情緒。當(dāng)然，動(dòng)畫內(nèi)容不宜太多，尤其是動(dòng)畫廣告，要適度控制。如果太花，一下子出現(xiàn)很多個(gè)動(dòng)畫圖片，會(huì)使得瀏覽者感到煩躁，最終降低對(duì)該網(wǎng)站的好感度。此外，在整個(gè)網(wǎng)站設(shè)計(jì)中，為了充分展示出該網(wǎng)站的個(gè)性，設(shè)計(jì)者也可以使用Flash來制作整個(gè)站點(diǎn)。包括網(wǎng)站形象展示、各級(jí)導(dǎo)航欄、文字、鏈接、色彩、聲音、游戲等等。

3.2 網(wǎng)頁設(shè)計(jì)中對(duì)于Flash視覺元素的引用

關(guān)于網(wǎng)站制作設(shè)計(jì)中對(duì)于Flash動(dòng)畫視覺元素的應(yīng)用，筆者以為，需要重點(diǎn)把握三點(diǎn)：第一，文字。在網(wǎng)頁設(shè)計(jì)中，文字是最主要的一個(gè)元素，因?yàn)镕lash動(dòng)畫創(chuàng)作的出發(fā)點(diǎn)就是為了讓瀏覽者更好的接收本網(wǎng)站推送編輯的信息內(nèi)容，F(xiàn)lash技術(shù)嵌入下，可以增強(qiáng)瀏覽者的興趣?？傊瑲w根到底就是為了讓網(wǎng)民看到內(nèi)容，而文字就是一種直觀體現(xiàn)的方式，承載著最重要的網(wǎng)頁信息。再設(shè)計(jì)中，需要格外注意兩個(gè)方面，第一個(gè)方面，審美效果。在具體設(shè)計(jì)上，主要體現(xiàn)在文字的排版模式、文字的圖形構(gòu)成以及視覺設(shè)計(jì)等。例如，文字字體過小的話，導(dǎo)致網(wǎng)民瀏覽信息時(shí)比較吃力，過大的話，對(duì)導(dǎo)致整個(gè)頁面空間布局不合理。第二個(gè)方面，信息的傳遞。這種文字的最基礎(chǔ)性的功能，也是目的。對(duì)此，設(shè)計(jì)者應(yīng)當(dāng)合理選擇字體的搭配，遵循“大標(biāo)題、小內(nèi)文，字體少、字型小”的這一原則。第二，圖形。圖形在其中主要起到著美化內(nèi)容的效果，所以，關(guān)于圖形設(shè)計(jì)的目的也比較明確，就是構(gòu)建能夠表達(dá)信息內(nèi)容的、視覺形式的、獨(dú)立完整的“語句”。因而，在動(dòng)畫圖形設(shè)計(jì)上，主題要定位明確，盡量以大眾心理需求為主，包括圖形與字體、色彩等多因素之間的協(xié)調(diào)性。第三，色彩。色彩在其中的功能效果主要是用來刺激瀏覽者的視覺感官的。在設(shè)計(jì)中，注意三個(gè)方面：第一個(gè)方面，色彩的形式，也統(tǒng)一協(xié)調(diào)，以此來實(shí)現(xiàn)畫面的美感；第二個(gè)方面，色彩的心理感覺。這是對(duì)于受眾來說的，在于讓受眾看到Flash動(dòng)畫后，能夠在第一時(shí)間刺激大腦，進(jìn)而產(chǎn)生一種情感心理活動(dòng)。第三個(gè)方面，現(xiàn)代化的色彩設(shè)計(jì)。尊崇時(shí)尚，在不影響審美藝術(shù)的前提下，盡可能多地融入與人們生活、工作緊密聯(lián)系的現(xiàn)代化時(shí)尚元素。

4 結(jié)語

隨著互聯(lián)網(wǎng)絡(luò)與人們的生活、工作變得更加緊密相連，F(xiàn)lash動(dòng)畫已經(jīng)被越來越多的人關(guān)注，并被頻繁運(yùn)用到網(wǎng)絡(luò)社交與軟件開發(fā)領(lǐng)域，特別是在多媒體網(wǎng)站的制作上，越來越普遍。比如在網(wǎng)頁設(shè)計(jì)中，設(shè)計(jì)者使用Flash相應(yīng)的軟件及其技術(shù)來創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面，或者融入一些其他元素來達(dá)到一種奇特、吸引人的效果?？偠灾?，F(xiàn)lash屬于網(wǎng)頁網(wǎng)站中的一個(gè)特別重要的視覺元素，正如文中所說的那樣，從目前國內(nèi)網(wǎng)絡(luò)發(fā)展的視角，以及Flash動(dòng)畫軟件技術(shù)前進(jìn)的態(tài)勢(shì)，基本可以預(yù)知在未來一段時(shí)期內(nèi)的主流發(fā)展方向。現(xiàn)階段我國國內(nèi)在該領(lǐng)域的發(fā)展總體趨勢(shì)較好，借助于不斷發(fā)展的電腦技術(shù)背景下，F(xiàn)lash從其自身來看所具備的特點(diǎn)也變得越來越顯著。

參考文獻(xiàn)：

[1] 趙志建. Flash 動(dòng)畫在網(wǎng)站設(shè)計(jì)中應(yīng)用[J]. 信息通信， 2012（3）：125-126.

[2] 董凌， 邱雅婷， 王珍慧. 炫動(dòng)視覺——FLASH動(dòng)畫在網(wǎng)頁設(shè)計(jì)中的應(yīng)用[J]. 科協(xié)論壇， 2013（4）：76-77.

[3] 陳錦雄. Flash動(dòng)畫在網(wǎng)頁設(shè)計(jì)中的應(yīng)用及發(fā)展[J]. 產(chǎn)業(yè)與科技論壇， 2013， 12（5）：103-104.

[4] 周宏偉. 在網(wǎng)頁設(shè)計(jì)中Flash交互動(dòng)能的應(yīng)用研究[J]. 科技創(chuàng)新導(dǎo)報(bào)， 2015（15）：44-44.

[5] 陳雙雙. Flash繪圖與網(wǎng)頁動(dòng)畫制作全程揭秘[M]. 北京：清華大學(xué)出版社， 2014.

[6] 馬鑫. 我的Flash CS5動(dòng)畫與交互設(shè)計(jì)書：我的Flash CS5動(dòng)畫與交互設(shè)計(jì)書[M].電子工業(yè)出版社， 2011.

[7] 謝平. 基于FLASH與ASP交互的研究[J]. 北京教育學(xué)院學(xué)報(bào)：自然科學(xué)版， 2008，3（6）：7-13.