Flash網(wǎng)頁廣告六神花露水的設(shè)計與實現(xiàn).doc

商丘師范學(xué)院2014屆本科畢業(yè)論文（設(shè)計）Flash網(wǎng)頁廣告六神花露水的設(shè)計與實現(xiàn)緒論隨著網(wǎng)絡(luò)的普及，網(wǎng)絡(luò)對人們的生活影響日益變大。人們對社會的關(guān)注已不再局限于現(xiàn)實生活，更多的來自于網(wǎng)絡(luò)。越來越多的人開始關(guān)注網(wǎng)絡(luò)這個宣傳、展示的平臺，網(wǎng)頁廣告也如雨后春筍般迅速發(fā)展起來，主要有彈出式廣告，漂浮廣告，以及大幅面廣告等幾種形式。Flash動畫是Macromedia公司在1999年6月推出的優(yōu)秀網(wǎng)頁動畫制作軟件。它可以將音樂，聲音，畫面創(chuàng)意的結(jié)合在一起。Flash動畫主要使用矢量圖和流式播放技術(shù)。相對位圖來講，矢量圖可以任意改變圖像尺寸而不會影響其清晰度；而流式技術(shù)使網(wǎng)頁中的Flash動畫可以播放下載同時進行，使訪問者能很快的訪問網(wǎng)頁由于很多人出于興趣制作Flash動畫，很多作品也只是供部分人娛樂而已，所以其作品相對于傳統(tǒng)廣告來說沒有嚴(yán)格的制作流程和成熟的經(jīng)驗。也有很多曾經(jīng)從事圖像處理的人開始對Flash動畫產(chǎn)生興趣，經(jīng)隨著慢慢的深入，也有一些優(yōu)秀的作品誕生。后來慢慢的隨著國外的一些優(yōu)秀Flash動畫作品流入中國，喜愛Flash動畫的人越來越多，到現(xiàn)在的Flash已為許多人所熟悉。Flash出現(xiàn)在中國之后，由于其技術(shù)簡單成本低而被廣大人們所認(rèn)識到廣泛應(yīng)用。Flash動畫發(fā)展到現(xiàn)在已有將近二十年，現(xiàn)在Flash動畫應(yīng)用于各種載體，成為網(wǎng)絡(luò)傳播的一種流行方式。由于制作簡單，效果豐富多彩，并且適合應(yīng)用于網(wǎng)絡(luò)傳播，不僅受廣大設(shè)計者的喜愛，更是緊緊抓住了商業(yè)人士的眼球，成為他們廣告推廣的一種重要形式，F(xiàn)lash廣告將大有發(fā)展前景。1 Flash網(wǎng)頁廣告概述1.1 Flash的發(fā)展歷程微軟參與制定新的Flash軟件和混合行業(yè)用的插件，該軟件的開發(fā)，吸引著更多的人。Flash的最早版本是由FutureSplash Animator改名而成。接著Flash不斷地開發(fā)出新版本，引入庫的概念，影片剪輯透明度以及獨立播放器也繼而被研發(fā)出來。1999年的Flash4就有了自己專用的獨立播放器-“Flash Player”，緊接著Flash不斷地更新使功能越來越全面，繼而被廣大人們所關(guān)注。相對而言，F(xiàn)lash MX 2004的產(chǎn)生增加了許多新的功能，緊接著產(chǎn)生的Flash MX 2004 Pro不但包含了前者的所有功能，還有Actionscript2.0的面向?qū)ο缶幊?。Actionscript2.0比后來產(chǎn)生的Actionscript3.0更簡單易學(xué)，但是很多對Flash追求更高的人會選擇使用Actionscript3.0，因為它相對于前者做了很多的改進?？偨Y(jié)來說無論新舊版本都會有自己的優(yōu)勢，比如有些人為了跟上時代的發(fā)展會選擇Flash cs3或者是Flash cs4，當(dāng)然也有人認(rèn)為Flash8.0比較穩(wěn)定，會選擇使用，后面筆者將會介紹到的是用Flash cs4設(shè)計制作網(wǎng)頁廣告的實現(xiàn)方法。1.2 Flash的發(fā)展前景Flash動畫主要采用矢量圖和流媒體播放的方式，決定了其在網(wǎng)頁中廣泛應(yīng)用的優(yōu)勢，小巧的體積和生動的效果使它成為眾多商業(yè)人士廣告推廣方式的選擇。矢量圖的應(yīng)用使其可以任意改變大小而不影響清晰度；流媒體播放則可以邊下載邊播放，緩解了訪問者的焦慮情緒?，F(xiàn)在的網(wǎng)頁設(shè)計師可以說不會Flash就面臨著被淘汰的危險，據(jù)新聞采訪美國Macromedia公司得出現(xiàn)在將近有98%的網(wǎng)站在使用Flash，可見Flash在網(wǎng)頁中的影響深遠(yuǎn)。Flash兼具靈活性和跨平臺的特性，不管是在哪一種平臺，只需安裝了Flash Player就能夠顯示出一樣的結(jié)果。Flash動畫短小內(nèi)容豐富，是一種很好的網(wǎng)絡(luò)傳播形式。主要經(jīng)過了逐幀動畫，位圖動畫，自動生成動畫等幾個發(fā)展階段。下面我們探究一下Flash動畫的發(fā)展方式和發(fā)展方向。Flash于1997年出現(xiàn)在中國，最低的版本，功能并不強大，只能做一些簡單的動畫，例如形狀大小顏色的變化。后來Flash動畫不斷地發(fā)展出現(xiàn)Flash4.0、5.0等，功能也慢慢強大，后來被人們開始應(yīng)用于網(wǎng)頁中，但是只是適合用于一些不需要經(jīng)常更新的網(wǎng)站中。經(jīng)過位圖動畫的發(fā)展，由于并不是很好的效果，大批的設(shè)計師加入到Flash動畫的制作中，形成了手繪原創(chuàng)動畫，風(fēng)格各異，他們無一不是將這個世界表現(xiàn)的更美。由于Flash動畫在商業(yè)中的使用，對Flash 的要求也變得比較高，F(xiàn)lash動畫的相關(guān)插件相繼產(chǎn)生。以前需要很多畫面才能完成的動畫只需要幾分鐘甚至幾個小時就能做出來，大大的減少了Flash動畫的制作時間，加快了Flash商業(yè)化的步伐。當(dāng)今的Flash動畫已經(jīng)慢慢的變得復(fù)雜和充滿藝術(shù)性。比如在網(wǎng)頁中應(yīng)用的Flash動畫不但要求效果對藝術(shù)性的要求也變得嚴(yán)格起來。當(dāng)然這也跟人們的藝術(shù)品位不斷上升有著直接的關(guān)系。而Flash的發(fā)展歸結(jié)起來最重要的原因還是來源于商業(yè)化的要求日益復(fù)雜，可是說Flash動畫的商業(yè)化造就了充滿藝術(shù)性和創(chuàng)意性的Flash動畫。 有人說Flash軟件的使用到了終點，國內(nèi)的Flash作品價格低和一些軟件本身的限制，但我們相信，macromedia公司將不會看著他們手中的軟件就這樣死亡，他們會將Flash應(yīng)用推向一個新的高潮，越來越多的從業(yè)人員會更加努力擴大應(yīng)用它，相信Flash的未來會更加豐富多彩。1.3 Flash廣告的特點為什么Flash廣告能吸引這么多人的關(guān)注，我認(rèn)為主要有以下三個特點： （1）Flash廣告制作成本低，跨媒體性強。Flash廣告不僅可以在互聯(lián)網(wǎng)上使用，也可以用于電視、廣告、移動電話運營商，達到廣告?zhèn)鞑サ男Ч?。但現(xiàn)在的Flash廣告的成本很低，可以表達生動的效果，便于修改。而傳統(tǒng)的廣告則沒有這些優(yōu)點。（2）通過Flash制作的動畫，導(dǎo)出的.swf格式的文件體積小，但是效果非常好，保證了在基本上不影響網(wǎng)頁打開速度的前提上表現(xiàn)了所需求的廣告效果，非常適合應(yīng)用于網(wǎng)站中。同時由于Flash使用的是位圖，無論怎樣縮放都不影響畫面的清晰度，這點上相對于位圖要好很多。（3）Flash廣告比傳統(tǒng)廣告更搶眼，在視覺上給人沖擊。而且很多Flash制作的廣告賦予物品性格，在表現(xiàn)物品特點的同時，還給人們展示了一個可愛，生動的畫面。有了這些特點，筆者相信Flash廣告更能緊緊抓住大眾的心。Flash動畫制作很方便，只需要一個個人計算機就可以可融合圖像，聲音，文本為一個整體。傳統(tǒng)的廣告在表達上則會比較麻煩，需要大量的人力物力和時間，相對來說制作成本很高。一些物體的動作和變化可以用補間動畫完成，不但方便而且不易使人物或場景變形而影響效果。很重要的一點，F(xiàn)lash擁有ActionScript 面向?qū)ο笳Z言編程，使它具有交互性的特點，實現(xiàn)人機互動的效果，只需用鼠標(biāo)或鍵盤就可以控制動畫。Flash融合了畫面文字音效于一體，對大眾的沖擊感更強。而且由于其體積較小，又有交互式的特點，再打開網(wǎng)頁的時候可以邊下載邊觀看，省去了瀏覽者等待的煩惱。Flash動畫應(yīng)用的矢量圖使動畫清晰，畫面感好，不會出現(xiàn)模糊不清，或是出現(xiàn)像素點的狀況。便捷的制作，生動的效果使Flash動畫在網(wǎng)頁中得以廣泛使用。近年來Flash廣告發(fā)展起來，給新型的廣告行業(yè)注入了新鮮血液。Flash廣告構(gòu)圖簡單，場景固定并且能夠在網(wǎng)頁中默默的傳送給瀏覽網(wǎng)頁的人，讓人們在瀏覽網(wǎng)頁這個放松的時候悄悄的抓住人們的眼球進入人們的內(nèi)心。正所謂潤物細(xì)無聲，我想大概網(wǎng)頁Flash廣告就做到了這點吧。1.4 Flash網(wǎng)頁廣告的優(yōu)勢第一，F(xiàn)lash做出的動畫，體積小表現(xiàn)效果生動形象，適合應(yīng)用于網(wǎng)絡(luò)。第二，F(xiàn)lash代碼功能比較大，交互性也強。第三，F(xiàn)lash廣告適用范圍很廣，不知能應(yīng)用于網(wǎng)頁上，還可以應(yīng)用于電視樓宇手機等載體上。第四，F(xiàn)lash動畫結(jié)合其ActionScript程序，一反往常靜態(tài)網(wǎng)頁的局面，使人們眼前一亮。1.5 Flash網(wǎng)頁廣告的不足Flash廣告雖然有很多優(yōu)點，但是現(xiàn)在不能被廣泛應(yīng)用的原因有很多，筆者認(rèn)為主要原因在于以下方面 第一，是人才的缺少。與傳統(tǒng)廣告的制作人員相比，從事Flash廣告制作的人比較少。并且沒有嚴(yán)格的Flash廣告制作流程，沒有形成真正意義上的Flash廣告設(shè)計群體。第二，F(xiàn)lash技術(shù)在網(wǎng)頁設(shè)計中的使用非常多，許多網(wǎng)站都用用Flash動畫來設(shè)計。這樣的網(wǎng)站雖然非常漂亮生動，但是也會因為使用了Flash而導(dǎo)致網(wǎng)頁存在不利于搜索引擎的現(xiàn)象。第三，F(xiàn)lash廣告創(chuàng)意和表達比較簡單、直接，畫面感不追求精美，在細(xì)節(jié)方面的表現(xiàn)也不如傳統(tǒng)廣告做的好。第四，F(xiàn)lash廣告的兼容性不好，當(dāng)Flash廣告不能正常播放時，會影響人們正常的訪問網(wǎng)頁。而且加入Flash廣告的網(wǎng)頁不便于更新與維護，給維護網(wǎng)站的工作人員造成了很多麻煩。第五，網(wǎng)站中加入Flash廣告會影響網(wǎng)頁打開的速度，雖然一個Flash廣告體積不是很大，但是對于一些急于打開網(wǎng)頁的訪問者來說會沒有耐心，有時甚至?xí)艞墝W(wǎng)頁的瀏覽。2 Flash網(wǎng)頁廣告的的設(shè)計過程2.1 Flash網(wǎng)頁廣告的構(gòu)思本次Flash廣告的構(gòu)思主要包括主題的確定、創(chuàng)意的構(gòu)思和制作的構(gòu)思。本次的廣告主題是關(guān)于六神花露水的一個段廣告，好的創(chuàng)意是一個廣告的靈魂，比如一則表達交通的公益廣告，是一個人站在十字路口等待紅燈，但是這個時候一群人結(jié)伴闖紅燈，正當(dāng)他猶豫要不要過時，大家都合群過去了，他也邁出猶豫的步伐，但是車流量很大，他慌亂不知道怎么辦，造成了路口交通事故。這是一個反映現(xiàn)實的廣告，深入人心。而這次的花露水廣告主要采用可愛生動的風(fēng)格表現(xiàn)，在一個月亮都睡著了的晚上，一個武裝的蚊子是這次廣告的亮點，一反往常丑陋蚊子的形象，賦予了這個蚊子人性化，邪惡的笑聲烘托蚊子的可惡，采用了幽默的出場方式，吸引人們眼球，當(dāng)他入侵之后得意笑的時候，六神先生的到來讓蚊子措不及防，在消滅了蚊子之后，一滴花露水滴下整個畫面開始變得清晰，文字的變形是這則廣告結(jié)束和點題的亮點。2.2 場景的設(shè)計場景的整個設(shè)計有著很重要的作用，它是動畫中重要的一部分，一個好的場景設(shè)計不僅要有美學(xué)的高度還要具有欣賞的藝術(shù)。它是故事情節(jié)展開的載體，刻畫和突出廣告主體。一個好的場景設(shè)計，會給人們帶來視覺享受。他能夠使畫面更加豐富，直接影響著整個廣告的畫面感。場景的設(shè)計給人的視覺沖擊影響著人們的喜怒哀樂，讓觀眾更深刻的感受劇情的起伏變化。本次廣告的場景可以說是一個，另一個是在同樣場景的基礎(chǔ)上進行色彩改變。圖2-1 主場景2.3 素材準(zhǔn)備一個好的動畫怎么可以少了好的素材呢，本次設(shè)計的素材均來源于網(wǎng)絡(luò)?？梢园褟木W(wǎng)上收集的素材拉入庫中，以備使用，特別是音效的素材往往能夠起到畫龍點睛的作用。比如蚊子的笑聲就生動的刻畫了一個邪惡的蚊子，使廣告更加生動吸引人。 圖2-2 庫中的素材2.4 圖形元件的設(shè)計 元件的使用往往伴隨著補間動畫的產(chǎn)生，元件的生成一定不要重復(fù)，否則會增加文件的體積，使廣告放在網(wǎng)頁中時候打開緩慢。3 Flash網(wǎng)頁廣告制作過程此則廣告主要分為八個畫面：畫面一：廣告的主場景為一個夜晚，月亮掛在黑夜里，一片云遮住半個月亮，場景逼真。將準(zhǔn)備好的素材拖入庫中，轉(zhuǎn)化為原件放入舞臺，大小設(shè)置的和舞臺大小一樣。 圖3-1 畫面一畫面二：畫面二為反面主角蚊子的出場，他的亮相可謂是吸引人的眼球，緊握的拳頭和大墨鏡塑造了一個酷酷的蚊子，揮動著翅膀進入畫面。 圖3-2畫面二畫面三：蚊子在畫面的中央得意的笑，因為得意身子都在顫抖，壞壞的笑聲，把蚊子形象刻畫的十分生動。把蚊子的形象分為三部分，左右翅膀，和身體，以便于制作飛舞的效果。雙擊進入效果制作界面，用關(guān)鍵幀改變蚊子的翅膀，做飛舞狀態(tài)，停止的時候，身體做輕微的晃動表現(xiàn)蚊子得意的狀態(tài)。蚊子飛進畫面亦需要補間動畫的效果，此時就需要把整個蚊子變成元件，移動位置，右擊設(shè)置補間動畫來實現(xiàn)飛進畫面的效果。圖3-3 畫面三 圖3-4 蚊子翅膀動作的制作 圖3-5 蚊子身體部分關(guān)鍵幀畫面四：此則廣告的主角上場，帶著禮帽，揮舞這雙手，表現(xiàn)了一個活潑時尚的六神先生，鼻子和嘴用六神的開頭字母來表現(xiàn)，不但寓意深刻，更是起到了表現(xiàn)人物性格的效果。如同蚊子的出場一樣，應(yīng)用補間動畫。不同的是，后面需要繼續(xù)添加幀，因為他們的較量還沒開始。圖3-6 畫面四畫面五：畫面五為廣告的精彩部分，六神先生怎么會容許蚊子猖狂，為六神設(shè)計的眼波殺死蚊子們表達了“秒殺“的意思，生動形象。 圖3-7 畫面五畫面六：高潮的結(jié)束往往伴隨著平靜的點題畫面，這則廣告亦是如此。一滴六神轉(zhuǎn)化為元件后，創(chuàng)建補間動畫，確定路徑。安靜出現(xiàn)的畫面與前面的激烈場景形成對比，此時無聲勝有聲這是這種效果吧。圖3-8畫面六 圖3-9 環(huán)路水滴關(guān)鍵幀畫面七：運用了形狀補間的效果使六神水滴變化為六神花露水的字樣，“形”和“字”都表現(xiàn)了出來。這里要注意的是，六神水滴不能轉(zhuǎn)化為元件，因為形狀補間的對象是分離后的圖像。而伴隨著六神的滴落，畫面變得清晰，突出六神的效果。而畫面的變化主要采用了兩幅場景圖，對其中一幅做色彩的變化，采用遮罩的效果使清晰的那一副慢慢出現(xiàn)在人們的視野中。 圖3-10畫面七 圖3-11遮罩圖層的轉(zhuǎn)變畫面八：整幅場景變得清晰，襯托了六神花露水的神奇和魅力。 圖3-12 畫面八 圖3-13 場景透明度的改變結(jié)束語用Flash動畫表現(xiàn)的廣告給人留下深刻的印象，它將視覺和聽覺融合在一起，直擊人們內(nèi)心。而且由于Flash動畫制作簡單，成本低，效果好，越來越多的商業(yè)人士開始選擇Flash制作廣告。雖說現(xiàn)在Flash廣告還沒有傳統(tǒng)廣告那樣有正規(guī)的流程和成熟的經(jīng)驗，但是由于它自身內(nèi)存小播放快的優(yōu)點，在未來的廣告界一定會有自己的一片天地。自從Flash軟件出現(xiàn)在中國后，由于技術(shù)簡單成本低而被大家廣泛使用。隨著Flash的發(fā)展日益成為網(wǎng)絡(luò)傳播的一種重要方式，獲得設(shè)計師喜愛的