niagara初見でも簡単に作れる立体魔法陣

###UE4で立体魔法陣を作ろう
12月になり、寒いというよりもはや風が刃のように鋭く、みかんを箱買いし、こたつむりになる季節がやってまいりました。そうだ、こたつでUE4しよう。
というわけで、エフェクト関係を触ったことがない初心者でも簡単に作れる魔法陣について書いていこうと思います。
今までアセットで買ったエフェクト置いたことがあるだけ！中身見たこともない＆見ても分らんかった！！という初心者向け共有記事となります。本人が初めて触って作ったものの作り方なので、効率的じゃないとかやり方が悪いとかあっても怒らないでください。
こんなんができます↓
![スクリーンショット (237).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/d5631d7e-6cce-8d59-99ce-38d49131e3c1.png)

動画↓
https://twitter.com/tukigaselio/status/1464806415696994306?s=20

環境：UE4.26.2　 blender2.91.2 

参考にしたもの
アセット: https://docs.unrealengine.com/marketplace/ja/product/stylized-wizard-skill-set-niagara-vfx
ブログ：https://argonauts.hatenablog.jp/entry/2020/07/25/115100

---
###作り方
##①魔法陣のモデルを作る
blender（その他３Dモデル制作ツール）を利用して回転しているモデルを作っていきます。
今回は
1.中心の桜
![スクリーンショット (244).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/23224941-3f4f-361f-6392-7c2bdf8c691f.png)
2.中心の下の五角形
![スクリーンショット (242).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/7d5d62ea-1c17-634f-63e0-3a803690e3df.png)
3.五角形の外側の初心者マークみたいなやつ
![スクリーンショット (245).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/a230567a-f0a3-36be-2057-6b312bad0bd5.png)
4.桜のリング１
5.桜のリング２
![スクリーンショット (243).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/c1993228-4432-7014-fdab-193d5d30cba7.png)
6.外側の輪（小）
7.外側の輪（大）
![スクリーンショット (246).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/dd51f372-f355-4901-7835-59fca6a09b3d.png)

実際には、桜の花びら一枚をサイズ変えたりエンプティで回転コピーしたりして中心の桜と桜のリングは制作してます。（この辺の記事を参考にどうぞ→　https://modelinghappy.com/archives/24780  ）
輪もサイズを変えただけなので実際に作るのは４つです。
これを実際にniagaraにしたときと同じ見た目になるようにblender上で合体しておきます。
![スクリーンショット (247).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/20a63693-7c7a-2009-8f54-553dfd438151.png)
これをFBXにして、UE4にインポートします。
![スクリーンショット (241).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/c2a78110-94c6-03cc-b6e0-c01a748ac07d.png)

下地となるモデルはこれでOKです。

##②マテリアルを作る
次に魔法陣のマテリアルを作っていきます。
niagara内で設定する方法もありますが、今回は簡単にエミッシブでマテリアルを作っていきます。
新規マテリアルを作成し、開きます。
![スクリーンショット (249).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/af76c655-743f-567f-0101-18ebf0a58882.png)
右側のパレットからConstantと検索し、定数のところに出てきた[Constant]と[constant3Vector]のノードを追加します。
詳細から、Constansのvalueを100に、Constant3VectorのConstantをカラーバーから好きな色に設定していきます。
![スクリーンショット (250).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/aa87eb36-9d16-0caa-2cb3-4810b8b9c4e1.png)
![スクリーンショット (251).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/419a0969-50d5-98d0-79f9-94bfc95a7528.png)
この２つのノードをつなげるために、適当な場所を右クリックして、[Multiply]のノードを追加して、下の写真のように左側に先ほど作ったノードを２つつなげ、右側を結果ノードの「エミッシブカラー」に繋げていきます。
![スクリーンショット (252).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/f19f8e32-60f8-7a64-a41b-e8706bd31bd8.png)
これでマテリアルは完成です。

##③niagaraを作っていく。
いよいよniagaraを作っていきます。
詳細なアセットを作成▶FX▶ナイアガラシステムを選択し、「空のシステムを作成」を選び終了を押します。
すると、こういった何もエミッタの入っていない空のシステムができるはずです。（名前は適当なので気にしないでください）
![スクリーンショット (254).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/2fb80185-a148-8b62-406b-01cb0c13e756.png)
そうしたら、適当な場所を右クリックして「エミッタを追加」を選択します。
スターターコンテンツなどが入っていると、ここにいろんな設定をされたエミッタが出てきますが、今回は[Empty]という名前の何も入っていないエミッタを追加していきます。
![スクリーンショット (255).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/a704c5a2-1be8-72d8-bf3b-82d43dbd0ac6.png)

