illustrator 與 Flash 結合

   
本文章將同時間發表於"創意檔案"雜誌  Renyii 2004/10/29
   
   
    資料來源 www.illustrator-fly.com    
         
     
     
     
     
     
 

隨同網路世界的知識開啟,又一道提取知識的大門被創造了,就是這敲著會發出聲響的鍵盤加上發光體般的電腦螢幕,讓多少的人沉醉其中。

從電腦世界中得來之資訊,如同妨間出版書本一樣都是須要被製作,不同的是--當媒體由紙稿走入數位影音後,思考的層面不斷的在拓展,眼球的可視區塊已不再是四方型體的書本,對於學習而言,人們更是超乎於靜態的閱讀,連同被附予動態教學之有聲CD或電子書本,都是獲取訊息的管道,這也是身為電腦繪圖創作一份子的筆者,汲汲於平面創作及動畫編輯的原因。

 
     
     
     
 
 
     
     
     
 

電腦動畫製作


動畫-是能令學習插畫者再有興趣不過的一件事了,然而了解繪圖的技巧及製作的幕後,腦海出現的記憶郤又是一幕幕苦難煎熬的夜晚,當不喜歡於呼吸晚上的空氣,郤又要生存於夜晚時,說明的是從事繪圖創作的過程,就是堅持。

電腦動畫的製作、過程、手法,可供選擇的資源可說是相當豐富,包含出現於市面之電腦製作軟體也是有多種選擇,但如果我們談談常出現於網路動畫中之格式規格(如GIF、SWF、SVG),或所謂的網頁灠軟體支援格式(提供如GIF、SWF、SVG格式被支援及安裝),或許讀者對於製作軟體的認識似乎就能更明確一點。

筆者所介紹之範例,即為如上所述(有格式上的支援),在平面設計及動畫編輯中同處於重要角色之Illustrator CS以及Flash MX軟體,來製作出SWF格式之動畫作品。

 

繪製向量動畫元件


Illustrator是向量繪圖軟體,對於習慣於鉛筆繪圖的創作者而言,如今要其改握滑鼠,敲敲點點並於桌面來回移動繪圖,會有一段時間的不習慣,但這對於習慣於向量繪圖(貝滋曲線)者而言,郤是再也習慣不過的事了,由於向量軟體是以貝滋曲線原理繪圖,其關鍵技術由畫面中之多數錨點(X座標、Y座標)程式所計算定義出之曲線,取代了人類靈活手部肢體動作的自由曲線,使得原本須要一氣呵成之曲線,取而代之的是得以不斷修改及取代的可變曲線,於是可變性以及修改性也成為了做為Flash最適合的來源元件。這也是Illustrator搭配Flash軟體使用製作動畫是極為適合的原因。

在本範例中小笨馬的物件多數以漸層網格繪製完成,漸層網格繪圖的好處於得以利用對於錨點及向量的精細微調,使其物件產生多色變化之光影明暗,此一繪圖方式可呈現極佳立體效果,而繪製的風格亦可依創作之要求呈現連續不規則之立體面;而少數的繪製則”多色放射漸層”方式上色繪製,但不論以何種方式繪製,在繪製時皆需同時考慮到如何配合動畫編輯軟體的使用(例如:關鍵元件需單一繪製)。

 

 
     
     
     
 
 
     
     
     
 

動態影片編輯


Flash MX是時下相當流行的動畫軟體,對於網頁互動及動態影像編輯極為方便,筆者在Illustrator所完成之物件,經由儲存成EPS格式後,在Flash軟體中以置入之方式可以將其物件完全一一分解成動畫元件使用。另外如有轉換成點陣圖檔進入Flash軟體的需要,可以直接在Illustrator軟體中以”儲存成網頁”指令直接以JPG檔或GIF檔輸出轉存成最佳化圖檔(在此指適合網頁使用之72DPI且適合螢幕顯示之解析效果),對於此一類以向量轉點陣之轉換,已可以由Illustrator軟體內建指令自行輸出,無須透過Photoshop。另外對於元件的編輯上,筆者多次的使用”元件庫”內(快速:鍵CTRL+L)之”影片片段”做為編輯的元件,例如:”眼睛”可以開閉之動作,使其成為單一影片片段元件,然後再將”眼睛”加上”馬臉”再次成為一影片片段命名為”臉部動作”,之後又將”臉部動作”加上馬身體成為另一影片片段,如此不斷的集結有如群組般的關係,而每一動作均可追根朔源的回到影片中再次修改,而最後再將最後集結之影片片段放置於場景中使用。

 
     
     
     
 
 
     
     
     
     
     
     
     
 
 
     
     
     
 

製作成螢幕保護程式


當筆者將影片發佈成.SWF檔後,接下來筆者利用螢保謢程式之製作程式將此一動態小笨馬製作成自解安裝程式,此一範例程可以至網址http://www.illustrator-fly.com下載處找到連結下載點,即下載Stardust Screen Saver Toolkit 2004 TE 10天之試用版,使用該程式時,您只要選擇好由Flash發佈完成之.SWF檔,並為該螢幕保謢影片設定”名稱”,接下來隨著”下一步”指示說明設定,即可完成一”自解安裝程式”E,此螢幕保謢軟體所製作之保護程式簡單易使用。本範例的名稱為”(小笨馬)PONY”,故只要使用者點選該程式安裝,當長時間不使用電腦時,小笨馬螢幕保謢程即會自行播放了F,您如對本文章之影片呈現或該保護程式有興趣,歡迎您至網址 http://www.illustrator-fly.com/illustrator_2004/download/index.php”下載處”找到連結下載點,並下載。