文章出處

前些天發過的一個動畫,看大家比較喜歡,寫個教程一起學習下,感興趣的朋友可以做下,先看效果:


新建一個空白的Flash文檔,把背景設置為黑色。

Flash精彩音樂動畫實例:窗之戀

在場景中把圖層1改為窗框,然后在這一層中繪制一個矩形邊框。

Flash精彩音樂動畫實例:窗之戀

因為這里要把窗填充成一個木制顏色的窗,所以要先導入一張木紋圖片。選擇文件——導入——導入到庫,導入一張事先準備好的圖片。

Flash精彩音樂動畫實例:窗之戀



導入后按Shift F9打開混色器,把填充的類型選擇為“位圖”,然后在選擇剛才導入的圖片填充。

Flash精彩音樂動畫實例:窗之戀

新建一個圖層為“窗”,把這個圖層放到“窗框”下面。然后在這一層中繪制如圖的窗。用剛才的方法把它填充成木色。

Flash精彩音樂動畫實例:窗之戀

中間的玻璃用透明度為30%的灰色填充。

Flash精彩音樂動畫實例:窗之戀

窗畫好了,下面開始來畫窗簾了。按Ctrl F8新建一個名為“窗簾”的影片剪輯。

Flash精彩音樂動畫實例:窗之戀



在影片剪輯中繪制如圖的窗簾布(當然,你也可以按照你自己的意思來畫),填充色我選擇了透明度為30%的白色。

Flash精彩音樂動畫實例:窗之戀

在圖層1第50幀插入關鍵幀,在這一幀中用選擇工具把窗簾布的形狀改變下,如圖。

Flash精彩音樂動畫實例:窗之戀

改好形狀后,在第1幀右擊選擇復制幀復制第1幀,然后在100幀右擊粘貼幀。(這是為了使窗簾布來回飄動)最后,分別在第1幀和第50幀插入形狀補間動畫。

Flash精彩音樂動畫實例:窗之戀

注:形狀補間動畫有時并不能按著自己想的那樣來,就像我這個窗簾吧,剛開始時它也老不按的的想法來,而且加了標識記號也沒用,怎么辦呢,還是有辦法解決的:首先,在第50幀插入幀后別急著改變它的形狀,先在第1幀插入形狀補間動畫,然后再點第50幀,這里別一下改太大的變化,就一點一點改,改一點就點下前面的幀看下變化的過程是否看,不好看就按Ctrl Z撒消,重新再改。只要你要耐心,慢慢一點一點弄,最后一點能弄出一個飄得很好看的窗簾的。

新建一個圖層2,給窗簾繪制多一個疊影,方法和前面繪制窗簾是一樣的,我就不多說了。

Flash精彩音樂動畫實例:窗之戀



新建一個名為“窗簾1”的影片剪輯,按Ctrl L打開庫,把剛才做好的窗簾動畫拖到場景中,然后在第29幀插入幀。

Flash精彩音樂動畫實例:窗之戀

Flash精彩音樂動畫實例:窗之戀

新建一個圖層2,再拖入一個“窗簾”的影片剪輯,然后選擇修改——變形——水平翻轉把它換下方向,同樣在第29幀插入幀。

Flash精彩音樂動畫實例:窗之戀

新建一個圖層3,這次插入兩個“窗簾”的影片剪輯,同樣把其中一個的方向改變下,下用變形工具調整下這兩個圖形的大小。只要讓它看起來有層次感就行了。最后在第30幀插入幀。

Flash精彩音樂動畫實例:窗之戀



再新建一個圖層4,在圖層4第30幀插入關鍵幀。這次不拖元件了,點下圖層1,然后把圖層1場景中的元件按Ctrl C復制,再點下圖層4第30幀按Ctrl Shift V把它粘貼到原來的位置,同樣的,再點下圖層2,把圖層2的圖形也復制過來粘貼到原來的位置。最后,按F9打開動作面板,輸入stop();

Flash精彩音樂動畫實例:窗之戀

最后,分別點下圖層1和圖層2中的元件,按Ctrl B打散。有些人一定會奇怪為什么要這樣做,其實我這么做的目的只是為了等下窗簾飄動的時候有層次感,不會同時飄起來,至于把兩個元件放在不同的層,只是為了打散后顏色不會變。

下面返回到場景中,新建一個圖層為“窗簾”,打開庫,把剛做好的“窗簾1”元件拖放到場景中,拖兩個,一個用水平翻轉改變下方向,分別把這兩個元件擺放好。如圖。(可以適當的用變形工具再調整下)

Flash精彩音樂動畫實例:窗之戀

這窗做得差不多了,不過背景不好看,咱給它換下背景吧。
新建一個圖層為背景,(把它放到窗圖層下面)然后畫一個和場景一樣大小的填充的矩形,然后把填充色設置為無,再畫一個小矩形(這個矩形是無填充色的),把它的大小設置和窗一樣大,畫好后,在場景外點下,取消選擇,然后再雙擊場景中的小矩形,把它選起來后刪掉,這樣,背景矩形就畫好了,(我這里又導入了一張圖片來填充,方法跟前面畫窗時填充一樣的。)

