基于Flash探討音樂(lè)動(dòng)畫(huà)創(chuàng)作技術(shù)

張文 龔花蘭 劉曉芹

摘 要： 基于Flash創(chuàng)作音樂(lè)動(dòng)畫(huà)需要解決許多技術(shù)難點(diǎn)。文中研究動(dòng)畫(huà)特效、位圖元件處理和音頻文件處理等技術(shù)后，能實(shí)現(xiàn)完美的音樂(lè)動(dòng)畫(huà)效果。

關(guān)鍵詞： 音樂(lè)動(dòng)畫(huà)；動(dòng)畫(huà)特效；音頻處理技術(shù)

Abstract：The creation of music animation needs to solve many technical difficulties based on Flash. The paper can perfect music animation efficiency after studying the special effect of animation processing bitmap element and audio files.

Key words： music animation；animation special efficiency；audio processing technology

引言

Flash是一款優(yōu)秀的網(wǎng)頁(yè)動(dòng)畫(huà)設(shè)計(jì)軟件，能夠?qū)?dòng)畫(huà)、音樂(lè)、聲效以及富有新意的界面融合在一起，制作出高品質(zhì)的網(wǎng)頁(yè)動(dòng)畫(huà)。基于Flash制作的動(dòng)畫(huà)文件用于網(wǎng)頁(yè)設(shè)計(jì)中，不僅可以使網(wǎng)頁(yè)栩栩如生，而且動(dòng)畫(huà)文件定制小巧，易于上傳和下載，在打開(kāi)網(wǎng)頁(yè)很短的時(shí)間里就得以播放。因此，基于Flash探討音樂(lè)動(dòng)畫(huà)的創(chuàng)作技術(shù)，將具有直觀重要的實(shí)用價(jià)值。

1 動(dòng)畫(huà)特效技術(shù)

時(shí)下，各種腳本語(yǔ)言應(yīng)運(yùn)而生。但程序設(shè)計(jì)需要一定的編寫(xiě)駕馭能力，不能做到良好的推廣與普及，對(duì)于廣大網(wǎng)頁(yè)動(dòng)畫(huà)設(shè)計(jì)者，往往無(wú)法達(dá)到理想的預(yù)期效果。在本次研究中，將利用Flash軟件來(lái)探討功能強(qiáng)大的動(dòng)畫(huà)特效技術(shù)，內(nèi)容論述如下 。

1.1 運(yùn)動(dòng)動(dòng)畫(huà)的特效

運(yùn)動(dòng)動(dòng)畫(huà)是Flash中簡(jiǎn)單易學(xué)的一類(lèi)特效。巧妙地設(shè)置了時(shí)間軸對(duì)應(yīng)場(chǎng)景上的圖符元件，獨(dú)具優(yōu)勢(shì)的運(yùn)動(dòng)動(dòng)畫(huà)也能達(dá)到編程設(shè)計(jì)同樣的動(dòng)畫(huà)效果。如需要制作水中游魚(yú)“大魚(yú)吃小魚(yú)”的動(dòng)畫(huà)，即如圖1所示。在有“魚(yú)”圖符元件素材的情況下，用簡(jiǎn)單的運(yùn)動(dòng)動(dòng)畫(huà)可以實(shí)現(xiàn)魚(yú)在水中游動(dòng)的效果。但是，要呈現(xiàn)“大魚(yú)吃小魚(yú)，小魚(yú)吃蝦米”的特效，必需采用特效技術(shù)進(jìn)一步精確設(shè)置時(shí)間軸對(duì)應(yīng)場(chǎng)景上的圖符元件。研究可得設(shè)計(jì)過(guò)程中各步驟內(nèi)容順次表述如下：

首先，制作在1～40幀之間 “大魚(yú)”和“小魚(yú)”相向游動(dòng)的運(yùn)動(dòng)動(dòng)畫(huà)，設(shè)置在第40幀處“大魚(yú)”和“小魚(yú)”游到同一位置，并且在時(shí)間軸上將“大魚(yú)”的動(dòng)畫(huà)圖層設(shè)置在“小魚(yú)”的動(dòng)畫(huà)圖層上，這樣，當(dāng)“大魚(yú)”和“小魚(yú)”游到同一位置（40幀處）時(shí)，“大魚(yú)”正好遮擋住“小魚(yú)”[1]。接著，選定“小魚(yú)”圖層的第41幀和第90幀右擊鼠標(biāo)，在彈出的快捷菜單中選擇“刪除幀”命令，將“小魚(yú)”圖層的第41幀和第90幀刪除，表示在40幀后，小魚(yú)消失了，直觀的動(dòng)畫(huà)效果就是在第40幀處“大魚(yú)”將“小魚(yú)” 吃掉了，從而實(shí)現(xiàn)了“大魚(yú)吃小魚(yú)”的特效。與上類(lèi)似，新建2個(gè)層，同樣的設(shè)置方法，也可以成功制作出“小魚(yú)吃蝦米”的運(yùn)動(dòng)動(dòng)畫(huà)特效。

