パーティクルエフェクト作成ツール Timeline FX 使ってみた


こういうのがつくれる
![TPEditor.png](https://qiita-image-store.s3.amazonaws.com/0/20773/7f3d053d-2faf-0f2a-8cb7-f4424dfc769c.png "TPEditor.png")


パーティクルのもとになる画像を用意して、色や速度などを時間とともに変化させるパラメータを設定するのが基本的な作り方。 案件で使ってみて、けっこういい感じのエフェクトがさくっと作れるのだけど、使い方がちょっとわかりにくいのと日本語記事がほとんどない。

http://www.rigzsoft.co.uk/timelinefx-particle-effects-editor/

* 作成したエフェクトは連番画像で書き出せる
* Free版のエフェクトの制作は制限はない
* ただし、Free版の書き出しは先頭の4フレームのみ
* 購入時だいたい5000円くらい

既存ライブラリが豊富でとくに爆発系は非常にクオリティがたかい。サイトで配布されているライブラリは「Plenty of effects libraries freely availble!」といってるので、改変可能なようだけど商用は別途確認したほうが無難かもしれない。


##作成手順
Edit メニューから Add Effect を選ぶ
![add-effect.png](https://qiita-image-store.s3.amazonaws.com/0/20773/6704a7ed-5d8a-1565-75d6-f8d680544af5.png "add-effect.png")

ライブラリペインにできた New Effect を右クリックして Add Emitter
![add-emitter.png](https://qiita-image-store.s3.amazonaws.com/0/20773/67de2256-4039-c4a3-02e8-cd3fc24add70.png "add-emitter.png")


Photoshopでなんかもやもやしたものをつくって、
![スクリーンショット 2014-01-17 13.36.04.png](https://qiita-image-store.s3.amazonaws.com/0/20773/e12f9335-2317-8f54-b9b1-724cea2d0caa.png "スクリーンショット 2014-01-17 13.36.04.png")

Shapes に追加 
![add-shape.png](https://qiita-image-store.s3.amazonaws.com/0/20773/556eb550-ede6-759c-9f7c-38c1af74f4e8.png "add-shape.png")

追加した画像を右クリックして「 Assign Shapes 」で割り当てる 
![assign-shape.png](https://qiita-image-store.s3.amazonaws.com/0/20773/9fc22256-dc6c-c8be-a341-34303bb46376.png "assign-shape.png")


パーティクルタブはこんな感じに設定してみる
![particle.png](https://qiita-image-store.s3.amazonaws.com/0/20773/88451e8e-9e60-f8cc-e1cf-369eca0f0bb5.png "particle.png")


さらにエミッターの色や速度などを変えていく。
設定できる値がおおい。weight とかどう影響がでるのかちょっとまだ分かってない

##Attributes - 属性パネル
Effect や Emitter に対して設定できる
![スクリーンショット 2014-01-17 11.43.03.png](https://qiita-image-store.s3.amazonaws.com/0/20773/f43654f8-519c-a7b2-1cb5-a43a89c0af7a.png "スクリーンショット 2014-01-17 11.43.03.png")
挙動を制御するには、Attributes のグラフを調整する
グラフ線上をクリックするとアンカーがふやせる。右クリック「Reset Graph」でデフォルトに戻せる。

**Base Attributes（青色のアイコン）**
　X軸は効果を持続させる時間
　Y軸は効果の強度？

* Life パーティクルの生存時間をミリ秒で指定
* Amount 秒毎のパーティクル生成量
* Sizr エミッターの大きさ？
* Velocity Y軸がピクセル単位の移動速度示す
* Spin 回転させる。正と負で回転の方向を示す
* Weight 重さ？


**Variation Attributes（オレンジのアイコン）**
　パーティクルのバラ付きを制御

* Life Variation 生存時間にバラ付きをだす
* Amout Variation パーティクルの生成量にバラ付きをだす
* Size Variation 基本サイズにバラ付きをだす
* Velocity Variation パーティクルの速度にバラ付きをだす
* Spin Variation 回転にバラ付きをだす
* Weight Variation 重さにバリエーションをだす
* Motion Randomness 移動、速度に影響を与える？

**Overtime Attibutes（紫のアイコン）**
　設定された生存時間内での変動を制御する
　Y軸は Base Attributes、Variation Attributes に設定されたベース値のパーセンテージを表す

* Alpha Overtime アルファ値を制御する。ベース値は不要
* Size Overtime ベースサイズをスケーリングする
* Velocity Overtime ベース速度をスケーリングする
* Spin Overtime 回転する速度をスケーリングする
* Weight Overtime ベースの重さをスケーリング
* Direction Overtime 生存時間内で移動する方向を制御する
* Motion Randomness Overtime モーションランダムをスケーリングする
* Stretch パーティクルをひきのばす（StarBurst.eff が参考になるらしい
* Frame Rate アニメーションのFPSを制御？
* Velocity Adjuster すべてのパーティクルの速度をスケーリングする


##試しにAttributesを設定してみる

Life [1]
![life.png](https://qiita-image-store.s3.amazonaws.com/0/20773/0462ea29-cb0a-6db7-582c-6e1ad7710ff9.png "life.png")

Amount [160]
![amount.png](https://qiita-image-store.s3.amazonaws.com/0/20773/b4f47889-779f-bd63-30e4-9cd8a529a5cc.png "amount.png")

Size [220]
![size.png](https://qiita-image-store.s3.amazonaws.com/0/20773/adc731e2-4ef6-ad48-cf09-691d4249d50d.png "size.png")

Alpha Overtime [0 → 0.4 →0]
![alpha.png](https://qiita-image-store.s3.amazonaws.com/0/20773/2ab8c0a3-ba78-7d87-7bea-defd1f3b6884.png "alpha.png")

Sizr Overtime [0.8 → 0]
![size.png](https://qiita-image-store.s3.amazonaws.com/0/20773/298712b2-955a-2a51-3a90-f5ae854f8e05.png "size.png")

こうなった
![スクリーンショット 2014-01-17 13.26.27.png](https://qiita-image-store.s3.amazonaws.com/0/20773/f348507d-ad77-14df-df38-4657fd41c70a.png "スクリーンショット 2014-01-17 13.26.27.png")

https://www.youtube.com/watch?v=oSnNC8M3OaY