FLASH
Flash 介紹 ( 檔案格式 )Flash 是 Adobe 公司推出的專業網頁動畫設計軟體,利用向量繪圖 技術,結合音效,且支援點陣圖及視訊檔案匯入,還可撰寫 Actio n Script 程式,製作出互動式的網頁、動畫、遊戲、電影,亦可 與其他軟體整合運用,現已成為一套多媒體的整合工具。
應用範圍廣泛如,網頁介面、遊戲、教學、結合資料庫、影音展示、
動畫作品……等。
動畫的概念 - 動畫是根據視覺暫留原理,讓靜態圖片快速連續播放,而造成的
連續性畫面。動畫是以影格( frame )為單位。
–Flash 預設為每秒播放 24 格,即 24 fps 。若為網路用,用預設值即可,格
數愈高,則畫面動作愈流暢。也可依照播放媒體來設定動畫的每秒播放格數 (fps) ,設定如下 :
電視: 29.97 fps(NTSC)
電影: 24 fps
DVD : 30 fps
Flash 動畫製作流程
Flash 的動畫類型大致分為逐格動畫 (Frame-by-Frame Animatio n) 與漸變動畫 (Tweening Animation) 兩大類開新檔案 匯入資源 動畫製作 測試與發佈
• 選擇 Actionscript3.0/2.0
• 設定文件尺寸
• 影格播放速率 (fps)
• 圖像
• 影片
• 音訊
• 繪製元件 ( 角色 )
• 在舞台安排元素的動作
•在時間軸中安排元件的 出場時間與順序
• 加入效果
• 加入互動行為 (action script)
• 動畫檔 swf
• 網頁
• 自動執行檔 exe
操作介面圖層與時間軸 功能表列
工作區 ( 舞台 )
工具箱 浮動功能視窗列 :
可以移動、收合 製作自己的工作區
屬性面板 :
當前編輯的物件的各項 屬性都可以在此作調整
Flash 概念工作區 舞台
影格 人物的各個分解動作
時間軸 / 圖層 進 / 出場順序
元件 演員 / 角色
元件庫 演員休息室,儲存元件的資
料庫
場景 演出的地方,包括背景色、
影片尺寸大小 等設定
開啟新檔 : 檔案 >> 新增 >> 檔案類型 >> 確定
文件修改 : 修改 >> 文件 >> 文件屬性 >> 確定
繪圖工具 ( 工具箱 )細部選取工具 選取工具
套索工具 文字工具
筆刷工具 油漆桶工具 橡皮擦工具 縮放工具 筆畫顏色 填色顏色
手掌工具 滴管工具
墨水瓶工具 鉛筆工具 線段工具 自由變形工具
工具選項欄
選取 / 直接選取工具直接選取工具可以編輯圖形的端點 選取工具可以編輯圖形中相同
顏色的像素
任意變形 / 套索工具任意編輯工具可以旋轉、縮放圖形
套索工具可以選取圖形的像素進行編輯
文字
橡皮擦文字框鍵入文字後,可以點選文字,在屬性欄裡調整文字選項
Flash 的橡皮擦工具有五種不同的模式,可以視功能選擇使用
基本繪圖教學
線條鋼筆 線條
使用貝茲曲線描繪路徑
按住左鍵拖曳線條方向
筆刷 鉛筆
按住左鍵即可描繪線條
按住左鍵即可描繪線條,
鉛筆工具會自動平滑化
多邊形
墨水瓶 / 油漆桶按住左鍵往右下拖曳
,即可產生圖形
筆畫顏色
填色顏色
漸層填色左鍵點擊漸層類型
1
2
可以在顏色視窗調整漸層選項
元件的概念Flash 中創建的圖形、按鈕或影片群組,儲存為“元件”之後可以重複 使用,快速進入編輯模式,整個檔案的元件會跟著改變。
元件製作可以用父子概念去理解,變化出不一樣的群組元件
舉例 : 汽車 ( 輪胎會動 ) ,元件的組成可能是
製作元件步驟匯入 / 繪製圖像 轉換成元件 從元件庫中拖曳到舞 台中重複取用
• 按鈕元件
• 圖形元件
• 影片元件
• 點陣圖
• 向量圖
汽車 ( 影片元件 )= 車身 ( 圖像元件 )+ 轉動的輪子 ( 影片 元件 )+ 控制車輪停止 / 啟動的按鈕 ( 按鈕元件 )
常匯入的圖像格式PSD Photoshop
內部的編輯檔案格式,專為處理點陣圖而用,保留透明度及圖層 , 檔案較 PNG 大
AI illustrator 內部的編輯檔案格式,專為製作向量 圖而用,檔案保留圖層 , 若要匯入 Flash 儘量少 用漸層色
GIF 網頁常用格式,可製作透明圖、交錯圖、動畫等,
檔案體積小,不失真,非破壞性壓縮,不支援全彩 影像
JPEG / JPG 一般與網頁常用格式,壓縮率大,屬破壞性壓縮,
捨棄像素造成失真,一般壓縮下肉眼很難分辨 PNG 結合 GIF 與 JPG 優點,適合用於網路,可保留透
明度
元件類型比較Graphic圖像 按鈕
Button 影片片段
Movie Clip 圖像元件含靜止圖片或動
畫,是製作動畫的基本元 素之一。播放長度就是時 間軸的長度,無法自行獨 立迴圈播放,也無法被程 式控制。
用於控制滑鼠的互動的行
“ ” 為,可設定 一般 、
“ 滑入 、 按下 和 感應區” “ ” “ ” 等四個狀態,內容可為靜 止圖像或影片片段。
動畫的一個片段,可獨立 產生動態效果。當播放主 要動畫時,影片元件可以 自行迴圈播放。影片片段 也可包含程式碼。
匯入檔案 ( 圖像、影片、音訊 ) 製作成元件檔案 > 匯入 > 匯入至元件庫
選擇檔案 > 開啟舊檔
檔案已匯入元件庫
音訊匯入元件庫檔案 > 匯入 > 匯入至元件庫
聲音已被存在元件庫
影片匯入元件庫
將畫好的物件製作成元件選取畫好的物件
點擊右鍵開啟選單
,選擇轉換成元件。
選取元件類型 為元件訂定名稱
將文字當作元件文字也可以變成文件,點擊 滑鼠右鍵開啟選單選擇
轉換成元件,就可以將文字 存入元件庫當中使用。
一段文字元件可以打散成個別的字元
,作個別的效果,按右鍵點選打散 一段文字就會被變成個別的字元元件
,再按一次右鍵點擊分層製圖層,每 個字元元件就會被分到各自的圖層中
元件編輯區左鍵雙擊元件即可進入元件編輯區
圖像影片編輯區 影片片 段 元件編輯區
混合模式建立複合影像,將兩個以上的 重疊物件,改變其透明度
或顏色互動的過程。混和模式藉由重疊的影片片段中的混和顏色
,建立特殊效果。
一般
圖層
變暗
相乘
變亮
螢幕
變亮
實光
增加
相減
差異化
負片效果
Alpha
擦除
按鈕編輯區按扭的時間軸指示了每個按鈕動作時 的影格,使用者在這裡編輯按鈕的變化
時間軸的概念
F l a s h 編 輯 動 畫 的 主 要 工 具 , 用 於 組 織 和 控 制 動 畫 中 的 影 格 和 圖 層 的 播 放 時 間 和 出 現 順 序 。 時 間 軸 主 要 由 圖 層 控 制 區 、 影 格 和 播 放 控 制 等 部 分 組 成 。將圖層顯示成外框鎖定圖層顯現圖層 經過時間
影格速率
目前影格
修改描圖紙標記編輯多個影格描圖紙外框描圖紙轉動至撥放磁頭
垃圾桶資料夾增加導引線新增圖層
影格數
圖層 / 影格
在影格上點擊右鍵影格編輯選單
描圖紙功能 ( 洋蔥皮 )
在繪製動畫時,可使用描圖紙功能,了解前面圖形的位置與形體變化顯示前一影格的 半透明影像
顯示前一影格的 外框
導引線動畫 : 利用導引線功能使物件沿著路徑移動。點選圖層,點擊右鍵出現圖層選單
選擇增加導引線 圖層上方出現導引線圖層,
在此圖層關鍵影格繪製導引線
在起終的關鍵影格將圖形分別放置在
導引線的兩端,要出現圓圈標誌才是正確放置
起 終
1
2
3
在物件圖層中間點擊右鍵
,選擇建立移動補間動畫
移動補間動畫建立後,可以移動影格,檢查 圖形物件是否沿著導引線移動
4
5
遮罩 () 動畫1
建立兩個圖層,個別描繪物件,物件圖層 ( 下 ) 與遮罩圖層 ( 上 )2
,在遮罩的起終關鍵圖層設定其移動方向或其他變化
遮罩概念 :
被遮罩覆蓋的圖形會顯現,其他部分會被隱藏。
遮罩
物件 : 文字 / 圖形
在遮罩圖層中點右鍵,
建立移動補間動畫
遮罩圖層的移動補間動畫已建立
在遮罩圖層點擊右鍵,
選單中點遮色片選項
遮色片已被建立
測試影片檢查效果
4
5
3
6
影格 (frame) 的概念影片中每個畫面在 Flash 中稱為影格,影格是 Flash 最基本的單 位。在各個影格上放置圖形、文字、聲音等各種素材或物件。多個 影格按照先後次序以一定速率連續播放形成動畫。
影格的選擇 : 在 Flash 中影格按照功能的不同,可以分為三種:關鍵影 格、空白關鍵影格和普通影格。
插入影格快捷鍵關鍵影格 : 放置元件、圖形… . 等內容的影格
空白關鍵影格 : 沒有放置內容的關鍵影格,通常做為隔離不同段動畫用 普通影格 : 關鍵影格時間的延伸,無法放置內容
F6 F5
逐格動畫 (Frame-by-Frame Animation)逐格動畫是動畫最基本的製作方式,一個影格,填入一個影像
漸變動畫 (Tweening Animation)
形狀補間動畫 ( 讓圖形產生形變 )1
2
3
建立兩個關鍵影格,
在結束的關鍵影格讓 圖形改變
在起終關鍵影格中間,按滑鼠 右鍵出現選單,選擇”建立形狀 補間動畫”
當中間影格變成綠色且出現箭頭 即為完成形變動畫,可測試影片。
移動補間動畫 : 旋轉、速度、縮放在起終的關鍵影格設定好圖形的位置
在起終的關鍵影格中間按右鍵
,出現選單選擇建立“移動補間動畫”
在起終的關鍵影格中間按左鍵
,屬性欄位出現補間動畫選項,選擇 移動。可以再次編輯物件的旋轉、速 度、縮放、加減速等動態選項
1
2
當中間影格變成紫色且出現箭頭 即為完成移動動畫。
3
4
除錯當建立補間動畫失敗時,如圖 會出現虛線,此時請檢查步驟 是否執行錯誤或有遺失關鍵影 格的情形發生。
測試動畫 : 檢視動畫的最終匯出成果快捷鍵 : Ctrl + Enter
發佈設定
匯出檔案格式: SWF
編輯檔 :FLA 檔案 > 匯出 > 匯出影片選擇匯出位置
選擇匯出檔案類 型 > 存檔
匯出檔案格式: SWF
匯出檔案格式: AVI
Ctrl + N
開新檔案Ctrl + O 開啟舊檔
Ctrl + Shift + O 將檔案以元件庫形式開啟
Ctrl + W 關閉檔案
Ctrl + S 存檔
Ctrl + Shift + S 另存新檔
Ctrl + R 匯入音效檔或點陣圖檔
Ctrl + Alt + Shift + S 匯出影片或單張影像 Ctrl + Shift + F12 輸出影片設定
Shift + F12 輸出影片
Ctrl + P 列印
Ctrl + Q 離開 Flash
快捷鍵一覽
檔案的存取指令
Ctrl + Z
復原Ctrl + Y 重做
Ctrl + X 剪下
Ctrl + C 複製
Ctrl + V 貼上
Ctrl + Shift + V 貼在原位置上
Ctrl + D 再製一個圖形
Ctrl + A 全部選取
Ctrl + Shift + A 取消全部的選取
Ctrl + Alt + X 剪下影格內容
Ctrl + Alt + C 複製影格內容
Ctrl + Alt + V 貼上影格內容
Alt+ Backspace 清除影格內容
Ctrl + Alt + A 選擇所有影格內容
Ctrl + E 編輯
編輯指令
Home
回到第一個影格Page Up 到前一個影格
Page Down 到後一個影格
End 到最後一個影格
Ctrl + 1 用 100% 的比例顯示畫面
Ctrl + Alt + T 顯示 / 隱藏時間軸面板 Ctrl + Shift + W 將工作區域放到最大範圍 Ctrl + Shift + / 吸附 ( 貼齊 ) 至物件
Ctrl + Alt + H 顯示漸變控制提示點
Ctrl + H 顯示 / 隱藏邊界
F4 顯示 / 隱藏畫面上的面板
檢視指令
F8
將選取的物件轉換成元件Ctrl + F8 新增元件
F5 插入影格
Shift + F5 移除影格
F6 插入關鍵影格
F7 插入空白影格
Shift + F6 清除關鍵影格
Enter 播放目前場景的影片
Ctrl + Alt + R 回到第一影格
Ctrl + Enter 測試影片
Ctrl + Shift + Enter 影片除錯模式 Ctrl + Alt + Enter 測試場景
Ctrl + Alt + B 在場景中直接測試按鈕元件
功能
插入指令
Ctrl + U
開啟偏好設定視窗Ctrl + J 開啟文件屬性設定視窗
Ctrl + F2 顯示 / 隱藏工具面板
Ctrl + Alt + T 顯示 / 隱藏時間軸面板
Ctrl + F3 顯示 / 隱藏屬性面板
Ctrl + K 顯示 / 隱藏混色器面板
Shift + F9 顯示 / 隱藏混色器面板
Ctrl+ F9 顯示 / 隱藏顏色色票面板
Ctrl + I 顯示 / 隱藏資訊面板
Shift + F2 顯示 / 隱藏場景面板
Ctrl + T 顯示 / 隱藏變形面板
F9 顯示 / 隱藏 Actions 面板
Shift + F4 顯示 / 隱藏除錯面板
Alt + F3 顯示 / 隱藏影片結構檢視器
Shift + F1 面板 顯示 / 隱藏 Actions 參考資 Ctrl + F7 訊面板 顯示 / 隱藏組件面板
Alt + F7 顯示 / 隱藏組件參數面板
Alt + F1 顯示 / 隱藏 Flash 解答面板
啟動面板指令
F1
線上說明視窗Ctrl + B 分散到圖層
Ctrl + Shift +D 打散
Ctrl + G 群組
Ctrl + Shift +G 取消群組
Ctrl + Shift +
上將物件移到最前面
Ctrl +
上將物件向前移動一層
Ctrl +
下將物件向後移動一層
Ctrl + Shift +
下將物件移動到最後面
其它重要指令