Flash精彩音樂動畫實例:窗之戀

畫好背景后,感覺是不是好多了,可是再看下場景中,發現窗簾上面多出的地方實在不好看,怎么辦?用選擇工具在背景層里選出窗上邊的圖形,然后復制,再新建一個“背景上”的圖層,在這一層中把它粘貼到原來的位置,這樣就行了。

Flash精彩音樂動畫實例:窗之戀



新建一個圖層“窗上”,繪制一個矩形條,把它填充為和窗一樣的顏色,再把它放置在窗上面,然后再用線條工具在它下面畫一條灰色的線條,以增加它的層次感。

Flash精彩音樂動畫實例:窗之戀

到此,窗和窗簾已經全部完工了,下面就是要給窗后面加點東東,使它看起來更好看點。在最下面新建一個“背景圖”的圖層,在這個圖層中導入一張事先準備好的圖片做背景,(導入圖片后用變形工具調整下大小)。

Flash精彩音樂動畫實例:窗之戀

本來到這里就已經差不多了,不過因為我比較無聊,所以決定再加點小動畫進去。
新建一個名為“1”的影片剪輯,選擇文件——導入——導入到舞臺,導入一張事先準備好的蝴蝶。導入蝴蝶后,在第5幀和第10幀插入關鍵幀,然后點下第5幀,把這一幀里,選擇變形工具,然后按住Shift不放,把蝴蝶往中間縮小一半。最后分別在第一幀和第5幀右擊,選擇創建補間動畫。

Flash精彩音樂動畫實例:窗之戀

這樣,蝴蝶就會飛了,不過就原地飛,下面就來讓它按我們的要求飛吧。

再新建一個名為“蝴蝶”的影片剪輯,打開庫,把剛做好的元件“1”拖到舞臺中來,再為圖層1添加運動引導層,在引導層的第1幀里隨意畫出一條線來(這條線就是你要讓蝴蝶飛的路徑,所以你要它怎么飛就怎么畫。)

Flash精彩音樂動畫實例:窗之戀



畫好引導線后,在引導層第300幀插入幀,再在圖層1第300幀插入關鍵幀,點擊圖層1第1幀,在這一幀把蝴蝶放在引導層的一端,也就是要開始飛的一端,再點下第300幀,把它放在另一頭。

Flash精彩音樂動畫實例:窗之戀

點擊第1幀右擊創建補間動畫,再在補間動畫的屬性中把調整到路徑勾上,這樣一只沿著指定路徑飛舞的蝴蝶就做好了。最后,在圖層1第340幀插入幀。

Flash精彩音樂動畫實例:窗之戀

以同樣的方法再做一只不同路徑飛舞的蝴蝶。

新建一個名為“蝴蝶飛飛”的影片剪輯,在這里要把剛做好的兩個蝴蝶飛舞的元件放進來,而且要讓它們在不同時間段開始飛出來。在圖層1第10幀插入關鍵幀,打開庫,把蝴蝶元件拖到場景中來,在第120幀插入幀。再新建一個圖層2,在第50幀插入關鍵幀,同樣再拖入一個蝴蝶元件進來,這次可以拖一個不同路徑的進來。同樣在第120幀插入幀。再新建一個圖層3,在第120幀插入關鍵幀,再插入一個蝴蝶元件進來,這次隨便你要哪個,不過拖進場景后可以把它改變下方向。最后點擊120幀(哪個圖層都行),然后按F9打開動作面板,輸入stop();(三只蝴蝶的位置要適當調整下)注:如果覺得蝴蝶的顏色不喜歡,和場景里的圖片不適合的話,可以點擊下想改變顏色的蝴蝶,打開屬性面板,選擇顏色—色調,然后調整好自己要的顏色,再改變下透明度就行了。

Flash精彩音樂動畫實例:窗之戀

返回場,在背景圖層上面新建一個圖層為“蝴蝶”,然后把剛做好的蝴蝶飛飛元件拖到場景中。可以用做蝴蝶的方法再做一個楓葉飄落的小動畫,再放置到場景中,因為方法一樣,在這就不多說了。

Flash精彩音樂動畫實例:窗之戀

到此,全部動畫都做完了,不過,好看的動畫怎么能沒有好聽的音樂做伴呢,在場景中再新建一個圖層為音樂,然后選擇文件—導入—導入到庫,導入一首事先準備好的音樂,點擊音樂圖層,然后在屬性面板中選擇剛導入的音樂。

Flash精彩音樂動畫實例:窗之戀

好了,測試下吧~^0^

因為加了音樂的源文件太大,發不上來,所以把音樂去掉了,發個沒有音樂的源文件上來,音樂文件也比較大,所以就不發上來了。素材圖片也順便打包上來...

歡迎轉載:http://www.kanwencang.com/bangong/20161206/63756.html

文章列表




Avast logo

Avast 防毒軟體已檢查此封電子郵件的病毒。
www.avast.com


arrow
arrow
    全站熱搜
    創作者介紹
    創作者 大師兄 的頭像
    大師兄

    IT工程師數位筆記本

    大師兄 發表在 痞客邦 留言(0) 人氣()