Flash & ActionScript 3.0 絕對出色影音動畫與互動媒體設計
第一單元 Flash基礎暖身
Flash 是一套多媒體的製作軟體,可以製作精彩的影音內容,具備跨平台、高品質、檔案體積小等優點,並可搭配內建的ActionScript程式語言做出精彩的互動效果,例如根據使用者的選擇呈現不同的動畫內容,甚至是即時、動態資料的呈現。
1. 軟體簡介及動畫概念介紹
2. Flash的操作環境
3. 場景、圖層製作運用
4. 幾何圖形的繪製及變形
5. 向量繪圖及貝茲曲線的使用
6. 填色工具及自訂色彩
7. 範例實習-夢幻的女孩
第二單元動畫製作
Flash最初的功能就是為了製作動畫,在 Flash 中製作動畫的方式主要可分為逐格動畫與補間動畫。逐格動畫就是一格格地繪製畫面,當連續播放時就會產成動態的效果,這種動畫很花人力與時間,也需要良好的繪圖技巧;補間動畫就是繪製關鍵影格後,由Flash幫我們產生中間的動畫,關鍵影格的製作技巧是動畫流暢的重要因素。
1. 逐格動畫
2. 範例實習-快樂的冰淇淋車
3. 元件、元件庫與實體介紹
4. 範例實習-新增冰淇淋車元件
5. 形狀、傳統及移動補間動畫
6. 範例實習-在鄉間奔馳的冰淇淋車
7. 控制動畫的停止與播放
8. 範例實習-利用「程式碼片段」控制冰淇淋車動畫播放
第三單元遮色片原理
在製作動畫的時候如果只想顯示物件中某部分,可以利用遮色片來達到這個效果。遮色片的原理就好像現實生活中拿兩張色紙,把上面一張色紙剪出一個形狀,就可以透過這個形狀看到下一張色紙的顏色。利用遮色片效果可以做出掃光等特效的動畫。
1. 遮色片與圖層
2. 範例實習-淡入淡出遮色片動畫
3. 掃光特效
4. 範例實習-文字掃光特效
5. 移動補間動畫路徑之應用
6. 範例實習-落花特效
7. 計時器的功能
8. 範例實習-定時換圖
第四單元聲光效果
製作動畫或遊戲等多媒體內容時如果能配上聲音及音樂將帶來更豐富的使用者體驗。Flash能夠將聲音檔匯入元件庫中,視不同的需求將這些聲音檔加在場景或元件內,在不同的事件中播放。
1. 加入聲音的使用
2. 場景串連
3. 控制場景播放
4. 輸出成網頁動畫檔及執行檔
5. 範例實習-場景切換
第五單元ActionScript 3.0
設計好的Flash動畫,如果想要有互動的功能,就必須使用程式來控制。例如:滑鼠移到某個按鈕上,Flash動畫就開始播放,或者是按了某個按鈕,就開啟了某個網頁等等,這些用來產生互動效果的程式就是ActionScript。
1. ActionScript 基本語法
2. 事件處理函數之應用
3. 範例實習-控制冰淇淋車
第六單元個人簡歷製作
利用滑鼠與影片片段元件及按鈕元件的事件可以製作許多互動效果。例如:滑鼠移到影片片段元件上面,造成外觀的改變等。
Event.ENTER_FRAME事件只要Flash播放過程中都會不斷地被觸發,所以我們可以利用這個事件來判斷物件的座標改變,搭配滑鼠的MouseEvent.ROLL_OVER及MouseEvent.ROLL_OUT事件,做出彈性多層選單。
1. 常用滑鼠事件
2. Event.ENTER_FRAME事件
3. ScrollPane組件
4. 範例實習-製作個人簡歷
第七單元圖片展示
將圖片放在不同的影格,搭配補間動畫就可以做出動態的圖片展示效果。加上按鈕的事件偵聽程式,可以做出與使用者互動的功能。
將滑鼠隱藏起來,並讓影片片段隨著滑鼠游標移動,就可以做出自訂的滑鼠游標。搭配不同的內容選擇不同的滑鼠游標,會讓作品更有趣。
1. 變數與運算子及運算元
2. 條件的判斷
3. 自訂滑鼠游標
4. 範例實習-展示圖片
第八單元動態繽紛特效
在需要大量的影片片段像花瓣或樹葉的Flash動畫時,如果都在設計的時候去製作這麼多的元件,將會相當費時費力,做出的效果又太過制式而沒有變化。
一般這些效果我們會用程式動態產生影片片段,並改變元件的大小,讓元件的出現更為活潑自然。
1. 重複執行程式
2. 將元件庫的元件利用程式加入畫面
3. Flash的座標系統
4. 範例實習-落花特效
第九單元問答測驗遊戲
利用陣列的特性,可以做出亂數排列,應用在問答測驗的遊戲中,可以做到亂數出題,答案也可以做亂數排列,讓題目及答案的順序不會每次都一樣,讓遊戲更有可玩性。
亂數排列的功能可以放在函數裡面,在需要的時候就可以呼叫這個函數,不用重複太多程式碼,方便維護及修改。
1. 陣列
2. 亂數排列陣列
3. 函數的功能
4. 函數陳述式
5. 函數運算式
6. 變數的範圍
7. 範例實習-千萬小學堂遊戲
第十單元網頁互動選單
在選單的設計上面可以加上更多的互動效果,本單元將選單設計成頁標籤,當滑鼠點選的時候,選單會展開顯示裡面的內容,再一次點選則選單會收合起來。
選單內容會放在外部的資料夾內,在需要的時候才讀取進來。這種做法一方面Flash的檔案不會太大,可以減少讀取的時間,另一方面這些內容可以動態更換,不需要更動到Flash主程式。
1. 元件的移動
2. 由實體名稱取得物件參照
3. 讀取外部的檔案
4. 範例實習-互動選單
第十一單元網路電影院
Flash不只可以在內容中加入圖片及聲音,還可以加入視訊。Flash 使用 FLV 及 F4V(H.264)的視訊格式,這些格式擁有畫質良好與容量較小的優勢,可以與圖片、聲音及互動效果完美的結合。
無論是在手機、平板電腦及個人電腦等裝置,透過Flash Player,使用者不需要安裝其他的影音播放軟體就可以看到影片。
1. Flash整合影片的方式
2. 將視訊轉成FLV或F4V的格式
3. 範例實習-視訊內嵌在SWF
4. 範例實習-利用FLVPlayback組件播放視訊
5. 範例實習-利用NetStream播放視訊
第十二單元酷炫 MP3 播放器
用ActionScript程式播放的聲音檔可以放在元件庫裡面,也可以放在外部的資料夾內,程式的寫法也會不同。瞭解聲音的處理方法,讓我們可以在需要的時候替Flash加上音效或者配上背景音樂,也可以製作音樂的播放軟體。
1. 用程式播放元件庫內的聲音檔
2. 用程式播放外部資料夾內的聲音檔
3. 使用「程式碼片段」播放外部資料夾內的聲音檔
4. 範例實習- MP3播放器