FLASH動(dòng)畫設(shè)計(jì)說明書

廣州大學(xué)市政技術(shù)學(xué)院廣州大學(xué)市政技術(shù)學(xué)院 20122012屆畢業(yè)設(shè)計(jì)屆畢業(yè)設(shè)計(jì) 論文論文 設(shè)計(jì)題目設(shè)計(jì)題目 動(dòng)畫短片動(dòng)畫短片 新世紀(jì)龜兔賽跑新世紀(jì)龜兔賽跑 學(xué)學(xué) 院院 廣州大學(xué)市政技術(shù)學(xué)院廣州大學(xué)市政技術(shù)學(xué)院 系系 別別 信息人文系信息人文系 班級(jí)專業(yè)班級(jí)專業(yè) 學(xué)學(xué) 號(hào)號(hào) 學(xué)生姓名學(xué)生姓名 指導(dǎo)教師指導(dǎo)教師 FLASH 動(dòng)畫設(shè)計(jì)說明書 畢業(yè)論文 設(shè)計(jì) 誠信保證書畢業(yè)論文 設(shè)計(jì) 誠信保證書 我已經(jīng)照論文指導(dǎo)老師的要求 熟悉和理解了我校關(guān)于我已經(jīng)照論文指導(dǎo)老師的要求 熟悉和理解了我校關(guān)于 二級(jí)二級(jí) 學(xué)院全日制學(xué)生畢業(yè)論文 設(shè)計(jì) 規(guī)范化規(guī)定學(xué)院全日制學(xué)生畢業(yè)論文 設(shè)計(jì) 規(guī)范化規(guī)定 文件的精神和有關(guān)文件的精神和有關(guān) 要求 愿意在畢業(yè)論文 設(shè)計(jì) 中誠實(shí)守信 絕不抄襲 剽竊他人要求 愿意在畢業(yè)論文 設(shè)計(jì) 中誠實(shí)守信 絕不抄襲 剽竊他人 論文 設(shè)計(jì)及其他智力成果論文 設(shè)計(jì)及其他智力成果 引用材料注明出處引用材料注明出處 參考書目附在論文參考書目附在論文 設(shè)計(jì)設(shè)計(jì) 篇尾 如有違反愿意接受相應(yīng)處理 篇尾 如有違反愿意接受相應(yīng)處理 保證人 保證人 二二 一一 年三月年三月 FLASH 動(dòng)畫設(shè)計(jì)說明書 目 錄 前言 3 第 1 章 概論 4 1 1 FLASH 簡介 4 1 2 FLASH 發(fā)展趨勢 5 第 2 章 劇本設(shè)定 7 2 1 故事大綱 7 2 2 故事主要內(nèi)容 7 第 3 章 設(shè)計(jì)構(gòu)思 8 3 1 人物設(shè)定 8 3 2 場景設(shè)定 8 第 4 章 設(shè)計(jì)技術(shù) 9 4 1 圖形繪制 9 4 2 填充圖像 10 4 3 圖片原件 11 4 4 影片剪輯原件 12 4 5 按鈕原件 13 4 6 引導(dǎo)層動(dòng)畫 14 4 7 遮罩層動(dòng)畫 15 4 8 聲音處理 16 第 5 章 制作過程 16 5 1 收集素材 16 5 1 1 聲音材料 17 5 1 2 人物素材 17 5 1 3 背景素材 18 5 2 編輯素材 18 5 2 1 編輯聲效 19 5 2 2 繪制人物 19 5 2 3 繪制場景 20 5 3 動(dòng)畫制作 21 5 4 后期配音 25 第 6 章 經(jīng)驗(yàn)收獲 25 第 7 章 參考文獻(xiàn) 26 第 8 章 致謝 27 FLASH 動(dòng)畫設(shè)計(jì)說明書 1 摘 要 Flash 動(dòng)畫設(shè)計(jì)的三大基本功能是整個(gè) Flash 動(dòng)畫設(shè)計(jì)知識(shí)體系中最 重要 也是最基礎(chǔ)的 包括 繪圖和編輯圖形 補(bǔ)間動(dòng)畫和遮罩 這是三個(gè)緊密相 連的邏輯功能 并且這三個(gè)功能自 Flash 誕生以來就存在 繪圖和編輯圖形不但是創(chuàng)作 Flash 動(dòng)畫的基本功 也是進(jìn)行多媒體創(chuàng)作的基本 功 只有基本功扎實(shí) 才能在以后的學(xué)習(xí)和創(chuàng)作道路上一帆風(fēng)順 使用 Adobe Flash CS3 繪圖和編輯圖形 這是 Flash 動(dòng)畫創(chuàng)作的三大基本功的第一位 在繪 圖的過程中要學(xué)習(xí)怎樣使用元件來組織圖形元素 這也是 Flash 動(dòng)畫的一個(gè)巨大特 點(diǎn) 補(bǔ)間動(dòng)畫是整個(gè) Flash 動(dòng)畫設(shè)計(jì)的核心 也是 Flash 動(dòng)畫的最大優(yōu)點(diǎn) 它有動(dòng) 畫補(bǔ)間和形狀補(bǔ)間兩種形式 學(xué)習(xí) Flash 動(dòng)畫設(shè)計(jì) 最主要的就是學(xué)習(xí) 補(bǔ)間動(dòng)畫 設(shè)計(jì) 在應(yīng)用影片剪輯元件和圖形元件創(chuàng)作動(dòng)畫時(shí) 有一些細(xì)微的差別 應(yīng)該完整 把握這些細(xì)微的差別 還有補(bǔ)間動(dòng)畫的幀 啟動(dòng)畫的主要作用 只有使用幀才能使 動(dòng)畫更完美 遮罩是 Flash 動(dòng)畫創(chuàng)作中所不可缺少的 這是 Flash 動(dòng)畫設(shè)計(jì)三大基本功能 中重要的出彩點(diǎn) 使用遮罩配合補(bǔ)間動(dòng)畫 更可以創(chuàng)建更多豐富多彩的動(dòng)畫效果 遮罩的原理非常簡單 但其實(shí)現(xiàn)的方式多種多樣 特別是和補(bǔ)間動(dòng)畫以及影片剪輯 元件結(jié)合起來 可以創(chuàng)建千變?nèi)f化的形式 Flash 動(dòng)畫說到底就是 遮罩 補(bǔ)間動(dòng)畫 逐幀動(dòng)畫 與元件的混合物 通過這 些元素的不同組合 從而可以創(chuàng)建千變?nèi)f化的效果 關(guān)鍵詞 關(guān)鍵詞 F Flash 動(dòng)畫設(shè)計(jì) 補(bǔ)間動(dòng)畫 幀 遮罩 FLASH 動(dòng)畫設(shè)計(jì)說明書 2 Abstract Three basic functions of the Flash animation of knowledge of the most important and most basic including drawing and editing graphics tween animation and mask animation They are three closely linked logic functions and these three functions has existed since Flash bore Drawing and editing graphics isn t only basic skills of creating Flash animation but also the basic skills of multimedia creation Only a person who has a great firm making foundation can learn on a smooth road in the future Using Adobe Flash CS3 to draw and edit graphics which is the most important of three basic skills In the drawing process we need to learn how to use components to organize the graphic elements and this is a great feature of Flash animation Tween is the core of the Flash animation and is the greatest advantage Tween include sharp tween and animation tween two forms Learning to create Flash animation the most essensial thing is to learn tween design During using Movie clip elements and graphics elements to create animation there are some Subtle differences The frame play the main role of the animation tween running Only if you use Frame perfectly can you make your animation better Mask animation is indispensable this is one of the three important points of Flash animation and can make your animation out of color Using mask animation in coordination with the tween animation we can more varied and colorful animation The mask animation is easy to use but the achieved ways are variety In particular tween animation and movie clip components combine you may found the ever changing form Flash animation in the final analysis is the mask motion tween animation frame by frame and the components of the mixture different combinations of these elements which can create ever changing results Flash animation in the final analysis is the mask animation tween animation frame by frame animation with a mixture of components by different combinations of these elements which can create a kaleidoscopic effect Key word flash flash animation tween animation mask animation Frame FLASH 動(dòng)畫設(shè)計(jì)說明書 3 前言前言 一直以來 世界上各種交通事故頻發(fā) 在我國交通事故所占的死亡人數(shù)已經(jīng)占 到了我國事故死亡認(rèn)輸?shù)?80 以上 造成的經(jīng)濟(jì)損失也不可估量 首先是群眾交通安全和交通法制意識(shí)淡薄 由于交通安全知識(shí)宣傳教育面相對(duì) 較窄 群眾的交通安全知識(shí)普及程度較低 相當(dāng)一部分交通參與者缺乏必要的交通 安全常識(shí) 不遵守交通法規(guī) 隨意行車走路現(xiàn)象十分普遍 特別是近年來電動(dòng)車業(yè) 發(fā)展迅速 由電動(dòng)車引發(fā)的交通事故逐年增多 由于宣傳少 群眾缺乏對(duì)交通管理 工作的認(rèn)識(shí) 不能正確理解和自覺遵守交通法規(guī) 甚至認(rèn)為交通管理部門執(zhí)法是故 意刁難 從而不支持 不配合交通管理工作 另外 受傳統(tǒng)觀念影響 一些交通參 與者沒有認(rèn)識(shí)到交通違法行為的嚴(yán)重后果 不認(rèn)為交通違法行為是違法行為 隨意 違法行車 走路 甚至逃避 抗拒執(zhí)法現(xiàn)象時(shí)有發(fā)生 其中大部分造成事故的原因 都是由于駕駛?cè)藛T交通安全意識(shí)薄弱對(duì)交通法規(guī) 的輕視 駕駛?cè)俗鳛榈缆方煌ò踩芾淼幕A(chǔ)和源頭 其素質(zhì)的高低直接決定了道 路交通事故的多少 但是近年來隨著駕駛?cè)岁?duì)伍的日益壯大 整個(gè)隊(duì)伍良莠不齊 魚龍混雜 駕駛?cè)宋幕刭|(zhì)低下 思想素質(zhì)不過硬 安全觀念不強(qiáng)等問題日益突出 同時(shí) 由于駕駛?cè)私逃嘤?xùn)比較落后的局面還沒有根本好轉(zhuǎn) 在培訓(xùn) 考核中 培 訓(xùn)課程 方式方法 考試內(nèi)容 程序 嚴(yán)格程度等都在不斷完善和提高的過程中 而交通安全法制意識(shí)教育的重要性日益顯著 兒童青少年他們是國家的未來 中華民族的希望 他們能否健康成長 能否具備包括交通素質(zhì)在內(nèi)的越來越高的綜 合素質(zhì) 關(guān)系到國家和民族的前途和命運(yùn) 對(duì)這樣的社會(huì)接觸不深 安全意識(shí)薄弱 自我保護(hù)救助能力差的群體這樣的教育宣傳顯得尤為重要 我是前段時(shí)間各種校車嚴(yán)重超載超速等原因而照成的嚴(yán)重交通事故頻發(fā)中得到 啟發(fā)想法弄了這個(gè)動(dòng)畫短片 希望能對(duì)提高大家尤其是少年兒童交通法規(guī)安全意識(shí) 有所幫助 FLASH 動(dòng)畫設(shè)計(jì)說明書 4 第第 1 章章 概論概論 1 1 FLASH 簡介 Flash 是由 macromedia 公司推出的交互式矢量圖和 Web 動(dòng)畫的標(biāo)準(zhǔn) 由 Adobe 公司收購 網(wǎng)頁設(shè)計(jì)者使用 Flash 創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面以 及其他奇特的效果 Flash 也是存儲(chǔ)芯片的一種 通過特定的程序可以修改里面的 數(shù)據(jù) Flash 的前身是 Future Wave 公司的 Future Splash 是世界上第一個(gè)商用的二 維矢量動(dòng)畫軟件 用于設(shè)計(jì)和編輯 Flash 文檔 1996 年 11 月 美國 Macromedia 公 司收購了 Future Wave 并將其改名為 Flash 在出到 Flash 8 以后 Macromedia 又 被 Adobe 公司收購 Flash 通常也指 Macromedia Flash Player 現(xiàn) Adobe Flash Player Flash 是一種創(chuàng)作工具 目前最新的版本為 Adobe Flash CS5 5 Professional 2011 年發(fā)布 Adobe Flash Professional CS5 為創(chuàng)建數(shù)字動(dòng)畫和交互式 Web 站點(diǎn)提供了功能全面的創(chuàng)作和編輯環(huán)境 Flash 廣泛用于創(chuàng)建吸引人的應(yīng)用程 序 它們包含豐富 的視頻 聲音 圖形和動(dòng)畫 可以在 Flash 中創(chuàng)建原始內(nèi)容或者 從其它 Adobe 應(yīng)用程序 如 Photoshop 或 Illustrator 導(dǎo)入它們 快速設(shè)計(jì)簡單的動(dòng) 畫 以及使用 Adobe AcitonScript 3 0 開發(fā)高級(jí)的交互式項(xiàng)目 設(shè)計(jì)人員和開發(fā)人員 可使用它來創(chuàng)建演示文稿 應(yīng)用程序和其它允許用戶交互的內(nèi)容 Flash 可以包含 簡單的動(dòng)畫 視頻內(nèi)容 復(fù)雜演示文稿和應(yīng)用程序以及介于它們之間的任何內(nèi)容 通常 使用 Flash 創(chuàng)作的各個(gè)內(nèi)容單元稱為應(yīng)用程序 即使它們可能只是很簡單的 動(dòng)畫 您也可以通過添加圖片 聲音 視頻和特殊效果 構(gòu)建包含豐富媒體的 Flash 應(yīng)用程序 但是 Adobe Flash Professional 僅僅是 Flash CS5 工具套件當(dāng)中的一個(gè)產(chǎn)品 除了 Flash Professional 之外 Adobe 還提供了 Flash Catalyst 和 Flash Builder Flash Catalyst 是一個(gè)設(shè)計(jì)工具 它無需編寫代碼即可快速創(chuàng)建富有表現(xiàn)力的界面和交互 FLASH 動(dòng)畫設(shè)計(jì)說明書 5 式內(nèi)容 Flash Builder 以前稱為 Flex Builder 是適合于開發(fā)人員 而不是動(dòng)畫師 或設(shè)計(jì)師 創(chuàng)建交互式內(nèi)容的以代碼為中心的環(huán)境 盡管開發(fā)平臺(tái)不同 這 3 種工 具最終都將生成相同的結(jié)果 Flash 內(nèi)容 SWF 文件 Flash SWF 文件在瀏覽器 上的 Flash 播放器中 瀏覽器外面的桌面上的 AIR Adobe Integrated Runtimem Adobe 集成運(yùn)行環(huán)境 中或者在移動(dòng)電話上運(yùn)行 Flash 特別適用于創(chuàng)建通過 Internet 提供的內(nèi)容 因?yàn)樗奈募浅Ｐ?Flash 是通過廣泛使用矢量圖形做到這一點(diǎn)的 與位圖圖形相比 矢量圖形需要的 內(nèi)存和存儲(chǔ)空間小很多 因?yàn)樗鼈兪且詳?shù)學(xué)公式而不是大型數(shù)據(jù)集來表示的 位圖 圖形之所以更大 是因?yàn)閳D像中的每個(gè)像素都需要一組單獨(dú)的數(shù)據(jù)來表示 要在 Flash 中構(gòu)建應(yīng)用程序 可以使用 Flash 繪圖工具創(chuàng)建圖形 并將其它 媒體元素導(dǎo)入 Flash 文檔 接下來 定義如何以及何時(shí)使用各個(gè)元素來創(chuàng)建設(shè)想中 的應(yīng)用程序 Flash 是一個(gè)非常優(yōu)秀的矢量動(dòng)畫制作軟件 它以流式控制技術(shù)和矢量技 術(shù)為核心 制作的動(dòng)畫具有短小精悍的特點(diǎn) 所以被廣泛應(yīng)用于網(wǎng)頁動(dòng)畫的設(shè)計(jì)中 以成為當(dāng)前網(wǎng)頁動(dòng)畫設(shè)計(jì)最為流行的軟件之一 1 2 FLASH 發(fā)展趨勢 Flash 被稱為是 最為靈活的前臺(tái) 由于其獨(dú)特的時(shí)間片段分割 TimeLine 和重組 MC 嵌套 技術(shù) 結(jié)合 ActionScipt 的對(duì)象和流程控制 使得在靈活的界面 設(shè)計(jì)和動(dòng)畫設(shè)計(jì)成為可能 同時(shí)它也是最為小巧的前臺(tái) Flash 具有跨平臺(tái)的特性 這點(diǎn)和 Java 一樣 所以無論你處于何種平臺(tái) 只要你安裝了支持的 Flash Player 就可以保證它們的最終顯示效果的一致 而不必像在以前的網(wǎng)頁設(shè)計(jì)中那 樣為 IE 或 Net Space 各設(shè)計(jì)一個(gè)版本 同 Java 一樣 它有很強(qiáng)的可移植性 最新 的 Flash 還具有的手機(jī)支持功能 可以讓用戶為自己的手機(jī)設(shè)計(jì)喜愛的功能 當(dāng)然 首先必需要有支持 Flash 的手機(jī) 同時(shí)它還可以應(yīng)用于 Pocket PC 應(yīng)用程序開發(fā) 由于其獨(dú)特的跨平臺(tái)特性 靈活的界面控制以及多媒體特性的 使用 使得用 Flash 制作的應(yīng)用程序具有很強(qiáng)的生命力 在與用戶的交流方面具有 FLASH 動(dòng)畫設(shè)計(jì)說明書 6 其它任何方式都無可比擬的優(yōu)勢 當(dāng)然 某些功能可能還要依賴于 XML 或者其它諸 如 javascript 的客戶端技術(shù)來實(shí)現(xiàn) 但目前的現(xiàn)狀是 很少有人具有運(yùn)用 Flash 進(jìn)行應(yīng)用程序開發(fā)這方面的經(jīng)驗(yàn) 但這個(gè)難度會(huì)隨著時(shí)間的推移而逐步減弱 事實(shí) 上 對(duì)于大型項(xiàng)目而言 使用 Flash 此時(shí)未免有些言之過早 因?yàn)樗馕吨艽蟮?風(fēng)險(xiǎn) 當(dāng)然 在最早的時(shí)間掌握和積累這方面的經(jīng)驗(yàn)無疑是一種很大的競爭力 可 以將這種技術(shù)運(yùn)用在項(xiàng)目中的一小部分或者小型項(xiàng)目中 以減少開發(fā)的風(fēng)險(xiǎn) 軟件系統(tǒng)界面開發(fā) Flash 對(duì)于界面元素的可控性和它所表達(dá)的效果無疑具有 很大的誘惑 對(duì)于一個(gè)軟件系統(tǒng)的界面 Flash 所具有的特性完全可以為用戶提供 一個(gè)良好的接口 手機(jī)領(lǐng)域的開發(fā) 手機(jī)領(lǐng)域的開發(fā)將會(huì)對(duì)精確 像素級(jí) 的界面設(shè)計(jì)和 CPU 使 用分布的操控能力有更高的要求 但同時(shí)也意味著更加更廣泛的使用空間 事實(shí)上 手機(jī)和 Pocket PC 的分界已越來越不明顯 開發(fā)者必須為每一款手機(jī) 或 Pocket PC 設(shè)計(jì)一個(gè)不同的界面 因?yàn)樗鼈兊钠聊淮笮「饔胁煌?當(dāng)然軟件的內(nèi)核可能是 相同的 所要注意的是各類手機(jī) CPU 的計(jì)算能力和內(nèi)存的大小 這無疑是些很苛刻 的要求 游戲開發(fā) 事實(shí)上 Flash 中的游戲開發(fā)已經(jīng)進(jìn)行了多年的嘗試 但至今為止 仍然停留在中 小型游戲的開發(fā)上 游戲開發(fā)的很大一部份都受限于它的 CPU 能力 和大量代碼的管理 不過可喜的是 Flash Player 7 運(yùn)行時(shí)性能提高了 2 至 5 倍 而且最新的 Flash MX 2004 Professional 提供了項(xiàng)目管理和代碼維護(hù)方面的功能 Actionscript 2 0 的發(fā)布也使得程序更加容易維護(hù)和開發(fā) Web 應(yīng)用服務(wù) 其實(shí)很難界定 Web 應(yīng)用服務(wù)的范圍究竟有多大 它似乎它擁有 無限的可能 隨著網(wǎng)絡(luò)的逐漸滲透 基于客戶端 服務(wù)器的應(yīng)用設(shè)計(jì)也開始逐漸受 到歡迎 并且一度被譽(yù)為最具前景的方式 但是 這種方式開發(fā)者可能要花更多的 時(shí)間在服務(wù)器后臺(tái)處理能力和架構(gòu)上 并且將它們與前臺(tái) Flash 端 保持同步 站點(diǎn)建設(shè) 事實(shí)上 現(xiàn)在只有極少數(shù)人掌握了使用 Flash 建立全 Flash 站點(diǎn)的 技術(shù) 因?yàn)樗馕吨叩慕缑婢S護(hù)能力和開發(fā)者整站架構(gòu)能力 但它帶來的好處 也異常明顯 全面的控制 無縫的導(dǎo)向跳轉(zhuǎn) 更豐富的媒體內(nèi)容 更體貼用戶的流 暢交互 跨平臺(tái)和瘦客戶端的支持 以及與其它 Flash 應(yīng)用方案無縫連接集成等 多媒體娛樂 其實(shí) 在這個(gè)方面無需再說什么 盡管它的發(fā)展速度沒有像當(dāng)初 預(yù)言的那樣迅速 但它仍然還在不斷前進(jìn) Flash 本身就以多媒體和可交互性而廣 FLASH 動(dòng)畫設(shè)計(jì)說明書 7 為推崇 它所帶來親切氛圍相信每一位用戶都會(huì)喜歡 flash 影片的后綴名為 swf 該類型文件必須有 flash 播放器才能打開 但占用硬盤空間少 所以現(xiàn)在被廣泛應(yīng)用于游戲 第第 2 2 章章 劇本設(shè)定劇本設(shè)定 2 1 故事大綱 故事書里龜兔賽跑兔子因?yàn)轵湴炼斄吮荣?不服氣 于是再次找到烏龜 想 以賽車的形式比賽 最后因?yàn)槌偻泿я{駛證被發(fā)現(xiàn)他的交警小狗逮捕 烏龜贏 得比賽 2 2 故事主要內(nèi)容 大家都知道龜兔賽跑的故事 兔子和烏龜約定以賽跑分勝負(fù) 比賽最后兔子因 為驕傲自大 在快到達(dá)終點(diǎn)的時(shí)候躺在一邊睡覺 最后讓烏龜贏得了比賽 動(dòng)畫以 這個(gè)為開頭 講述后來兔子因?yàn)椴环舛俅蜗驗(yàn)觚斕魬?zhàn) 但這次比賽的形式不是 賽跑而改為賽車 于是兔子約定烏龜星期一比賽找了大象做裁判 到了星期一 一 切準(zhǔn)備就緒 裁判大象倒數(shù)三聲比賽開始 開始兔子領(lǐng)先 慢慢加速拋離了烏龜 而兔子一路加速到了 150km h 而作為賽道的公路上有限速要求 不能超過 FLASH 動(dòng)畫設(shè)計(jì)說明書 8 100km h 一路遙遙領(lǐng)先的兔子在途中被交警小狗發(fā)現(xiàn)了 交警 小狗加速截停了超 速的兔子 交警小狗示意讓兔子出示駕駛證件 兔子忘記帶 因此逮捕了兔子 最 后烏龜依然贏得比賽 最后謝幕 動(dòng)畫結(jié)束 宣傳交通法制安全意識(shí) 第第 3 章章 設(shè)計(jì)構(gòu)思設(shè)計(jì)構(gòu)思 3 1 人物設(shè)定 兔子 性格驕傲自大 丟三落四 存在僥幸心理 愛耍小聰明 輸了比賽 不服氣又找烏龜比賽 烏龜 樣子踏實(shí)穩(wěn)重開朗 做事有條不紊 有恒心堅(jiān)持不懈 接受兔子挑 戰(zhàn)踏實(shí)開車 贏得比賽 大象 樣子可愛 敦厚老實(shí) 公平公正 擔(dān)任比賽裁判 小狗 樣子威風(fēng)嚴(yán)肅魁梧 依法辦事 擁有正義感 發(fā)現(xiàn)兔子超速 并查 出他沒帶駕照依法逮捕 3 2 場景設(shè)定 場景一 電影院播放影片 場景二 翻開書本 講述之前龜兔賽跑劇情 場景三 在之前龜兔賽跑中 兔子在一邊睡著了 而烏龜堅(jiān)持完成比賽贏了兔 子 FLASH 動(dòng)畫設(shè)計(jì)說明書 9 場景四 翻頁 講述之后的故事 場景五 賽道概況 場景六 提示時(shí)間過去 場景七 一切準(zhǔn)備就緒 倒數(shù)三聲裁判大象甩旗宣布比賽開始 兔子一路領(lǐng)先 漸漸與烏龜拉開距離 場景八 把鏡頭拉向兔子車?yán)?場景九 兔子車?yán)锏臅r(shí)速表 顯示速度未 150km h 場景十 兔子遇到警車 被警察發(fā)現(xiàn)超速 場景十一 警察追截兔子 場景十二 烏龜追過了兔子 場景十三 警察對(duì)兔子問話 發(fā)現(xiàn)兔子沒有帶駕駛證 并逮捕走了兔子 場景十四 烏龜走完全程 沖過終點(diǎn) 大象在一旁 烏龜歡呼取得勝利 場景十五 電影院放映結(jié)束 場景十六 閉幕 場景十七 警醒 宣傳交通法制安全意識(shí) 第第 4 章章 設(shè)計(jì)技術(shù)設(shè)計(jì)技術(shù) 4 1 圖形繪制 在 flash 中有很多畫圖的工具 比如直線工具 鋼筆工具 矩形工具等等 每 個(gè)工具都有各自的長處與短處 只有充分了解了每個(gè)工具的用法 才能在實(shí)際操作 中做到靈活運(yùn)用 使作品表達(dá)出作者所想表達(dá)的效果 才能做到事半功倍 在本作 FLASH 動(dòng)畫設(shè)計(jì)說明書 10 品中 大部分畫面都采用最簡單的直線工具 矩形橢圓工具 鉛筆工具進(jìn)行繪畫 利用 flash 的能讓直線任意變曲線的功能 并且進(jìn)行一些微細(xì)修改 就能勾勒出心 中要的圖案 如下圖 4 1 1 圖 4 1 1 車內(nèi) 4 2 填充圖像 Flash 擁有一種與其他制圖軟件不一樣的功能 就是它所填充的區(qū)域能單獨(dú)選 擇進(jìn)行編輯或刪除 對(duì)一個(gè)已經(jīng)勾勒好的圖形進(jìn)行填充 只需要用顏料桶工具就可 以 但經(jīng)常會(huì)出現(xiàn)的情況是填充不了 而原因一般都是一樣的 填充區(qū)域沒有閉 合 像這種情況只需要選擇顏料桶下方的空隙大小按鈕 就能任意調(diào)節(jié)想要的效果 除了純色 還可以選擇已經(jīng)填充好的顏色塊 在 flash 右手邊的顏色窗口處選擇漸 變效果 通過調(diào)整顏色和 Alpha 便可以變換各種效果 或可將光點(diǎn)任意組合 形成 各種好看的圖形 如下圖 4 2 2 FLASH 動(dòng)畫設(shè)計(jì)說明書 11 圖 4 2 2 地圖 4 3 圖片原件 在 flash 中 圖形元件適用于靜態(tài)圖像的重復(fù)使用 或者創(chuàng)建與主時(shí)間軸相關(guān) 聯(lián)的動(dòng)畫 它不能提供實(shí)例名稱 也不能在動(dòng)作腳本中被引用 為了不讓作品出現(xiàn) 自動(dòng)生成的補(bǔ)間 我們需要制作很多圖形原件 尤其是在需要?jiǎng)?chuàng)建補(bǔ)間動(dòng)畫的時(shí)候 頭尾兩個(gè)關(guān)鍵幀里的內(nèi)容必須為元件 但圖形元件不能添加濾鏡效果 濾鏡只適用 于文本 影片剪輯和按鈕 如下圖 4 3 3 FLASH 動(dòng)畫設(shè)計(jì)說明書 12 圖 4 3 3 交通標(biāo)示 4 4 影片剪輯原件 影片剪輯的好處在于能不斷地循環(huán) 它通常用于制作閃爍的星星 眨眼的眼睛 說話的嘴巴等等不需要我們精確時(shí)間的動(dòng)畫 如果在 影片剪輯 元件內(nèi)部制作的 動(dòng)畫 在這個(gè) 影片剪輯 里 可以通過 回車 鍵就能直接看到效果 而 影片 剪輯 在場景里 通過 回車 是看不到任何動(dòng)作的 必須要 CTRL 回車 輸出 動(dòng)畫才能看到 影片剪輯 不受 場景 中 幀 的限制 它可以獨(dú)立于時(shí)間軸 而播放 即使 場景 中時(shí)間軸只有 1 幀 影片剪輯可以照常播放其內(nèi)部幾分鐘的 畫面和聲音 而且影片剪輯還可以添加濾鏡從而制作出一些想要的效果 如發(fā)光 陰影 斜角等 如下圖 4 4 4 FLASH 動(dòng)畫設(shè)計(jì)說明書 13 圖 4 4 4 翻書 4 5 按鈕原件 按鈕元件實(shí)際上是四幀的交互影片剪輯 它只對(duì)鼠標(biāo)動(dòng)作做出反應(yīng) 用于建 立交互按鈕 本設(shè)計(jì)只在開頭處放置了一個(gè) Play 的按鈕 和結(jié)尾處放置了 一個(gè) Replay 的按鈕 因?yàn)椴蛔⒁饨⒌?fla 文件是 ActionScript3 0 的版本 因此不能再用那種 在按鈕上添加代碼制作動(dòng)作的方法 而是較為復(fù)雜的只能在按鈕所在的幀上添加 代碼制作按鈕的動(dòng)作 如下圖 圖 4 5 5 播放按鈕 代碼如下 FLASH 動(dòng)畫設(shè)計(jì)說明書 14 stop start addEventListener MouseEvent MOUSE DOWN MouseDown function MouseDown event MouseEvent void gotoAndPlay 1 轉(zhuǎn)到場景 片頭的第一幀 圖 4 5 6 代碼如下 stop replay addEventListener MouseEvent MOUSE DOWN toreplay function toreplay event MouseEvent void gotoAndPlay 1 開場 4 6 引導(dǎo)層動(dòng)畫 FLASH 動(dòng)畫設(shè)計(jì)說明書 15 引導(dǎo)層的原理就是把畫出的線條作為動(dòng)作補(bǔ)間元件的軌道 引導(dǎo)層的作用 是作用是輔助其它圖層對(duì)象的運(yùn)動(dòng)或定位 例如我們可以為一 個(gè)球指定其運(yùn)動(dòng)軌跡 另外也可以在這個(gè)圖層上創(chuàng)建網(wǎng)格或?qū)ο?以幫助對(duì)齊其他 對(duì)象 被導(dǎo)向圖層在上一層為一導(dǎo)向?qū)踊虮粚?dǎo)向?qū)訒r(shí)才有效 當(dāng)該項(xiàng)被選擇時(shí) 所 代表的層與導(dǎo)向圖層將產(chǎn)生某種關(guān)聯(lián) 使用引導(dǎo)層可以使你的 FLASH 作品增添許多 意想不到效果 如圖 圖 4 6 1 4 7 遮罩層動(dòng)畫 遮罩層的作用是把焦點(diǎn)限制在高亮層上 通過一個(gè)絕對(duì)定位的層 通常使用 div 設(shè)置它的寬度和高度以致能覆蓋整個(gè)屏幕 包括縮放和滾動(dòng)瀏覽器的情況 下 再給它設(shè)置一個(gè)比較高的 zIndex 來層疊在原有內(nèi)容之上 但要比高亮層 小 這樣用戶就只能點(diǎn)到這個(gè)層之上的內(nèi)容了 它的原理是 上面一層是遮罩層 下面一層是被遮罩層 遮罩層上的圖 自 己是不顯示的 它只起到一個(gè)透光的作用 假定遮罩層上是一個(gè)正圓 那么光線 就會(huì)透過這個(gè)圓形 射到下面的被遮罩層上 只會(huì)顯示一個(gè)圓形的圖形 如果遮 罩層上什么都沒有 那么光線就無法透到下面來 那么下面的被遮罩層什么也顯 FLASH 動(dòng)畫設(shè)計(jì)說明書 16 示不出來 在 Flash 動(dòng)畫中 遮罩 主要有 2 種用途 一個(gè)作用是用在整個(gè)場景或一 個(gè)特定區(qū)域 使場景外的對(duì)象或特定區(qū)域外的對(duì)象不可見 另一個(gè)作用是用來遮 罩住某一元件的一部分 從而實(shí)現(xiàn)一些特殊的效果 如圖 圖 4 7 2 4 8 聲音處理 聲音處理軟件有很多 本設(shè)計(jì)主要運(yùn)用了 CoolEdit 進(jìn)行后期聲音的錄制和處 理 由于制作設(shè)計(jì)時(shí)會(huì)出現(xiàn)配音人手不夠的問題 也可以運(yùn)用該軟件進(jìn)行處理 在 去除噪音后再將其變調(diào) 就會(huì)出現(xiàn)不同聲線的聲音 為了使每一段聲音在作品里的音量能統(tǒng)一 在導(dǎo)入 flash 之前都要現(xiàn)在 CoolEdit 里設(shè)置 效果 波形振幅 音量標(biāo)準(zhǔn)化 統(tǒng)一參數(shù) 100 這樣能使作品中 的聲音足夠和諧 FLASH 動(dòng)畫設(shè)計(jì)說明書 17 第第 5 章章 制作過程制作過程 5 1 收集素材 在做動(dòng)畫之前 必須先找出一些自己在制作過程中所需要用到的素材 只有 找到好的素材才能使你的作品更加完美出色并且減少你的工作量 因此 在開始 動(dòng)作制作前我們首先應(yīng)該想想自己日后制作時(shí)所需要用到的素材 上網(wǎng)搜索 盡 可能越多越好以便日后篩選 5 1 1 聲音材料聲音材料 主要運(yùn)用了 CoolEdit 進(jìn)行聲音錄制 一些想要的聲音在網(wǎng)上還沒有找到 5 5 1 1 2 2 人人物物素素材材 我的人物素材主要來源于網(wǎng)上搜索得到的圖片 并加以修改 得到自己所 需要的角色 人物設(shè)計(jì)時(shí)最好要根據(jù)劇情實(shí)際創(chuàng)作出符合劇情中人物性格的角色 并做出一些任務(wù)固有的突出性的特征 這樣可以使劇情發(fā)展順理成章并使得動(dòng)畫 生動(dòng)合理容易讓人留下印象 以下是我的創(chuàng)作出的人物的原型圖片 如下圖 FLASH 動(dòng)畫設(shè)計(jì)說明書 18 圖 5 1 2 1 大象裁判原型 圖 5 1 2 2 烏龜 兔子原型 圖 5 1 2 3 警察小狗原型 5 1 3 背景素材背景素材 我采用的背景素材氛圍兩種 一種是自己創(chuàng)作的 一種是網(wǎng)絡(luò)圖片 一 般比較容易能描繪出的背景采用自己創(chuàng)作素材 如果是比較難 難以繪畫出的背 景則采用網(wǎng)絡(luò)圖片作為背景素材 如下圖 FLASH 動(dòng)畫設(shè)計(jì)說明書 19 圖 5 1 3 1 影院 網(wǎng)絡(luò)圖片 圖 5 1 3 2 背景 自己創(chuàng)作 5 2 編輯素材 5 2 1 編輯聲效編輯聲效 尚未完善 5 2 2 繪制人物繪制人物 FLASH 動(dòng)畫設(shè)計(jì)說明書 20 兔子烏龜 警察小狗裁判大象 表格 5 2 2 1 5 2 3 繪制場景繪制場景 FLASH 動(dòng)畫設(shè)計(jì)說明書 21 繪制車內(nèi)環(huán)境現(xiàn)實(shí)車內(nèi)環(huán)境 繪制桌面場景繪制賽道場景 5 3 動(dòng)畫制作 1 遮罩層以及引導(dǎo)層所在位置 圖 5 3 1 FLASH 動(dòng)畫設(shè)計(jì)說明書 22 2 按鈕所在位置 圖 5