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

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