1.2 位圖元件處理技術(shù)

制作小車(chē)在公路上行駛的動(dòng)畫(huà)。這里就必須采用位圖元件處理技術(shù)。首先，從網(wǎng)上下載需要的小車(chē)圖片，并導(dǎo)入到Flash軟件的圖符元件庫(kù)中。接著，制作出車(chē)輪轉(zhuǎn)動(dòng)效果的影片剪輯圖符。技術(shù)研發(fā)步驟可闡釋解析如下：

先要制作出兩車(chē)輪轉(zhuǎn)動(dòng)的動(dòng)畫(huà)。首先，將位圖中車(chē)輪與車(chē)體分開(kāi)才能制作車(chē)輪轉(zhuǎn)動(dòng)的動(dòng)畫(huà)效果，在此，可以通過(guò)Flash繪圖工具中的“圓形工具”，使用與車(chē)輪相同大小的空心圓來(lái)裁剪出2個(gè)車(chē)輪，在舞臺(tái)中選定小車(chē)圖形，按“Ctrl+B”鍵將其分解[2]。然后，用“橢圓工具”繪制1個(gè)和小車(chē)車(chē)輪大小接近的內(nèi)部填充為“無(wú)”的“正圓”，將該“正圓”移動(dòng)到小車(chē)的車(chē)輪位置并與車(chē)輪重合，而后將車(chē)輪移開(kāi)[3]。設(shè)計(jì)效果如圖2（b）所示。接著，選中分離出的車(chē)體，將車(chē)體轉(zhuǎn)換為“車(chē)體圖形元件”保存在圖符元件庫(kù)中，同樣，選中分離出的車(chē)輪，將車(chē)輪轉(zhuǎn)換為“車(chē)輪圖形元件”保存在圖符元件庫(kù)中。最后，制作影片剪輯元件“行駛的車(chē)”。具體過(guò)程是：選擇“插入” |“新建元件”命令，彈出“創(chuàng)建新元件”對(duì)話框，在對(duì)話框中設(shè)置名稱(chēng)為“行駛的小車(chē)”，類(lèi)型為“影片剪輯”，單擊“確定”，進(jìn)入到影片剪輯元件編輯狀態(tài)。將庫(kù)中的圖形元件“車(chē)體”放在圖層一。插入兩新層，分別將2個(gè)圖形元件“車(chē)輪”放在圖層二和圖層三。調(diào)整2個(gè)車(chē)輪的位置，正好與圖層一的“車(chē)體”貼合為一個(gè)完整的小車(chē)圖形[4]，運(yùn)行加工效果如圖3所示。制作車(chē)輪轉(zhuǎn)動(dòng)的動(dòng)畫(huà)設(shè)計(jì)步驟可見(jiàn)如下：

（1）在圖3時(shí)間軸“前輪圖層”的第25幀處插入關(guān)鍵幀，在“第1幀”和“第25幀”間 “創(chuàng)建傳統(tǒng)補(bǔ)間”動(dòng)畫(huà)。

（2）選中“前輪圖層”的第1幀，設(shè)置屬性面板[5]，使 “車(chē)輪”對(duì)象在“第1幀”和“第25幀”間順時(shí)針轉(zhuǎn)動(dòng)兩周。

（3）同樣的步驟，制作“后輪圖層”中后一個(gè)車(chē)輪在“第一幀”和“第25幀”間同步順時(shí)針轉(zhuǎn)動(dòng)兩周。此時(shí)影片剪輯元件“行駛的小車(chē)”的時(shí)間軸面板亦如圖3所示。

回到場(chǎng)景，將影片剪輯元件“行駛的小車(chē)”從“圖符元件庫(kù)”中拖到場(chǎng)景中（可以事先導(dǎo)入對(duì)應(yīng)有公路的背景圖），制作影片剪輯元件“行駛的小車(chē)”在舞臺(tái)背景中的簡(jiǎn)單運(yùn)動(dòng)動(dòng)畫(huà)，按快捷鍵“Ctrl+Enter”測(cè)試，就可以看見(jiàn)小車(chē)在公路上行駛的動(dòng)畫(huà)效果。