そうしたら、
エミッタの更新に
・Emitter State
・Spawn Burst Instantaneous
パーティクルのスポーンに
・Initialize Particle
パーティクル更新に
・Particle State
・Update Mesh Orientation　
レンダリングに
・Mesh Renderer 
を追加します。


このエミッタの見た目を設定していきます。
エミッタの一番下の「Mesh Renderer」をクリックします。
右側の選択項目のタブの、一番上の[Particle Mesh]から、先ほど作ったメッシュをセットします。
![スクリーンショット (259).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/6fe20bf9-d2d6-115d-997f-6ed3d7eaf435.png)
その下の「Override　Materials」のチェックボックスをオンにして、配列エレメントの＋を押します。すると、見慣れたマテリアルのボックスが出てくると思います。そこに先ほど作ったマテリアルをセットします。
![スクリーンショット (260).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/a44b2e48-3e6f-f95c-f9df-13c60cf8b4ef.png)

次に、左のプレビューにパーティクルを表示させていきます。
Emitter stateを選択し、Life cycle mode をSystemからSelfに変更します。
Loop behaviorをInfiniteからOnceに変更します。
![スクリーンショット (261).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/2c774d8b-fc31-1599-9f2f-d11c0752a7ff.png)
これにより、エミッタの寿命がなくなります。
次にSpawn Burst Instantaneousを選択します。
Spawn countを0.0から1.0に変更します。
![スクリーンショット (262).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/c59071b9-484a-70c5-cd33-404ba0c57044.png)
これにより、エミッタが一度しかスポーンしなくなります。
これで下のタイムラインが５秒より手前なら、設定したメッシュがプレビューに表示されていると思います。

今度は、一度出したパーティクルが消えないようにしていきます。
Initialize Particleを選択します。
Point Attributes の中のLifetime ModeのLifetimeを5.0から0.0にします。
![スクリーンショット (264).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/10a26dfd-70dc-091a-9c47-387b0e3a3894.png)
次に、Particle Stateを選択します。
Kill Particle When Lifetime Has Elapsedのチェックボックスを外します。
![スクリーンショット (265).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/738660f9-0bfd-9eee-7a97-a36f148c3c7a.png)
これにより、パーティクルが消えなくなりました。

見た目をよくするために、桜を回転させていきます。
Update Mesh Orientationを選択します。
Z軸を中心に回転させたいので、Rotation VectorのZを0.5にします。（左下のプレイボタンでプレビューを再生しながら、お好みの速さにしてください。）
次に、回転速度にランダム性を持たせたいので、その下にあるRotation Rateを編集していきます。
Rotation Rateの数字の右側の▽をクリックします。
検索にrandomと打ち込むと、動的入力に、[Random range Flote]があります。
![スクリーンショット (266).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/474b186a-afbf-0beb-d334-5f74345c5bfb.png)
これを選択すると、Rotation Rateの下にMinimumとMaximum、Evaluation Typeが現れます。
Minimumがランダムに足す数値の最小、Maximumが数値の最大になります。（自分は0.2-3に設定していますが、お好みで設定してください）
Evaluation Typeをクリックし、Spawn onlyをEvery Frameに切り替えます。
こうすると、Rotation Vector に先ほど設定したランダムな数値をかけた数が毎フレーム設定されます。
プレビューのメッシュはランダムな速度で回転していると思います。
![スクリーンショット (267).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/3aa210d5-8bb9-debc-f1c3-f45eb9fbeb82.png)
これで基本のエミッタができました。

##④複製する
他のメッシュの分もエミッタを作っていきます。
先ほど作ったエミッタを右クリックして「これからアセットを作成」を選択します。
適当なファイルにアセットを保存します。
これで自作のエミッタができました。
ナイアガラシステムに戻り、「エミッタを追加」を選びます。今度はEmptyではなく、先ほど保存したファイル名を検索し、自作したアセットを追加します。
Mesh Rendererからメッシュを別のものに変更します。
これによって簡単に先ほどの設定を持ったエミッタを制作することができます。
![スクリーンショット (268).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2257391/2f2e3170-d1b9-8a3b-daa3-d728cd7256cd.png)
後は、Update Mesh Orientationの数値を変更してお好みの魔法陣を作ってください。


###まとめ
今回はblenderとNiagaraをつかった比較的簡単な魔法陣の作り方を書きました。
上記のブログ・アセットは平面メッシュに魔法陣の模様のマテリアルをつけて制作していますが、立体にしたかったので今回はBlenderで３Ｄモデルだけ作っていきました。
niagaraがハードルが高いと感じてる方はぜひやってみてください。