給我的女兒,咪咪 (2014-01-30)

咪咪,妳一定要放心的走, 下輩子生在好人家,有緣再相遇!

當妳的主人很幸福,謝謝妳十三年來陪伴我走過每一天,不管喜怒哀樂,只要想到妳在身邊就很欣慰,

現在妳離開我身邊,也許已快修成正果,不用再當畜牲,我為妳莫大的福報感到開心,

真的很謝謝妳的陪伴,妳知道我很愛妳,我更希望妳走了之後過的快樂,

跟著佛祖的光走,跟著佛祖修行或是投胎為人,

切記,不要有掛礙,我也會好好生活,再次要跟妳說:

咪咪,我愛妳及謝謝妳。

DSC_0006  

咪咪 (2001-2014)

製作外框,Reko給它歸類為初級到中級的階段 XD
所以在學製作外框之前,你要對動圖製作有基本的認識。

(動圖製作基礎篇我在原創區有發過,親可以去參考看看。)

Reko製作動圖的流程不是那麼標準,因為是自己摸出來的
所以有錯誤的地方或是更快速的方法,麻煩知道的親指正囉~ ^__^

☆首先要準備的工具:
1. 可以繪製邊框的繪圖軟體 (某R我習慣用Photo Impact 做外框)
2. Ulead GIF Animator 5
3. Image Ready (俗稱的IR)

如果這些工具都準備好了,那麼我們就來開始做外框囉!
教程非常長,請確定你有耐心看完教程,再做回覆囉! ^^


我們以在中演唱Maze的這張小動圖來做示範 (不要笑他一直重複抖來抖去~只是範例圖咩! XD)

(影片擷取及處理請參閱基礎篇)


★Step.1 繪製外框
1.打開繪圖軟體來做底圖
我開了一個300 x 200的檔案當底圖。

(底圖依親的喜好設計,不一定要跟某R一樣^^)


2.再來就是繪製內框了,這個內框就是我們要放動圖的地方!
我習慣用[路徑繪圖工具]來製作內框。



3.範例圖選了圓角矩形當做內框,這裡可以依親的喜好來選擇內框造型。
還有一點要注意,內框顏色絕對不能跟底圖太接近!
因為接下來要套到Ulead GIF Animator 5用魔術棒去除內框,
如果內框顏色跟底圖太過於接近,就會套不出想要的形狀喔!
這就是用Ulead GIF Animator 5做框的缺點 ^^"


4.然後再做一些編修美化的動作,把檔案存成PNG比較不會失真。


★Step.2 製作外框
1.打開 Ulead GIF Animator 5,開起舊檔,把剛剛做好的底圖外框叫出來。
並請點選[編輯]狀態



2.加入畫格



3.點選第一個畫格,在主畫面按[右鍵],[新增空白對象]



4.點選左邊工具列的[選擇區工具-魔棒]
我習慣將相似性調成(32),已連線像素打勾 (範例圖是0 = =  不好意思)



5.按[左鍵]點選內框,再選擇[複製對象]



6.再點選[選擇工具]
然後再去拖曳沒被魔棒選擇到的外框一下。
請記住,拖曳一下就好,不然不能復原就好笑了 =_=
這個動作是要讓系統確認我們魔術棒選到的是內框。


之後再按復原鍵復原 (或是Ctrl + Z)


7.請點選第2個畫格,按[複製對象]



8.然後再按一下[Delete]鍵
神奇的事發生了~ 透明內框出現了唷~ (灑花)


9.再來把第一個畫格給刪除掉,然後我們把做好的框另存新檔
請記得要存成gif檔喔!
這樣外框就完成了~ ^^



★Step3.裁剪畫布,調整圖像大小
1.這時候要知道內框的尺寸是幾X幾,才知道要裁減什麼大小的圖像。
利用PI的[變型工具]就可以知道內框大概是幾X幾了。
首先請利用[標準選取工具]將內框選取並按[右鍵]進行[複製]。



2.然後按Ctrl+Shift+V 貼成新影像。
之後再點選[變型工具],請看上排工具列,就會顯示圖的尺寸了。



3.範例圖內框為121x132像素,
所以知道我們要擷的動圖尺寸必須大於121x132像素
這時候開啟Ulead GIF Animator 5,開啟擷好的動圖調整尺寸
由於我的外框是做圓角矩形的,所以旁邊空白的部分可以不需要了。
請把所有動圖給選取起來,之後點選[選擇區工具 - 矩形]。



4.之後選取我們要的部分,按Ctrl+R (裁剪畫布)



5.確定是我們要的範圍,然後再按Alt + E 再按 Z
叫出[調整圖像大小]編輯視窗
因為我們內框是121x132像素
所以我們要將圖片調整成大於121X132一點點的像素
不過剛剛選取內框時我有多選到外面的底圖
所以這裡我把它調整成120X130,保持外觀請不要打勾。



6.之後將圖片另存成GIF檔案就可以進行下一步了。



★Step4.將動畫及外框合成
1.請打開你的Image Ready (以下簡稱IR)

2.開啟舊檔,將做好的底圖外框以及剛擷好的動圖叫出來

3.點選動圖,把所有圖層選起來,按住左鍵不放,拖曳到叫出來的底圖外框上。
  


4.請將底圖外框按住左鍵不放拖曳到最上面一層,就可以蓋住動圖突出的部分。



5.除了底圖外框,把所有的動畫圖層選起來,這樣才可以一起移動動圖位置。


6.這時候回到圖層1,並且對照動畫格1
把圖層1的眼睛點上去 (按左鍵點圖層旁邊的空格就會出現眼睛)


7.這時在動畫工作視窗點選[複製目前影格]



8.然後再點選第2個圖層,把眼睛點上去



9.接下來以此類推,這張動圖有10個圖層,等於要複製10張圖,點10次眼睛
記住,要依順序複製圖層,點上眼睛
(不能一次複製一堆然後再一次點完10個喔~ = ="這樣圖片就不會動了)


10.好了之後把動畫工作視窗左下角的迴圈設為[永遠]
秒數設為[0.1秒]





11.然後依個人喜好做一些美化就可以另存新檔了
另存最佳化檔案,按Ctrl + Shift + Alt + S
這樣動圖就完成了。



這就是最後的完成品~  (在做外框時因為相似度調成0,所以框框有點小瑕疵。建議調成32唷!)





做教學真的很辛苦,希望大家不要盜用Reko的教學喔~ ^^ 拜託了~

Reko 發表在 痞客邦 PIXNET 留言(2) 人氣()


留言列表 (2)

發表留言
  • sammi841207
  • 恩謝謝版主辛苦分享唷
    不過可以問一下嗎
    最後的步驟Image Ready
    除了這個有沒有其他的呢?
    因為一直找不到這個得載點
  • 訪客
  • 請問為什麼我做出來之後
    顏色變了= =
    不是原圖的顏色QQ