Flash CS3入門橫幅廣告動畫

2021-06-30 20:01:31 字數 2636 閱讀 7095

橫幅廣告動畫是門戶**中經常出現的廣告形式,該動畫尺寸是根據所在網頁的寬度決定的。由於尺寸限制,動畫中的文字通常採用簡單明瞭的字型。在該廣告中,動畫主要由多個小動畫組成,而動畫之間則是通過【濾鏡】中的模糊效果自然銜接。

練習要點

● 影片剪輯

● 濾鏡功能

● 補間動畫

練習過程

(1)在flash中新建空白文件後,按快捷鍵ctrl+m開啟【文件屬性】對話方塊,設定【文件大小】為500×120畫素,【幀頻】為24fps,如圖54-1所示。

圖54-1 建立文件

(2)選擇工具箱中的【矩形工具】,設定填充顏色為漸變顏色後,在舞台中繪製無邊框的漸變矩形,尺寸為舞台尺寸,如圖54-2所示。

圖54-2 繪製漸變矩形

(3)執行【檔案】|【匯入】|【匯入到舞台】命令,將素材psd影象匯入到舞台中,並且將其轉換為影片剪輯map,如圖54-2所示。

圖54-3 匯入影象

(4)在第10幀處插入關鍵幀後,在第1幀中為例項map新增【模糊】濾鏡,並且水平向左移動該例項至舞台外後,在兩個關鍵幀之間建立補間動畫,形成由左至右、由模糊到清晰的動畫,如圖54-4所示。

圖54-4 建立地圖顯示動畫

(5)在新建「圖層3」第10幀處插入關鍵幀,輸入文字「投資改變世界」並且設定文字屬性如圖54-5所示,轉換為影片剪輯。接著在新建「圖層4」第14幀處插入關鍵幀,輸入文字「融資創造機遇」,設定相同文字屬性後轉換為影片剪輯,如圖54-5所示。

圖54-5 輸入文字並轉換為影片剪輯

(6)在第一組文字圖層中,在第15幀處插入關鍵幀後,返回第10幀,水平向左移動該文字例項,並且在兩個關鍵幀之間建立補間動畫,如圖54-6所示。

圖54-6 建立文字顯示動畫

(7)使用相同方法,建立「圖層4」中的文字由右向左移動顯示的動畫後,分別在兩個文字圖層的第30與35幀處插入關鍵幀,並且在第35幀中分別為兩個例項新增【模糊】濾鏡,如圖54-7所示。

圖54-7 為文字新增模糊濾鏡

(8)在第35幀處,垂直向下移動「圖層3」中的文字至舞台外後,垂直向上移動「圖層4」中的文字至舞台外,建立補間動畫,形成向外消失動畫,如圖54-8所示。

圖54-8 建立文字向外消失動畫

(9)返回「圖層2」,在第40和50幀處插入關鍵幀後,將第50幀中的例項map水平向左移動至舞台左側位置,並且在兩個關鍵幀之間建立補間動畫,形成地圖移動動畫,如圖3-9所示。

圖54-9 建立地圖移動動畫

(10)在第45幀處插入關鍵幀後,在【濾鏡】面板中新增【模糊】濾鏡,設定引數如圖54-10所示,形成地圖在移動的過程中模糊的效果。

圖54-10

(11)在圖層最上方新建「圖層5」,在第52幀處插入關鍵幀,並且在如圖54-10所示位置輸入相同屬性的文字「因為專業,我們一直努力!」。然後新建「圖層6」,繪製任意顏色的矩形。

圖54-11 輸入文字與繪製矩形

(12)在矩形所在圖層的第60幀處插入關鍵幀後,使用【任意變形工具】將其向右拉伸覆蓋文字,並且在兩個關鍵幀之間建立補間形狀動畫。然後在兩個圖層之間建立遮罩層,形成遮罩動畫,如圖54-11所示。

圖54-12 建立文字逐一顯示動畫

(13)返回「圖層2」,在第75和80幀處插入關鍵幀後,在第72幀處插入空白關鍵幀。然後選中第75幀中的例項map同中心點放大,如圖54-12所示。