1.3 gif動(dòng)畫(huà)引用技術(shù)

在音樂(lè)動(dòng)畫(huà)中，要穿插動(dòng)物奔跑或小鳥(niǎo)飛行的動(dòng)畫(huà)，最佳方法就是采用gif動(dòng)畫(huà)引用技術(shù)。比如要制作如圖4所示飛行中的小鳥(niǎo)，采用的gif動(dòng)畫(huà)引用技術(shù)主要是制作影版剪輯元件“小鳥(niǎo)飛行”。這里，將給出主要執(zhí)行步驟如下：

準(zhǔn)備好“小鳥(niǎo)飛行”的gif動(dòng)畫(huà)素材，新建影版剪輯元件“小鳥(niǎo)飛行”，在 “小鳥(niǎo)飛行”影版剪輯元件制作中，導(dǎo)入“小鳥(niǎo)飛行”的gif動(dòng)畫(huà)，這時(shí)時(shí)間軸上會(huì)出現(xiàn)幀幀動(dòng)畫(huà)。在元件庫(kù)中，復(fù)制多個(gè)“小鳥(niǎo)飛行”的影版剪輯元件，根據(jù)需要，調(diào)整間軸上幀幀動(dòng)畫(huà)的時(shí)間距離，可以得出不同小鳥(niǎo)的飛行速度。多個(gè)“小鳥(niǎo)飛行”的影版剪輯元件在庫(kù)中等待調(diào)用。回到場(chǎng)景，將3個(gè)“小鳥(niǎo)飛行”的影版剪輯元件拖放到舞臺(tái)場(chǎng)景中（已經(jīng)設(shè)置好花兒盛開(kāi)的背景）如圖4所示，并調(diào)整這3個(gè)“小鳥(niǎo)飛行”的影版剪輯元件大小，按快捷鍵“Ctrl+Enter”開(kāi)啟測(cè)試，就可以同時(shí)看見(jiàn)3只不同的小鳥(niǎo)飛行的動(dòng)畫(huà)效果。

2 音樂(lè)的導(dǎo)入與處理

精良的動(dòng)畫(huà)再配上唯美的背景音樂(lè)，給人心曠神怡的享受，也會(huì)使網(wǎng)頁(yè)增添吸引力。Flash軟件支持的音頻格式主要有WAV、AIF和MP3等。配置動(dòng)畫(huà)的背景音樂(lè)，常常選用MP3格式音樂(lè)，因?yàn)?，MP3是利用 MPEG Audio Layer 3 的技術(shù)，將音樂(lè)以1：10 甚至 1：12 的壓縮率壓縮成容量較小的文件 MP3格式文件在音質(zhì)丟失很小的情況下還能優(yōu)質(zhì)保持原來(lái)的音質(zhì)[6]。

2.1 音頻文件的導(dǎo)入

在Flash軟件中，音頻文件的導(dǎo)入可分為如下設(shè)計(jì)步驟：?jiǎn)?dòng)Flash軟件后創(chuàng)建某音樂(lè)層，點(diǎn)擊“文件—導(dǎo)入”，選定已準(zhǔn)備好的“*.mp3” 音頻文件素材，就可以迅速將音頻文件導(dǎo)入，并且該音頻文件會(huì)保存在“圖符元件庫(kù)”中。但是，在Flash軟件中導(dǎo)入音頻文件時(shí)，常常出現(xiàn)如圖5所示的彈出界面，即 MP3 音樂(lè)不能正常導(dǎo)入到Flash軟件中的情況。 重點(diǎn)是因?yàn)檫@首“*.mp3”音頻文件不是標(biāo)準(zhǔn)的MP3格式音樂(lè)[6]，需要進(jìn)行音頻文件素材處理。

2.2 音頻處理技術(shù)

2.2.1 音頻轉(zhuǎn)換

Flash中遇到MP3音頻文件不能正常導(dǎo)入的狀態(tài)[7]。可以使用Goldwave或解霸等音頻編輯軟件提供處理。音頻處理的研發(fā)操作過(guò)程將遵循如下步驟：

