ParagonのVFXデータを解析してみる　ー その２ ー

# **ParagonのVFXデータを解析してみる　ー その２ ー**
今回はこちらのＶＦＸの中身を見ていきたいと思います。
ツイートのほうにも書きましたがほぼ一個のメッシュで全て表現しており、
ほとんどマテリアルだけで完結しています。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">引き続きParagon VFX観察。これほとんど１マテリアル、１メッシュでやってる。連番とかは使ってない。 <a href="https://t.co/67YPZazOHN">pic.twitter.com/67YPZazOHN</a></p>&mdash; AKI(Flypot代表) (@frontakk) <a href="https://twitter.com/frontakk/status/985529822834118656?ref_src=twsrc%5Etfw">2018年4月15日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


一個のマテリアル内で初速の発光からその後のトレイル部分の終息まで作りこんでおり
とても勉強になります。

今回のエフェクトはこちらのメカさんのアセット内にある
**P_Crunch_Hook_3D_Trail**というエフェクトになります。
そのエフェクトで使用されている**M_Crunch_Hook_3D_Trail_V02**というマテリアルを見ていきたいと思います。

![Image 156.png](https://qiita-image-store.s3.amazonaws.com/0/246816/1c34a22c-a50d-21a6-d171-b64da5b216d7.png)

まずは全体図から。
そこそこ複雑そうですが、いろいろやってる割には簡素かも、といった印象。

![Image 157.png](https://qiita-image-store.s3.amazonaws.com/0/246816/cf85962f-fca1-3c92-80d7-00db19fb0af5.png)

よく見るとグラフの右上のほうに注釈があったんですが、どうもこれを見るに**Particle Color**を
色の設定用途としてではなく**Dynamic Parameter**の代わりとして使ってるっぽいです、面白いですなー。
（確かに**Dynamic Parameter４つじゃ足りないよー**、という状況はままある）
こういう風に書いてくれてるの非常に親切で助かる。

![Image 158.png](https://qiita-image-store.s3.amazonaws.com/0/246816/6c54c450-e69f-b886-4273-8cce58b11856.png)

とりあえずグラフ全体の左半分を上から順に見ていきたいと思います。
まずは一番上のTL - Black Trailから見ていきます。
メモ書きのとおりトレイルの黒部分っぽいですね。**Particle Color**の青出力からラインが出てますが、
先ほどの右上の注釈を見るとPower for the Black Trail's Opacityと書かれているので
ここでOpacityを制御してるっぽいですね。①のノードのプレビューも載せておきます。

![Image 164.png](https://qiita-image-store.s3.amazonaws.com/0/246816/fd9d21e5-0cfa-3334-b9ad-82c9bec41b4b.png)
![Honeycam 2018-04-17 22-08-23.gif](https://qiita-image-store.s3.amazonaws.com/0/246816/c987861f-2ec5-4c59-e08a-623cfaa4e56a.gif)

**Particle Color**の青出力が**Power**につながっているので実際には下のように
グレースケールのグラデーションを操作するようになっています。

![Honeycam 2018-04-17 22-17-21.gif](https://qiita-image-store.s3.amazonaws.com/0/246816/6f0b6942-25aa-08e4-7d50-a531052e4a26.gif)

ちなみにcascadeのScale Color / Lifeモジュールの青チャンネルには
このようなアニメーションが入っています。

![Image 165.png](https://qiita-image-store.s3.amazonaws.com/0/246816/46f52a60-3b5d-6dea-d413-91e3c5896040.png)


次に中段のTL - Orange Trailを見ていきます。トレイルのメイン部分ですね。
多分先ほどとやってることは一緒ですね、①のプレビューを見るとフラクタルが
三枚重ねなので複雑になってるだけだと思います。
Dynamic Parameterの青出力から先ほどと同じようにグラデーションをアニメーションで調整しています。

![Image 166.png](https://qiita-image-store.s3.amazonaws.com/0/246816/443fea23-c795-5a1b-821f-354c8ad647d7.png)

何というか豪勢な作りだなあ、コンシューマだと普通なんだろうか？
![Honeycam 2018-04-17 22-33-08.gif](https://qiita-image-store.s3.amazonaws.com/0/246816/97b421ec-8574-0143-db85-0dfa9f264b91.gif)

次に下段のHL - Highlightを見ていきます。技の初めの移動する発光部分ですね。
**Dynamic Parameter**で制御している点は同じですが、こちらは**Power**ではなく**Add**を
使用しているのでＵＶ座標をパラメータでスライドさせてるだけだと思います。
また中段で作ったフラクタルをディストーション（歪み）素材として使用していますね。
①のプレビューも載せておきます。

![Image 167.png](https://qiita-image-store.s3.amazonaws.com/0/246816/9e8d422d-0449-cb16-68e5-43b3c08ff570.png)
![Honeycam 2018-04-17 22-58-25.gif](https://qiita-image-store.s3.amazonaws.com/0/246816/d0e2b102-b30a-9670-b7e2-f4f8812b7552.gif)

これで左半分が終了です。これらの素材を右半分で合成しているかんじですかね。
右半分も解説しようと思ってたんですが疲れてきたので要所要所だけ紹介していきたいと思います。

あまり本筋とは関係ないんですがマスクの作り方が面白かったので紹介。
**Sphere Mask**で下画像のようなマスクを作成しています。通常は円形のマスクを作るノードなんですが
**TexCorrd**のUTilingを０に設定すると、横方向に無限に引き伸ばされてこのような結果になります。
Ｂ入力のところの値を調整すれば白部分の太さを変えることもできます。

![Image 168.png](https://qiita-image-store.s3.amazonaws.com/0/246816/17fb0f9b-aa2e-835e-3869-4e0c86a2ef93.png)

あとはRefractionの適用範囲を**Fresnel**を使って作ってました。
**Lerp**で範囲を反転して**Power**で調整。

![Image 169.png](https://qiita-image-store.s3.amazonaws.com/0/246816/b03dd1ad-3299-ac9f-68ae-1cc417502d35.png)
![Honeycam 2018-04-17 23-35-54.gif](https://qiita-image-store.s3.amazonaws.com/0/246816/a091b2b9-b52d-8009-fef9-02f458a01285.gif)

すいません、肝心の合成部分はあんまり触れなかったのですがこの辺で・・・。