Flash 基本認識

 

版本:Flash 5 >Flash MX (6)>Flash MX 2004 (7) >Flash 8
   >Flash CS3> CS4> CS5

 

   ActionScript:1 > 2 > 3

 
Flash MX 2004  Flash CS4

國內代理
 上奇科技 www.grandtech.com.tw

國外原廠
 原為Macromedia,
 但已被 Adobe 併了http://www.adobe.com/

  • 出身:2D、向量、動畫

  • 壯大方向:語法、視訊

 

Flash 的三種檔案格式

  原始檔(FLA(可編修檔):編輯作業檔,須有 Flash 軟體
電影檔(SWF:嵌在網頁中者須為 SWF 檔
執行檔(EXE:使用者電腦無 Player 時亦可播放【例】帕海貝爾的D調卡農.exe (533 KB)
 
程式:
文件檔:

fla:
 

註:icon  依Flash 版本之不同而異
 

Flash 的播放

  單獨播放(SWFEXE
在瀏覽器裡播放(SWF
【問】如何知道使用中電腦瀏覽器 Flash 播放器的版本
   檢查校網大首頁:
http://www.shu.edu.tw/
 

Flash 基本觀念:多使用電影的隱喻

 

基本名詞

 

【說明】電影(Movie)
    舞台(Stage)、場景(Scene)、影格(Frame

 

劇本的編排處

  時間軸(Timeline
一般影格(Frame)、關鍵影格(Keyframe
 

Symbol/ Instance /Library

  元件(Symbol):本尊
實體(Instance):分身
元件庫(Library):元件的休息室
【範例】GG龍 ggl_button.swf (25 K)
       loading_1.swf (35 K)
【說明】重複使用元件的好處symbols.ppt ( 540 KB )
 

Flash 的動畫方式

  主要:Tween (漸變/補間)
   (之後詳見:Flash 的動畫產生方式)
 
 

 先練習看看...

 

【練習】結果檔:flying_locust.swf (49 KB)
    素材檔:0_locust.fla (15 KB) 主角
        leaves.jpg (45 KB) 背景圖、country_road.mp3 (2.9MB) 音樂

   最後請將 fla 檔儲存,並「檔案 > 發佈 (Publish)」 為 html 及 swf 檔
 ※ 註:"發佈" 是什麼?
 

Flash 的特色

  (1) 2D、向量、動畫
 fight.swf (1.34 MB)
     雨中漫步﹙785 KB﹚
 【比較】GIF 動畫(點陣式)或視訊檔
      啤酒廣告:Guinness (wmv, 2,006 KB)
     
GIF 動畫 電腦族自保大法
  (2) 重複使用元件(所以檔案小)
 【例】GG龍 ggl_button.swf (25 K)
        loading_1.swf (35 K)
  (3) 可互動(註Action Script
  -- 播放控制例:Play 鈕、Replay 鈕)
  -- 選單
  -- 遊戲程式
 】簡單互動:體操雞
 】較複雜互動:
     華文字句搜尋網 http://www.cbooks.org/main.asp
    世新《網路英語沉浸園》> 英文測驗遊戲
  (4) 可匯入多種其他多媒體素材例:點陣圖檔向量檔、聲音檔、影片檔等
 【例】點陣圖:(a) 我的野蠻女友 (七張照片組成一部動畫)
          episode2.fla (7,222 K )、episode2.swf (196 K )
        (b) 李蠢作品:fool_lee_ep01.swf (3,444 KB)
 視訊:Nike: See Lance Ride
 【例】 http://tw.youtube.com/
  (5-1) 能被多種軟體嵌入/匯入(網頁、Powerpoint、Director、Authorware...)
 
【說明】在其他軟體檔案裡內嵌 swf 檔
 【例】 goodbye_Celine_Dion.pps (2,112 KB)
     animator_vs_animation.doc (2,112 KB)
  (5-2) 方便與網頁整合(註檔案小、瀏覽器支援
  -- 動畫
  -- 選單
 
【例】世新首頁 ( 由兩個 SWF 檔串成:12
 Freddy vs. Jason (電影廣告)
    Dior  http://fashion.dior.com/dior.html
     永田萠 妖精の森美術 > 展示室 > 常設
      文建會兒童文化館 http://children.cca.gov.tw/children/ > 【繪本花園

 

 
(6) 作品的風格任君選擇
  從單純的動畫,到複雜的遊戲程式,發揮空間極大

 【範例】Flash 作品觀摩
 

※ 所以運用無限寬廣!
 

Flash運用

 
劇情片
 
NINJAI.swf (5,108 KB)、
MV 製作
 jessica.swf (977 KB)
教學設計
 
Flash 在教學上之應用範例
網站
 《例》太多了....
遊戲

 
救魚.exe (703 KB)
世新學生作品
 
 

如何下載網站上的 SWF 檔以供觀摩

 
  • 困擾:嵌在網頁裡的 swf 檔,無法按右鍵另存
  • 如何找到它

    【方法一】IE > 工具 > 網際網路選項 > 一般 > 「設定」按紐
          > 檢視檔案 >「Temporary Internet Files」資料夾

    【方法二】以 Win XP 為例
           C:\Documents and Settings\使用者帳號\
              Local Settings (隱藏) \Temporary Internet Files\

  • 找到後,拷貝至本機:
    (1) 一個檔時
    (2) 兩個以上的檔時:要維持原有連結關係
       請將主檔名後的  *(1).* 中的 (1) 刪掉
    (3) 很多檔時
    :維持原有資料夾架構
 
 

軟體比較動畫、互動... 等

 

向量 vs 點陣

    Flash 動畫 GG龍 loading_1.swf (35 K)
        fight.swf (1.34 MB,小小作品)
  Gif 動畫:GIF 動畫 (gif 89a)
  ※ 於 Flash ,向量結合點陣例子越來越多
 

Flash 與網頁

   Flash:時間軸 、按鈕(滑鼠滑過 Rollover)、Action
 Dreamweaver:時間軸 、滑鼠滑過 Rollover、Behavior
 Frontpage:動態 HTML 效果(網頁切換等)、Rollover
 

Flash Powerpoint 等

   
 

Flash 與專業的多媒體整合軟體

   例:Director
    :output 05 :output 05 (Director) 
    註:觀看此例會先引導至安裝 Shockwave Playe
 
     (參看說明:ReadMeFirst.txt
   Authorware
 

自我學習

  for 世新師生:http://tutor.shu.edu.tw/ 本校《私房敎師:金禾/上奇系列
   •
Flash CS3CS5
   •Flash 動畫大師逐格動畫精髓

原廠網站:Flash CS 3 http://www.adobe.com/support/documentation/tw/flash/
       Flash CS 5 http://help.adobe.com/zh_TW/flash/cs/using/

 

 

Flash 的線上說明 (Help)

  簡單:Lessons
詳細:Using Flash /Tutorials
較難:Samples(註:著重互動語法)

BACK   TOP

 

 

  【閱讀】Flash 5 線上教學
        02 Drawing、03 Symbols
        06 Buttons 、07 Sound 、08 Animation