之前有答應過要做一篇"如何製作小動畫"來跟大家分享的...今天就來野人獻曝一下囉...
因為這只是用非常簡單的方式來製作簡單的小動畫...還稱不上是教學啦...總之希望可以對一些朋友有幫助囉^O^
準備的軟體只要PHOTOSHOP就行了...至於版本...應該六以上都可吧...因為我沒有用過六以下的版本啦:P



GIF小動畫製作的步驟如下(本篇以已會使用基本PHOTOSHOP功能者為主要分享對象,若有問題可以再問我喔):

1.開啟PHOTOSHOP,將你所要做的動畫圖片分層放入同一個檔案的不同圖層中,要做幾層,依照你所想要的動畫效果而定,例如,你想要紅色圓形與綠色圓形交錯出現的動畫,那你就要就要有綠色及紅色兩個圖層喔!
範例:
我這個例子是希望JIN*S出現一閃一閃完,再出現WEB一閃一閃的動畫效果,
所以我要準備四個圖層,分別為:「JIN*S-深色圖層」.「JIN*S-淺色圖層」.「WEB-深色圖層」.「WEB-淺色圖層」
利用同一個圖案...但一深一淺的顏色交換來做出一閃一閃的效果...如下圖:




2.做好各圖層後,先存成PSD檔,再按下紅色框框圈起來的地方,進入PHOTOSHOP內建的動畫軟體ImageReady!
範例:



3.進入ImageReady時,出現的畫面大致如下,會有跟剛剛那張PSD檔一樣的圖層Layers視窗,及動畫影格Animation視窗,若沒有,請到視窗Window工具列中找到後打勾。
範例:



4.在Animation視窗右上角有一個三角形,按右鍵 > 新增影格New Frame,看你需要幾個就先新增幾格。
範例:我只需要四個影格,所以我就新增四個。



5.在Animation視窗中的每一個影格上按一下,選取你要顯示的圖層。
範例:我這的動畫顯示的圖層順序為「第一格:JIN*S-淺色圖層」>「第二格:JIN*S-深色圖層」> 「第三格:WEB-淺色圖層」>「第四格:WEB-深色圖層」,依序調整每個影格所見的圖層。這裡我還希望每一個影個除了顯示字外都會顯示白色底圖,所以你可以看到我都是選取兩個圖層喔。



6.設定Animation中每一個影格所要顯示的秒數,設定完可按Animation視窗最下一排中的PLAY播放看看。
範例:若每個影個要一樣秒數,可以將影格全選再一起挑整秒數喔。



7.PLAY播放沒問題後,就是儲存啦,檔案File >  另存最佳化為Save Optimized As  >  打上檔名,檔案類型為gif....就OK囉。
範例完成品:




JIN這個簡單的分享...希望對想做小動畫的入門新人有所幫助...
當然太複雜的動畫JIN就不建議用這個軟體做了...

大家可以試試看囉!
下面附上JIN之前有發表過的GIF圖給各位參考唷:


上面這張這是用兩個圖層而已喔,一張是還沒被打到的圖,一張是被打到的圖,兩個影格重複播放的效果!



上面這張是用3個圖層,4個不同秒數的影格所重複播放的效果喔!


上面這張則是用17個圖層,17個不同秒數的影格所重複播放的效果喔!
不過後來我發現用FLASH做比較漂亮...呵呵:P







 

arrow
arrow
    全站熱搜

    JIN 發表在 痞客邦 留言(11) 人氣()