低調の美國生活

各種疑難雜症

快速將影片轉成Unity Particle可用的連續貼圖(Texture Sheet Animation)

x852
5月20日2015年

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation10

會分享這個是因為以前每次要製作連續圖檔用在Unity Particle都要傻傻的在photoshop一張一張對位貼上,2×2, 4×4還好,但遇到8×8就眼花了,因為前年開始用到NGUI才想到這個方式,另外,有時候有些火啊煙的,如果要做出比較有動態的(more organic),光靠單張貼圖疊啊疊的,可能疊到遊戲都上架了還弄不出來,這時就需要Texture Sheet / Sprite Sheet的輔助了

此外,要使用Unity Particle Texture Animation時,每個貼圖只能是方形square的,如64×64,128×128

這篇文章主要目的為快速做出可用的連續圖檔(Texture Sheet / Sprite Sheet),主要有以下重點:

  • 準備影片素材,2-3秒就可
  • 用Quick Time 7 將影片輸出成連續圖片
  • 在Photoshop用Action功能一次大量,快速修圖
  • 用免費正版工具Zwoptext產生所要的Texture Sheet / Sprite Sheet

現在就來看看如何轉換吧

首先準備好一段素材影片如下,最好是全黑背景,這樣到時直接用additive shader不用去背

然後用QuickTime Player7將影片輸出成連續圖檔

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation1

按下option並選擇要輸出的格數,FPS=30 表示每秒30張圖,但效果也越順,看情況取捨

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation2

將連續圖檔算好在Photoshop轉成square圖檔,

  • 個人習慣是轉成power of two的格式,如128×128, 256×256
  • 此例是轉成128×128,之後組成1024大圖
  • 在Photoshop使用Action功能快速統一編輯並儲存
create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation4

建立你要的action

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation6

然後對每張圖播放就好

接下來是重點,打開Zwoptex工具 (這邊下載Zwoptex.app,我這個是正式舊版for mac,免費,很好用)

  • 將改好的128×128連續圖檔全部拖進去
  • 重要:完全按照下圖設定,不然無法按正確順序排圖
  • 按下Layout就可以

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation7

Publish設定

create-a-quick-sprite-sheet-fro-unity-particle-texture-hit-animation8

我們只要PNG圖檔,存哪都可以

最後Publish成一張png圖檔

FXFireSprite

另外,如果想省圖的話,也可以用NGUI Sprite Animation製作,這篇有寫

如果有其他問題歡迎到我FB留言討論:https://www.facebook.com/zombiewalkerss


發佈於 5月20日2015年