圖54-13 放大例項map

(14)設定第80幀中的例項alpha為30%後,建立兩個關鍵幀之間的補間動畫,形成地圖由大到小、由清晰到半透明顯示的動畫,如圖54-14所示。

圖54-14 建立地圖顯示動畫

(15)在圖層最上方新建「圖層7」,並且在第80幀處插入關鍵幀後,使用【文字工具】在舞台中間輸入文字「全球投資中國之旅」,設定文字輸入如圖54-15所示,將其轉換為影片剪輯。

圖54-15 輸入文字並轉換為影片剪輯

(16)在第85幀處插入關鍵幀後返回第80幀,為該關鍵幀中的文字影片新增【模糊】濾鏡,並且在兩個關鍵幀之間建立補間動畫,形成文字由模糊到清晰顯示動畫,如圖3-16所示。

圖54-16 建立文字顯示動畫

(17)按快捷鍵ctrl+f8建立影片剪輯「閃爍點」,選擇工具箱中的【橢圓工具】,設定【填充顏色】為#ff8328,在舞台中心繪製直徑為7畫素的無邊框正圓,如圖54-17所示。

圖54-17 繪製正圓

(18)將關鍵幀拖至第2幀處後,將圖形轉換為圖形元件「圓」。然後在第7幀處插入關鍵幀,並且設定該幀中例項「圓」的尺寸如圖54-18所示,在兩個關鍵幀之間建立補間動畫。

圖54-18 建立圓縮小動畫

(19)在「圖層1」下方新建「圖層2」,並且在第5幀處插入關鍵幀。將【庫】面板中的元件「圓」拖至舞台中心位置,設定alpha為40%,如圖54-19所示。

圖54-19 新建圖層

(20)在第10幀處插入關鍵幀後,設定該幀中的例項尺寸如圖54-20所示,並且在兩個關鍵幀之間建立補間動畫,形成半透明圓形放大動畫。

圖54-20 建立半透明圓形放大動畫

(21)在【庫】面板中開啟影片剪輯map後,新建「圖層2」。將【庫】面板中的影片剪輯「閃爍點」逐一拖至舞台如圖54-21所示的位置,形成地圖上的固定點位置閃爍圓點。

圖54-21 裝飾地圖

(22)返回場景後,舞台中的例項map自動更新。按快捷鍵ctrl+s儲存文件後,按快捷鍵ctrl+enter測試動畫,效果如圖54-22所示。

圖54-22 橫幅廣告動畫效果

FLASH CS3例項旗幟廣告

旗幟廣告是網路廣告最初採用的型別,也是網路廣告的主要型別。旗幟廣告通常置於網頁頂部,最先映入瀏覽者的眼簾,創意絕妙的旗幟廣告對於建立並提公升客戶品牌形象有著不可低估的作用。如圖7 39所示就是宣傳家居品牌的旗幟廣告。圖7 39 旗幟廣告 直接複製元件 在flash中,除了直接建立元件的方法外,還可以...

Flash CS3入門製作下拉導航選單

當 中的資訊過多,導致導航欄目繁多時,可以將欄目歸類,採用二級欄目的形式放置在網頁導航選單中。但是由於每乙個選單欄目中的二級欄目個數不等,這裡採用了彈出式選單形式,將主欄目與二級欄目組合在一起,形成隱藏式選單。這樣能夠單獨選擇某個主欄目中的某個二級欄目,而不影響其它欄目。練習要點 匯入psd檔案 影...

FLASH CS3例項彈出視窗廣告

彈出視窗廣告是目前比較常見的廣告型別之一。在進入網頁時,會自動彈出乙個新的視窗用來宣傳廣告的內容。如圖7 16所示就是乙個宣傳護膚品的彈出視窗的廣告,通過 並茂的方式向瀏覽者介紹產品。圖7 16 彈出視窗廣告 翻轉物件 在flash動畫製作過程中,可以沿垂直或水平軸翻轉物件,而不改變其在舞台上的相對...