1 / 21

Flash 簡介

Flash 簡介. 鄧姚文. 教材與參考書. 李篤易 ( 2012 ), 大師級 ! Flash 遊戲設計創意發想與經典入門, 碁峰資訊股份有限公司, ISBN 9789862765333 (書號 AEG000700 ) 趙英傑 ( 2011 ), ACA 國際認證 -- Flash CS5 數位媒體設計與網站動畫, 碁峰資訊股份有限公司, ISBN 9789862763513 (書號 AER035331 )

Download Presentation

Flash 簡介

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Flash 簡介 鄧姚文

  2. 教材與參考書 李篤易 (2012), 大師級! Flash遊戲設計創意發想與經典入門, 碁峰資訊股份有限公司, ISBN 9789862765333 (書號 AEG000700) 趙英傑 (2011), ACA 國際認證 -- Flash CS5 數位媒體設計與網站動畫, 碁峰資訊股份有限公司, ISBN 9789862763513 (書號 AER035331) 張仁川 (2010), Flash CS5創意動畫設計白皮書, 碁峰資訊股份有限公司, ISBN 9789861819969 (書號 AEU009200) 羅智軒 (2011), Flash & ActionScript 3.0 絕對出色影音動畫與互動媒體設計, 碁峰資訊股份有限公司, ISBN 9789862762615 (書號 AEU009900)

  3. 動畫概念 • 動畫的原理 • 動畫和電影相同,以每秒24 格的速度播放靜態的內容,由於「視覺暫留」現象,所以看到會動的影像。

  4. 開發工作流程 • 建立 Flash • Adobe Flash Professional 編輯器 • 發布(Publish) • 產生 HTML 檔案 和 Flash 影片 • 佈署 • 將發布的成品放到網站伺服器上

  5. Creative Suite 整合 • 整合 Adobe Creative Suite 系列軟體 • Photoshop、Illustrator、Dreamweaver、Fireworks • 提高工作的生產力。 • 以 Flash Builder 當作 ActionScript的主要編輯器,處理 Flash 文件。

  6. Flash 檔案型態 • FLA 檔案 • 主要工作檔 • SWF 檔案 • Flash 影片 • FLV、F4V 檔案 • 供 Flash Player 播放的影片檔 • AS 檔案 • ActionScript程式檔

  7. XML 架構的 FLA 來源檔案(XFL)

  8. Flash CS5 工作區

  9. 舞台(Stage) 舞台是建立動畫時放置內容的矩形區域,也就是Flash 播放器顯示的範圍。

  10. 新增文件後,執行「修改- 文件」指令,可以設定文件的屬性。

  11. 尺寸:設定舞台的寬高尺寸,使用單位為像素。尺寸:設定舞台的寬高尺寸,使用單位為像素。 • 尺規單位:設定尺規使用的單位。 • 符合:設定舞台大小選項: • 印表機:舞台大小符合印表機的列印尺寸。 • 內容:舞台大小符合所有的內容。 • 預設:舞台大小使用預設值500X400 像素。 • 背景顏色:設定舞台的背景顏色,請按顏色挑選器選取顏色。 • 影格速率:設定每秒要顯示的影格數目,預設值為24 FPS。 • 變更舞台的縮放比率,舞台的縮放比率範圍 8~2000%。 • 使用[ 縮放] 工具,放大或縮小舞台顯示比例。 • 使用[ 縮放] 工具,拖曳矩形選取範圍,將矩形區域放大。 • 使用[ 手掌] 工具,拖曳滑鼠指標,上下左右移動舞台。

  12. 工具面板

  13. 時間軸面板 時間軸會隨時間使用圖層 與影格 控制動畫的內容,在播放磁頭 會顯示目前的影格位置。 • 影格:Flash 將時間長度分成多個影格。 • 圖層:就像多張底片相疊,每個圖層包含出現在舞台上的不同內容。

  14. 建立動畫後,時間軸面板會顯示影格和動畫類型,說明如下:建立動畫後,時間軸面板會顯示影格和動畫類型,說明如下: 動作影格:影格加入ActionScript,影格會顯示[a]。 影格標籤:影格加入標籤或註解,提供ActionScript使用或備註文字。 關鍵影格:可以在舞台放置物件的影格,加入關鍵影格請按 或 。 影格:延常關鍵影格內容的顯示時間,加入影格請按 。 逐格動畫:在每個相鄰影格放置不同的內容,這是最原始製作動畫的方式。 傳統補間動畫;使用二個關鍵影格,在關鍵影格改變元件的位置、大小和旋轉屬性或指定移動路徑,Flash 會自動建立關鍵影格之間的內容。 形狀補間動畫:使用二個關鍵影格,在關鍵影格改變或繪製形狀,使用形狀提示點,Flash 會自動建立關鍵影格之間的內容。 移動補間動畫:CS4/CS5 專用,拖曳路徑和元件,就可以建立補間動畫。 反向動畫:CS4/CS5 專用,使用骨塊工具將物件連結並建立動畫。

  15. 建立元件 • 元件的類型包含圖像、按鈕和影片片段: • 圖像元件:建立靜態影像或動畫片段,必須和主時間軸同步運作。互動式控制項及聲音無法作用於圖像元件。 • 影片片段元件:建立靜態影像或動畫片段,影片片段元件有單獨的時間軸。內容可以包含互動式控制項、聲音或其它影片片段。 • 按鈕元件:建立與滑鼠互動的按鈕,並指定動作給按鈕。 • 可以新增元件或將選取的內容轉換成元件: • 新增元件:執行「插入- 新增元件」指令,在元件編輯區繪製內容。 • 轉換成元件:在舞台選取內容,執行「編輯- 轉換成元件」指令,將選取的內容轉換成元件。

  16. 1.8.1 建立影片片段元件 以下說明如何建立影片片段元件。

  17. 練習:小熊集合 利用練習題素材裡的四張小熊圖片,練習時間軸的操作,讓小熊從舞台外移動至舞台中心靠攏

More Related