CascadeのエフェクトをNiagaraで作成してみよう
•Download as PPTX, PDF•
6 likes•4,936 views
第9回UE4勉強会 in 大阪にて登壇した際に使用したスライドになります。 イベントページ：https://ue4study-osaka.connpass.com/event/106419/ Twitter : @YuyaShiotani
Recommended
More Related Content
What's hot
What's hot (20)
CascadeのエフェクトをNiagaraで作成してみよう
- 1. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Yuya Shiotani Cascade To Niagara Cascadeのエフェクトを Niagaraで作成してみよう
- 2. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 自己紹介 京都のUnrealer 塩谷です 学生ゲームデザイナーです 先日、ラマに乗れました 最近の悩み：UE4グッズが入り切らない
- 3. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 第8回 UE4勉強会 in 大阪にて話しました http://saltcanyon.hatenablog.com/entry/2018/09/20/181058
- 4. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 1, 使用したバージョン ： UE4.21.0 2, Niagaraはアーリーアクセス(2018/11/17)です。 今後の実装方法とは異なる可能性があります。 3, 間違った表現等は、なにとぞ・・・！！ 諸注意
- 5. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani CascadeのエフェクトをNiagaraで作成、 同一エフェクトの作成を通してNiagaraを知っていこう！ 今回の内容
- 6. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Content ExamplesのEffect Levelにある 「P_emitter_initial_location」を使用します 題材
- 7. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 完成したものはこちら
- 8. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 1, Niagaraとは？ 2, Cascadeとの違いは？ 3, CascadeのエフェクトをNiagaraへ 目次
- 9. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Niagaraとは？ 4.20よりアーリーアクセスとなった 次世代のVFXツールセット
- 10. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 詳しくはこちら Unreal Fest East ’18にて講演された池田様の各資料 • https://forums.unrealengine.com/international/japan/1543215-unreal-fest-east-2018の niagara講演で使用したプロジェクトの公開について 公式ドキュメント(英語) • https://docs.unrealengine.com/en-us/Engine/Niagara/HowTo 公式のLivestream(英語) • https://youtu.be/s7QpAkzx5eM
- 11. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani • EmitterやModuleの流用が可能 • ノードベース • 自作Moduleの追加が容易 Cascadeとの違いは？
- 12. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 今回は、以下の3つを使用します。 System Emitter Module NiagaraのAssetsについて
- 13. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 各々の特徴
- 14. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani System • Emitterを複数扱える • LevelやBP, Sequencer上で扱える • Emitterにできることはだいたいできる などなど NiagaraのAssetsについて
- 15. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani • 単一のEmitterのみ扱える • 複数のModuleを扱える • 複数のSystemで使い回せる • Cascadeと同じく 各Moduleは上から下に処理される Emitter NiagaraのAssetsについて
- 16. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani • 基本的に処理はココで書かれる • 複数のEmitterで使い回せる • ノードベース Module NiagaraのAssetsについて
- 17. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraとCascadeの比較
- 18. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani System Emitter Module Niagara Cascade
- 19. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani CascadeからNiagaraへ
- 20. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Edit > Plugins > VFXより、有効化できます。 ココ Niagaraの有効化
- 21. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Content Examplesより以下のものを用意します
- 22. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Cascadeでの構成を見る ParticleSystem内にEmitterが2つ使用されている
- 23. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystemを作成
- 24. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystemを作成 名前を“NS_IniLoc”に
- 25. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystemを作成 開くと中身は空
- 26. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraEmitterを作成する “Simple Sprite Burst”を選択
- 27. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraEmitterを作成する 名前を“NE_LeadSphere”に
- 28. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraEmitterを作成する “Simple Sprite Burst”を選択
- 29. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraEmitterを作成する 名前を“NE_Trails”に
- 30. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystemへEmitterを追加 NiagaraSystem内のTimelineのTrackからEmitterを追加
- 31. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystem上の構成を合わせてみる 先程、作成した2つのEmitterを追加
- 32. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystem上の構成を合わせてみる または Timelineへ直接ドラッグアンドドロップ
- 33. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraSystem上の構成を合わせてみる 移行元のCascadeParticleと同じ構成になった
- 34. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani 題材エフェクトの構成
- 35. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する NE_LeadSphereから編集していきます
- 36. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Cascade内のEmitter構成 • Spawn • MeshData • MeshMaterial • Lifetime • InitialSize • InitialVelocity • Sphere • PointAttractor
- 37. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する SetVariables内のSpriteSizeを削除
- 38. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Colorを削除
- 39. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Renderer内のSpriteRendererを削除
- 40. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraのEmittersWindowについて
- 41. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraのEmittersWindowについて CascadeでのTypeData
- 42. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraのEmittersWindowについて CascadeでのInitial系Moduleは SpawnセクションにModuleを置くことで成立
- 43. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NiagaraのEmittersWindowについて CascadeでのInitial系以外のModuleは UpdateセクションにModuleを置くことで成立
- 44. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する MeshDataを用意する
- 45. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Renderへの編集です
- 46. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Renderer内のプラスボタンよりMeshRendererを追加
- 47. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する ParticleMeshにEditorSphereをセット
- 48. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する MeshMaterialを用意する
- 49. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する OverrideMaterialsをTrueにします
- 50. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する プラスボタンから、MaterialSlotを呼び出します
- 51. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する MaterialSlotにはMI_ShapeInstanceをセット
- 52. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Spawnを用意する
- 53. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する EmitterUpdate への編集です
- 54. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する SpawnBurstInstantaneousのCountを”3”に
- 55. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する MeshRendererで設定したSphereがSpawn
- 56. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Lifetimeを用意する
- 57. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する ParticleSpawn への編集です
- 58. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する SetVariablesModuleの中にあります
- 59. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する
- 60. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する こうなればOKです
- 61. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する InitialSizeを用意する
- 62. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する 先程のSetVariablesにParticles.Scaleを追加する
- 63. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Scaleの値を”0.11”にしておく
- 64. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani DynamicInputとは マクロです
- 65. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani DynamicInputとは 各Moduleの公開されている変数に対して使用できます
- 66. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani DynamicInputとは 2つのVector間のランダムな値を返す
- 67. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani DynamicInputとは とてもたくさんの種類があります
- 68. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する InitialVelocityを用意する
- 69. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する AddVelocityを追加
- 70. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する VelocityとなっているInput部分に UniformRangedVectorを追加します
- 71. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する 各Minimumを”-200” 各Maximumを”200”にする
- 72. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する 画面に変化があるので、 どうが
- 73. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Sphereを用意する
- 74. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する SphereLocationを追加
- 75. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Radiusを”150”に
- 76. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する PointAttractorを用意する
- 77. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する ParticleUpdate への編集です
- 78. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する PointAttractionForceを追加
- 79. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する 訳：SolveForcesAndVelocityModuleより上に このModuleは配置してね！
- 80. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する 画像の値にする
- 81. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する FullRebuildを行う
- 82. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する NE_Trailsを編集していきます
- 83. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する Cascade内のEmitter構成 • Required • Spawn • Lifetime • InitialSize • InitialRotation • ColorOverLife • SizeBySpeed • PointGravity • EmitterInitialLocation • Shpere
- 84. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SpawnBurstInstantaneousを削除
- 85. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する Requiredを用意する
- 86. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する Renderへの編集です
- 87. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する RendererのMaterialにm_sparkをセット
- 88. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する Spawnを用意する
- 89. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する EmitterUpdate への編集です
- 90. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SpawnRateを追加します
- 91. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SpawnRateを”1000”に
- 92. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する Lifetime InitialSize InitialRotationを用意する
- 93. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する ParticleSpawn への編集です
- 94. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SetVariablesにSpriteRotationを追加
- 95. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する すべてのInputをUniformRanged系DynamicInputにします
- 96. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する 値は画像のとおりです
- 97. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する ColorOverLifeを用意する
- 98. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereを編集する ParticleUpdate への編集です
- 99. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する ScaleAlphaを黄色の矢印によってDefaultに戻します
- 100. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する ColorのInput部分にColorFromCurve DynamicInputにします
- 101. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する
- 102. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する
- 103. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する
- 104. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NS_IniLocを編集する NS_IniLocを編集していきます
- 105. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NS_IniLocを編集する 緑のボタンを押しておきましょう
- 106. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する EmitterInitialLocationを用意する
- 107. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_LeadSphereとNE_Trailsを編集する EventHandler への編集です
- 108. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani EventHandlerについて
- 109. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani EventHandlerについて 今回必要な要件 LeadSphereの現在位置を初期位置としてTrailsをSpawnさせたい
- 110. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani EventHandlerについて Cascadeの場合
- 111. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ①
- 112. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ②
- 113. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani EventHandlerについて Niagaraの場合
- 114. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ①
- 115. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ②
- 116. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ③
- 117. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ④
- 118. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani
- 119. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani
- 120. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ⑤
- 121. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani
- 122. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する Sphereを用意する
- 123. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Sphereなし Sphereあり
- 124. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する EventHandler への編集です
- 125. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SphereLocationを追加します
- 126. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SizeBySpeedを用意する
- 127. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する ParticleUpdate への編集です
- 128. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する SpriteSizeScaleByVelocityを使用します
- 129. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する 画像の値をセット
- 130. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する DynamicInputをUniformRangedに変更
- 131. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ぷれびゅー
- 132. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する PointGravityを用意する
- 133. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する PointAttractionForceを使用します
- 134. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani NE_Trailsを編集する 値は画像の通り
- 135. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani
- 136. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani Level上でチェックする
- 137. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani おわりに • CascadeからNiagaraへの移行は十分可能 • 将来的にはコンバーターが用意される • エフェクトの組み立て方はCascadeと似ている • Cascadeと違い自作Moduleを用意できるため 今まで以上に強力なものを作りやすい • Niagaraはとても楽しいです！！！
- 138. 第9回 UE4勉強会 in 大阪#UE4 #UE4Osaka | @YuyaShiotani ありがとうございました！
Editor's Notes
- UE4は趣味でやってます。
- 前回、Niagaraを使ったMorph Effectの作成について話しました。 スライドと作業工程を動画化したモノを公開しております。 どちらも、こちらのURLから、アクセスできます。
- 対応バージョンは、4.21.0ですが、 今回作成するエフェクトは、GPUサポートされていないモノを使用していますので、すべて、CPUで動かしています。
- １と２に関しては、前回の勉強会と話した内容が似ていますので、前回の内容を聞かれたりしたかたは、軽く聞いて頂ければ大丈夫です。
- Unreal Festにて講演がったのもあり、周知の方が多いかと思いますので、ざっくりと Cascadeの次の世代にあたるVFXツールセットです。 先週リリースされた4.21アップデートによって、より強力になりました。
- 池田様の資料は動画とスライド、サンプルプロジェクトの3つが2セットあります。 1つは、Unreal Festのもの もう1つは、Niagara基礎勉強会のものと、2つあります。 Niagaraの基礎は、基礎勉強会の資料をご覧頂いて、より発展した資料として、UnrealFestの資料をご覧頂けると飲み込みやすいかと思います。
- 今回は、NiagaraSystem、NiagaraEmitter、NiagaraModuleScriptの3つを使用します。
- 各々の特徴
- CascadeとNiagaraアセットの違いは、こういった表になります。
- まずは、Niagaraは現在Pluginとして用意されています。 そのため、PluginsのVFXカテゴリから、有効化します。
- 題材となるP_emitter_initial_locationを構成しているマテリアルやテクスチャを用意します。 メッシュなどの一部アセットは、EngineContentとして、Engineが保持していますので、スライドの4つのアセットのみで大丈夫です。
- 今回の題材は、System1つに対してEmitter2つで構成されています。 NiagaraとCascadeでは、System内の構成は共通しています。 ので、Niagaraにて、Systemに当たるもの、Emitterに当たるものを用意し、構成をあわせていきます。
- 通常の新規にBPなどを作成する手順で、FXカテゴリ内のNiagara Systemを作成します。 4.21より、SystemやEmitter作成時にpluginコンテンツ内からテンプレートなどのアセットを複製するのかなどを事前に決めて作成できるようになりました。 今回作成するモノにちかしいNiagaraSystemが、テンプレートに存在しないため、上から4つ目にあたる「空のSystemを作成する」オプションを選択しました。
- 名前は、NS_InitialLocationとします。今回は、長いので、略しています。
- 空のSystemとして、作成しているので、NiagaraSystemは開くと空になっています。 空のSystemですので、早速Emitterを追加していきます
- NiagaraSystemを作成した際と同じ方法でNiagaraEmitterを作成していきます。 先程のNiagaraSystemを作成した際とは、違い テンプレートを使用して作成していきます。 使用するテンプレートは、Simple Sprite Burstを選択しました。
- また、今回は、CascadeのParticleをNiagaraに移行させるので、 元のParticleSystem内にて使用されているEmitter名を使用しています。 名前は、NE_LeadSphereとします。
- 同じ要領で、テンプレートであるSimple Sprite Burstを選択し、NE_Trailsを追加します。
- 作成したら、早速SystemにEmitterを追加し、移行元のParticleと同じ構成にしていきます。
- 追加するとNiagaraEmitter内にDefaultとして用意されているSpriteParticleが発生します。
- →次のスライドは動画
- 左がCascade、右がNiagaraになります。 この段階で、移行元のParticleSystemと同じ、1つのSystem内に2つのEmitterを保持しているといった状態になりました。 同じ構成になりましたので、これ以降は、Cascadeと同じような作業手順で、Emitterに対してModuleを追加、編集していきます。
- ざっくりと題材となるエフェクトの構成を見ていきます。 ・LeadSphereというMeshEmitterを動かし ・LeadSphereの動きの軌跡を描くようにTrailsというSpriteEmitterを散らしている物となっています。
- まずは、LeadSphereの作成から行います。 右の動画はEmitterの完成後の状態となります。
- Niagaraにて編集する前にCascade上のEmitterの構成を見てみました。 その際に大まかにNiagaraで再現するために必要なCascadeModuleをまとめるとこなりました。 これらのModuleを追加編集していきたいと思います。
- さっそくModuleを追加！と行きたいところですが、 まずは、不要なModuleなどを削除していきます。 Particle Spawn以下にSetVariablesModuleがありますので、その中にあるSpriteSizeを削除します。 LifeTimeは再現するために必要なものですので、残しておきます
- 次にParticle Update内のColorModuleを削除します。
- 最後にRenderer内にあるSpriteRendererを削除します。 ここまでで、不要なModuleなどの削除は完了です。 次から、Moduleの追加になります。
- Moduleの追加といくのですが、本格的な編集に入る前にNiagaraEditorのEmittersWindowについて、 CascadeでのEditor画面と比較してざっくりと説明していきます。
- まず、下からになりますが、 最初にRenderセクションについて GPUを使用するのか、CPU使用するのかに関して以外では、CascadeでのTypeDataがRenderセクションにあたります。 また、Cascadeとは違い、Niagaraでは、複数のRendererを使用できます。 1つのEmitterに対して、Ribbonを使いながらMeshとSpriteをてんこ盛りできます。
- 次にSpawnセクションについて スライドにあるように、CascadeでのInitialとつくModuleを使用する場合。 Niagaraでは、各Spawnセクション内にModuleを追加することで、Initial系Moduleという扱いにできます。 次のスライド
- その他のものですと、Updateセクション内に追加することで、同じように使用できます。 例としては、InitialSizeを設定したい場合は、 ParticleSpawnセクションにScaleに関するModuleを置くことで、Spawn時のParticleのサイズを指定できます。 また、SizeByLifeなどの動的変更をかけるModuleを設定したい場合は、 ParticleUpdateセクションにScaleに関するModuleを置くことで、Particleの時間経過などに合わせてScaleを更新できます。
- Moduleの追加に入っていきます。 まずは、CascadeでのMeshDataから
- ここからは、Renderセクションへの編集になります
- NiagaraMeshRendererがCascadeでのMeshDataに当たります。 ので、MeshRendererを追加します。
- あとは、どのMeshを使用するのかをセットするだけになります。 移行元のMeshDataでは、EditorSphereが使用されていましたので、そちらを追加します。 MeshDataは、以上です。
- 次に幾つか飛ばす形になりますが、MeshDataに使用するMeshMaterialです。
- こちらは、新たにModuleを追加する必要はなく、 Renderer内のOverrideMaterialsをTrueにするだけで、Materialを追加できます。
- Trueにした後は、BPの配列操作と同様にプラスボタンを使って、MaterialSlotを追加します。
- あとは、移行元のMeshMaterialにて、使用されているMaterialをセットし、MeshMaterialに関しては、終了です。
- Spawnを用意していきます。
- ここからは、EmitterUpdateセクションへの編集になります
- まず、すでにあるSpawnBurstInstantaneousのSpawnCountを3にしておきます。
- この段階で、RendererとSpawnを用意したので、Particleが発生します。 以上でSpawnは終了です。
- Lifetimeを用意していきます。
- ここからは、ParticleSpawnセクションへの編集になります
- 先程、不要なModuleなどを削除しましたが、その時に残しておいたものを使用します。 今回は、SetVariablesModuleという、直接Niagara内の変数に対して値をセットするModuleを使用しています。
- Emitter全体の再生時間と同じ時間生きていてほしいので、再生時間を保持しているCurrentLoopDuration変数をLifetimeに代入します。 代入は、変数をドラッグアンドドロップで、代入可能となっています。
- これで、Emitter全体の再生時間とMeshRendererのLifetimeが同じになりました。
- InitialSizeを用意していきます。
- 先程のLifetimeと同様にSetVariablesModuleを使用し、Scale変数に直接、値を代入していきたいと思います。
- 移行元のInitialSizeと同じ0.11をScaleとして、セットしておきます。
- いきなりですが、次に追加するModuleにて、DynamicInputを使用しますので、 そちらの説明をさっとしてしまいます。 すでに答えが出ていますが、マクロです。
- まず、各Moduleの公開されている変数に対して使用できます。 画像にて使用しているDynamicInputは、UniformRangedVectorというのもです。
- 中身は、こういった形になってまして、 2つのVectorからランダムな値を返すというマクロとなっています。
- 今回使用するUniformRangedVectorの他にも ClampFloatやAddFloatなど、わざわざModule内に書く必要のない簡単な処理を担うのがDynamicInputです。
- 編集に戻りまして、 InitialVelocityを用意していきます。
- InitialVelocityは、InitialSize同様、Spawnセクションに追加することで、InitialのModuleとして扱えますので、 ParticleSpawnセクションにAddVelocityModuleを追加します。
- 2つの値の範囲内でランダムな値がほしいので、UniformRangedVectorというDynaminInputを使用しています。
- 値は、スライドの通りです。
- Velocityを用意しましたので、動画のように、ランダムな方向に進んでいくようになれば、okです。 Add Velocityに関しては以上です。
- 次にSphereを用意していきます。
- 先程と同じくParticleSpawnセクション追加します。 指定した半径のSphere内のランダムな箇所でSpawnするModuleですので、 同じ役割を果たすModuleとして、SphereLocationを追加します
- 値は、スライドの通りです。
- 最後にPointAttractorを用意していきます。
- ここからは、ParticleUpdateセクションへの編集になります
- まずは、Moduleの追加です。 CascadeでのPointAttractorは、PointAttractionForceとしてありますので、そちらを追加します。
- するとエラーがでます。 まずPointAttractionForceは、SolveForcesAndVelocityModuleというものが必要なModuleです。 すでに追加してありますが、そのModuleよりも上位に配置されなければ、PointAttractionForceは、機能しないため、こういったエラーが出ています。
- Fix issueボタンを実行すると、PointAttractionForceModuleは、真ん中に再配置されます。 その状態で、画像と同じ値にします。 ですが、この状態では、PointAttractionForceによる正しい挙動が反映されていないはずです。
- 一度、Compileボタンのプルダウンメニューから、Full Rebuildを行っておきましょう。 そうすると、正しい結果が反映されます。
- TrailsEmitterの編集へ移ります。
- まずは、先程のEmitterと同様に移行元のCascadeEmitterの構成を見てみます。 同じように再現するにあたって必要なModuleなどをまとめるとスライドの通りになりました。 Cascadeでは、TypeDataにあたるGPU Spritesですが、 今回のCascadeパーティクルを再現するにあたり、GPUサポートが未対応のModuleなどを使用していますので、除いています。
- まずは、SpawnBurstInstantaneousを削除します。 以上で、不要なModuleは、削除できました。
- まず、Requiredを用意するのですが、今回は、DurationやDelayなどの編集ではなく、EmitterMaterialを設定するのみとなります。
- ここからは、Renderセクションへの編集になります
- 移行元のCascadeEmitterでは、SpriteMaterialを使用されていましたので、 NiagaraでもSpriteRendererを使用し、実際に表示させたいMaterialをセットします。 Requiredに関しては、以上になります。
- 次にSpawnです。
- ここからは、EmitterUpdateセクションへの編集になります
- CascadeでのSpriteの場合でのInitialSizeとInitialRotationは、それぞれ、SpriteSizeとSpriteRotationという変数でコントロールされています。 Lifetime,InitialSize,InitialRotationですが、すでにSetVariablesModuleで用意されていますので、そちらを使用していきます。
- ここからは、ParticleSpawnセクションへの編集になります
- まずは、SetVariablesModuleにSpriteRotation変数を追加します。
- ここでのSetVariablesModuleでは、すべて、2つの値の間でランダムな値を使用したいので、UniformRangedFloatとUniformRangedVector2Dを使用します。
- 値は、それぞれ、移行元であるCascadeでのModuleの値を使用しています。
- ColorOverLife
- ここからは、ParticleUpdateセクションへの編集になります
- すでにColorModuleがありますので、そちらを使用しますが、必要ない編集がされていますので、まずは、Defaultに戻します。
- 次にConstantな値ですと美しくないので、Curveによる編集ができるよう ColorFromCurveというDynamicInputを使用します。
- スライドのような形になります
- ColorOverLifeはシンプルにカーブでコントロールしていきます。 青い色合いから赤い色合いへCurveしていくようにします。
- ColorModuleを編集した段階で、こうなります (ループ動画) 次のModuleから、このTrailsEmitterに対して、動きをつけていくのですが、 このEmitter単体だけですと、動きのプレビューができません。 そこで、次からは、先に作ったNE_LeadSphereと連携させて行きました。
- 一番最初に作成したNiagaraSystemを編集していきます。 ここからは、今回のエフェクトの移行にて、一番CascadeSystemと近い形での編集になります。
- Systemを開いた際に、画像のような緑の矢印ボタンがあった際は、そちらの方をクリックしておきましょう。 BPなどでよく見る黄色のものはDefaultの値にもどるモノですが、この緑のものは、使用しているEmitter内で、設定している値リセットするものとなっています。
- EmitterInitialLocationは、指定したEmitterのLocationをInitial Locationとして受け取るものですが、 今までのModuleと違う点として、他のEmitterとの通信が発生します。
- ここからは、EventHandlerセクションへの編集になります
- EventHandlerは初見ですと少しややこしいです。 ここからは、EventHandlerの解説を交えつつ進めていきます。
- まず今回の要件です。
- まずは、移行元のCascadeの場合を見ていきます
- EmitterInitialLocationModuleをTrailsに追加し、
- そのModule内に初期位置として参照したいEmitter名を書き込むといったものでした。
- まず、Cascadeと同様にこれからSpawnさせたいEmitterのEventHandlerセクションにて、プラスボタンを押します。 それだけで、PropertiesModuleが追加されます。 ExecutionModeは、SpawnedParticles EventHandlerによって、いくつSpawnさせるのかをコントロールするSpawnNumberは、4に設定しています。
- 次に、Spawn位置として、参照したいEmitterであるLeadSphereのParticleUpdateセクションへ、GenerateEvent系Moduleを追加します。 今回の場合Locationを参照したいので、GenerateLocationEventになります。 このModuleを追加した事により、これからSpawnするはずのTrailsから参照できるようになります。 この種類のModuleは、他にもCollisionが存在します。4.21から、DeathEventも使用可能になりました 今回は、Module内のGapCorrectionを0に設定しています。
- 参照可能になったので、早速Trailsにて、参照します。 PropertiesModule内のSourceのプルダウンにて、「Emitter名：LeadSphere、Event種類：Location」となっているEventを選択します。
- 参照しただけでは、LocationEventを参照されませんので、 ReceiveLocationEventModuleで、LocationEventを受け取る必要があります。 Inherited Velocity Scaleを0.25に設定しておきます。
- 左のようなPreview画面が、右のようになります。 カッコいいです。
- ただ、これだけでは、中心になにか残ってしまいます。
- 原因としては、EventHandlerにて、TrailsをSpawnさせているのに TrailsEmitter自身のもともと用意していたSpawnModuleでもSpawnさせていることが原因です。 解決方法としては、EmitterUpdateModule内のSpawnModuleを削除もしくは、Module右上のチェックボックスをFalseにして、無効化するだけで大丈夫です。
- 中心のSpriteが消えました。 以上がNiagaraにてEmitter同士の連携を行うためのEventHandlerについてです。
- Emitterへの編集として、最後にSphereを用意します。
- というのも現状では、まだ、1箇所からSpawnした後に後方へ平面に拡散しているだけになります。 そこを、先程のEventHandlerでLocationを取得した後から、Sphereの範囲内にSpawnさせるようさせます。
- 続けてEventHandlerセクションへの編集になります
- SphereLocationModuleを使用します。 半径の値は、12ぐらいにしました。
- SizeBySpeed
- 続けてEventHandlerセクションへの編集になります
- 今回は、SpriteSizeをコントロールしたいので、SpriteSizeScaleByVelocityを使用します
- Max Scale Factorには、画像の値をセットしまして、 Velocity Threshold(スレッショルド)にはDynamicInputを使用します。
- 使用するDynamicInputはUniformRangedです。 設定した後に画像の値をセットします。
- 16 この編集によって、Velocityの値に応じたサイズが適用されるようになりました。
- 最後にPointGravity
- PointAttractionForceModuleによって、引力が加わったので、Trailの最後尾にあたる箇所が中心に向かうようになりました。 以上で、Niagaraを使ったCascadeエフェクトの再現ができました。
- 一応、確認 NS_IniLocをLevel上へドラッグアンドドロップしていただければ、Level上に配置できます。
- 移行自体は、そんなに難しくないです。 CascadeのModule名とNiagaraのModule名は似通った点があったりします。 ただ、将来的にはコンバーターが用意されるそうなので、 よほどの理由が無い限りは、今すぐ手作業で移行する必要性はないかと思います。 UnrealFestでの池田さん曰く、エフェクトの組み立て方は、Cascadeと似ています。 そのため、今回、Moduleを自作することなくCascadeエフェクトをNiagaraに持ってくることができました。 既存Moduleのみでも十分Cascadeエフェクトは表現できます。 また、Moduleの自作が可能ですので、Cascade以上のエフェクトを作りやすいです。 なにより、Niagaraは楽しいです。 今回の講演で、少しでもNiagaraを触る手助けになれば、大変嬉しいです。