啟動(dòng)Goldwave的軟件窗口，打開(kāi)已準(zhǔn)備好的“*.mp3”音頻文件，顯示音頻文件處于打開(kāi)狀態(tài)，點(diǎn)擊“另存為”按鈕，保存文件名為“*2 .mp3”，文件屬性項(xiàng)選擇頻率、位率等[7]。此時(shí)，即已通過(guò)Goldwave音頻編輯軟件將非標(biāo)準(zhǔn)的MP3格式音樂(lè)轉(zhuǎn)換為標(biāo)準(zhǔn)的MP3格式“*2 .mp3” 音頻文件 [8]。音頻文件轉(zhuǎn)換后，在Flash軟件窗口中連續(xù)點(diǎn)擊“文件—導(dǎo)入”，選擇要導(dǎo)入的“*2.mp3”文件，就可以在Flash軟件中實(shí)現(xiàn)正常導(dǎo)入。

2.2.2 音頻剪輯

當(dāng)創(chuàng)作音樂(lè)動(dòng)畫(huà)只需音樂(lè)的一小段時(shí)，就需要對(duì)音頻文件進(jìn)行剪裁和編輯。剪輯執(zhí)行步驟為：

啟動(dòng)Goldwave音頻編輯軟件，打開(kāi)已準(zhǔn)備好的音頻文件，如圖6所示。用鼠標(biāo)單擊“播放”按鈕，試聽(tīng)到設(shè)計(jì)需要的音頻起始位置，右擊鼠標(biāo)，選“設(shè)置起始標(biāo)記”；繼續(xù)試聽(tīng)，到設(shè)計(jì)的結(jié)束位置時(shí)，單擊“暫?！卑粹o，右擊鼠標(biāo)，選“設(shè)置結(jié)束標(biāo)記”。這樣截選的音頻段在編輯窗口中高亮顯示。針對(duì)高亮顯示的音頻文件，執(zhí)行“編輯”|“復(fù)制”命令，再執(zhí)行“編輯”|“粘貼為新文件”命令，這樣就把截取的音頻段復(fù)制到了一個(gè)新建的音頻文檔中[7]。保存新建的該段音頻文供需要時(shí)調(diào)取使用。

3 結(jié)束語(yǔ)

創(chuàng)作優(yōu)效的音樂(lè)動(dòng)畫(huà)會(huì)遇到許多技術(shù)問(wèn)題。挖掘出Flash軟件強(qiáng)大的動(dòng)畫(huà)編輯功能，使復(fù)雜問(wèn)題簡(jiǎn)單化，設(shè)計(jì)者可以創(chuàng)作出高品質(zhì)的、音樂(lè)和動(dòng)畫(huà)交互融合的、令人耳目一新的音樂(lè)動(dòng)畫(huà)。

參考文獻(xiàn)

[1] 龔花蘭. 中文Flash CS5項(xiàng)目驅(qū)動(dòng)“教學(xué)做”案例教程[M] . 上海：復(fù)旦大學(xué)出版社，2012.

[2] 郭建偉. 畫(huà)龍點(diǎn)睛 讓圖片中的眼睛充滿神采[J]. 電腦知識(shí)與技術(shù)（經(jīng)驗(yàn)技巧） 2017（5）：83-86.

[3] 繆亮. Flash動(dòng)畫(huà)制作基礎(chǔ)與上機(jī)指導(dǎo) [M] . 北京.清華大學(xué)出版社，2010.

[4] 黃美益. 淺析Flash動(dòng)畫(huà)的應(yīng)用及遮罩動(dòng)畫(huà)的使用技巧[J]. 電子技術(shù)與軟件工程 2017（6）：76，84.

[5] 龔花蘭. Flash CS6項(xiàng)目驅(qū)動(dòng)“教學(xué)做”案例教程[M] . 2版. 上海：復(fù)旦大學(xué)出版社，2014.

[6] 張文，龔花蘭，李敏嬌，等. 創(chuàng)作“綠色世界”主題音樂(lè)動(dòng)畫(huà)的研究與實(shí)踐[J]. 智能計(jì)算機(jī)與應(yīng)用 2017，7（5）：137-139.

[7] 龔花蘭. Flash 音樂(lè)短劇創(chuàng)作中技術(shù)難點(diǎn)的突破[J]. 智能計(jì)算機(jī)與應(yīng)用，2017，7（4）：95-98.

[8] 龔花蘭，施怡，王勇勇. 基于Flash創(chuàng)作MTV作品的關(guān)鍵流程[J]. 中國(guó)現(xiàn)代教育裝備，2014（11）：27-29.