【総額6万円超えが無料!】7月限定のUE無料アセットを使い倒す特集Vol.03:『FluidNinja FX Tools』を使ってガス惑星や雲を作ってみよう

2022.07.27
注目記事ゲームづくりの知識見た目を良くするお役立ち情報アセットレビューツール紹介アンリアルエンジンマーケットプレイス
この記事をシェア!
twitter facebook line B!
twitter facebook line B!

毎月UEマーケットプレイスではEpic Gamesが選出した5つのアセットが無料配布されていますが、 今月はゲーム開発者向けメディア『GameFromScratch』コミュニティの特別協力による、極めて実践的な高品質アセットが無償で提供される形となりました。

「絶対にこのタイミングで手に入れて欲しい!」というアセットを全て紹介する本特集。今回は『FluidNinja FX Tools』の内容と使用方法について解説します。

TEXT / wvigler
EDIT / 神山 大輝

目次

この記事はUnreal Engine バージョン5.0.3を利用して書かれています。

FluidNinja FX Tools』(以下、FluidNinja)はUnreal Engineで作られた流体シミュレーションエフェクト作成用ツールです。このアセットはプロジェクトに組み込んで使うためのものではなく、これ自体をツールとして使う、珍しいタイプのアセットとなっています。非常に使いやすいツールで、使いこなせれば幅広いエフェクトに活用することが可能です。

「流体シミュレーション」とは、流体力学に基づいたシミュレーション手法のこと。液体だけでなく、炎や雲、爆発などのリアルな動きを、さまざまな物理法則と照らし合わせて生成します。

『FluidNinja FX Tools』のサンプルを確認しよう

FluidNinjaでできることを知るために、まずはエフェクトサンプルをチェックしてみましょう。プロジェクトを起動すると、下図のような画面から始まります。

コンテンツドロワーから、「コンテンツ\FluidNinja\Levels」内の「Usecases」のアイコンをダブルクリックして、「Usecases」のマップを開きます。ここには、最も基本的なFluidNinjaの作例が収められています。

サンプルを見れば、流体シミュレーションがどのようなものかイメージがつかみやすい

流体シミュレーションでは煙、雲、炎などのリアルな動きを表現できますが、こうしたシミュレーションは処理負荷が大きいため、ゲーム内で全ての計算を行うのは難しい場合もあります。

このツールは流体シミュレーションを行うだけではなく、生成されたデータを画像データとして保存します。完成物は単なる画像データなので処理負荷の問題は回避されます。実は、Usecasesで紹介されているサンプルも、ほとんどのものは厚みが全くありません。

画像データとして扱うことで、処理負荷を軽減できる

『FluidNinja FX Tools』でガス惑星を作ってみよう

さまざまな流体シミュレーションが可能なFluidNinjaの使い方を学ぶために、木星や土星のようなガス惑星を作ってみましょう。まずはコンテンツドロワーから「コンテンツ\FluidNinja\Levels」内の「Ninja Tools」のマップを開き、プレイボタンを押してFluidNinjaを起動させます。

起動画面。右側には流体シミュレーションやその画像データが、左側には各種設定が並んでいる

画面左の「Flower」と書いてあるドロップダウンメニューをクリックし、「AtmoHD」を選択します。

流体シミュレーションが安定するまで30秒ほど待ってから、画面左の「Canvas」の欄にある赤い丸のマークをクリックします。これで現在行われている流体シミュレーションを画像データとして保存できます。

このデータはテクスチャマテリアルといったUnreal Engineで使える形式やPNG形式の画像ファイルとして出力できます。今回はUnreal Engine内で流体シミュレーションを使いたいので、テクスチャ形式で出力します。

画像は「コンテンツ\FluidNinja\Output」の中に出力される。「~_velocity」とついている画像は流体の速度を記録したもの

このテクスチャファイルを移行(Migrate)して、他のプロジェクトで使います。これが、このツールの基本的な使い方です。

新しく空のプロジェクトを作成し、テクスチャファイル移行してみましょう。

アセットアクションから「移行」を選択。移行することで新しく作ったプロジェクトの「コンテンツ\FluidNinja\Output」というフォルダに画像が送られる

続いて、空のマップを作成し、そこに「Directional Light」と、星として浮かべるための「Sphere」を設置します。

この辺りは一般的なUnreal Engineの操作と同様。必要な要素をマップ内に配置していく

FluidNinjaから作成したテクスチャを活用するために、マテリアルを作成しましょう。コンテンツドロワーを右クリックし、メニューから「マテリアル」をクリックしてマテリアルを作ります。

コンテンツドロワー内の何もないところで右クリックし、マテリアルを作成する

新しく作ったマテリアルをビューポートの「Sphere」にドラッグ&ドロップすると、マテリアルが「Sphere」に適用されます。

いま作ったマテリアルをSphereに適用する。この段階ではマテリアルをなにも編集していないので、デフォルトの格子状の見た目が表示されている

コンテンツドロワーで先ほど作ったマテリアルをダブルクリックすると、マテリアルエディタが開きます。Unreal Engineマテリアルエディタについては公式ドキュメントが参考になりますが、操作自体はブループリントに似ていますので、まずは以下のようなノードを組んでいきましょう。

左上のプレビューは、デフォルトでは「Sphere」と同様の球体になっている。現在自分が編集しているマテリアルの見た目を確認できる

今回サンプルとして作成したノード

「Constant」「Texture Object」ノードはともに「詳細」から数字やテクスチャを指定することができる

わずか数ステップで、既にガス惑星のような見た目を作ることができました。さらに「Lerp_3Color」というノードを使うことで色のバリエーションを作っていきます。

Lerp_3Colorは黒(0.0)~白(1.0)のグレースケール情報から線形補間という方法に従って、指定した3つの色を掛け合わせた色を返すノードです。

Lerp_3Colorで着色したところ。色の指定には「Constant3Vector」というノードを使用

「Constant3Vector」ノードも「詳細」の「Constant」から色を指定できる。また、ノードをダブルクリックしても同じことが可能だ

ノードを組み終わったら、左上の「適用」ボタンをクリックします。これでマテリアルを変更することができます。

ビューポートを見てみると、作ったマテリアルが反映され、まるでガス惑星のような見た目になっていることが分かります。

完成図

色や設定を変えることで、さまざまな惑星や恒星を作ることができます。ぜひ、あなただけの惑星を作ってみてください。

ここまででFluidNinjaの最も基本的な使い方は理解できたと思います。次は、FluidNinjaをより拡張した使い方として「オリジナルの雲」を作ってみましょう。

発展編:『FluidNinja FX Tools』でオリジナルの雲を作ってみよう

今回は雲を作るためにVolumetric CloudというUnreal Engineのシステムを使います。1から雲を作るのは大変なので、「コンテンツ/Levels」に収められている「Usecases_VolumeClouds3」のマップを利用したいと思います。

これはFluidNinjaのサンプルマップの1つです。このサンプルとFluidNinjaをうまく使えば、オリジナルの画像データから簡単に雲を作ることができます。

今回のゴールは、ここに浮かぶ雲をオリジナルのものにすること。手順通りに進めて、本アセットの使い方を覚えよう

使用する画像データとして、以下のバナーを用意しました。

画像は2のべき乗サイズの正方形のものが望ましい。ちなみにこの画像は1024×1024のサイズとなっている

まずは「Usecases_VolumeClouds3」のマップ全体の方向とこの画像の方向を合わせるために、右クリックメニューから「右に回転」を選んで90度回転させます。

これはあくまで今回使用するマップ仕様に合わせているだけなので、通常のエフェクトを作る時は回転させる必要はありません

これが終わったら、画像をテクスチャとしてインポートします。「コンテンツ\FluidNinja\Input\FluidPresets\Misc」を開き、その中に画像ファイルをドラッグ&ドロップすれば、簡単にインポートすることができます。

再度FluidNinjaを起動しましょう。「Flower」と書いてあるドロップダウンメニューをクリックし、「PresetPlacementExample2」を選びます。

左側のメニューの「Input」から「Density from Bitmap」と書いてあるドロップダウンメニューをクリックすると、先ほど追加したテクスチャの名前があるはずです。こちらを選択します。

先ほどインポートした画像を選択

今回の雲は揺らいで欲しくないので、VelocityカテゴリのAmplifyを0.0に設定します。

ここまでの作業が終わったら、先ほどと同様に赤い丸のマークをクリックしてシミュレーションを記録し、テクスチャとして出力します。

Outputフォルダに「~_density」と「~_velocity」テクスチャが出力されているのを確認しておこう

次に「Usecases_VolumeClouds3」のマップを開き、「VolumetricCloud」を選択します。「詳細」の「雲マテリアル」カテゴリ内の「Material」からダブルクリックで「MI_VolumeCoud_StratoSphere1_PerformanceHeavy」を開いていきます。

MI_VolumeCoud_StratoSphere1_PerformanceHeavyはマテリアルインスタンスと呼ばれるもので、マテリアルよりも手軽に見た目を作ることができる

右の「詳細」タブの項目を以下のように変更します。

  • [CloudUVW]Tiling→チェックを外す
  • [CloudUVW]CloudU-Offset→0.0
  • [CloudUVW]CloudV-Offset→0.5
  • [Flipbook]VelocityMap→作成した「~_velocity」テクスチャ
  • [Flipbook]Horizontal Subimage→4.0
  • [Flipbook]Vertical Subimage→4.0
  • [Flipbook]DensityMap→作成した「~_density」テクスチャ

再び「Usecases_VolumeCloud3」に戻りましょう。先ほどの画像通りの雲が浮かんでいたら成功です!

同じ方法を使えば、イラストやロゴなどを雲にすることもできます。ここまでの機能を応用して、ぜひオリジナルの流体シミュレーションを作ってみてください!

重厚感のあるスモークやフォグなど豊富な作例の一部を紹介

Usecases」や「Usecases_VolumeClouds3」のマップ以外にも、FluidNinjaでは豊富な作例が紹介されています。「コンテンツ/Levels」に収められているので、見てみましょう。

FluidNinjaの基本的な機能は2つの画像データを作るだけとも言えるが、その活用範囲は驚くほどに広い

「Usecases_VolumeFog」は霞や霧のような表現ができるVolumetric Fog機能を使用した作例

「Usecases_VolumeClouds1」は「Usecases_VolumeClouds3」と同じく、Volumetric Cloud機能を使用した作例

「Usecases_Additional2」の作例。FluidNinjaで作られたマテリアルは基本的に平面でしかないが、レイマーチングという技術や他のエフェクトとの組み合わせでこのようなリアリティを出すことができる

「Usecases_VolumeSmoke」はFluidNinjaオリジナルのエフェクトであるVolumetric Smokeを使用した作例

公式マニュアルチュートリアルビデオも充実していますので、ぜひいろいろなエフェクトに挑戦してみましょう!

その他にもベクターフィールドと呼ばれるGPUパーティクルをコントロールするためのデータを出力する機能などもある。扱う難易度は高いものだが、余裕がある人は挑戦してみてもいいかもしれない

7月限定の無料アセットを必ず入手しよう!

本記事で紹介した『FluidNinja FX Toolsを含めた7月の無料アセットについては、こちらの記事でも取り上げています。

関連記事
「Unreal Engine」7月の無料マーケットプレイスコンテンツが公開!海外メディア『GameFromScratch』のコミュニティが選定協力した豪華アセットが目白押し!
2022.07.06

「作品に活かす機会がない」「使い方が分からない」といった場合も、無償期間にダウンロードさえ済ませておけば、必要になったタイミングで使用することができます。この機会にぜひ、高品質な有償アセットを無料で入手しておきましょう!

アンリアルエンジンの基本は「ゲームづくりを始めよう!」を、マーケットプレイスからのアセットの入手方法はこちらの記事をご確認ください。

『FluidNinja FX Tools』ダウンロードページ『FluidNinja FX Tools』公式ドキュメント『FluidNinja FX Tools』チュートリアルビデオ
wvigler

アンリアルエンジンにハマり、ぷちコンでゲーム作ってた男。映像編で2連覇したことも。
昔はよくアーケードゲームとかやってました。
一番やり込んだのは「ケツイ ~絆地獄たち~」「戦国BASARAX」あたり。ローグライトゲームとかも好きです。

関連記事

SDFを活用した低負荷なアニメ調のシェーディングをUE5で実装。alwei氏が解説記事を公開
2024.03.01
「Steam Audio」がオープンソース化。UnityやUEに統合できる、ゲームやVRアプリ用の空間オーディオツール
2024.02.22
実写映像を3Dアニメーション化するAIツール「Wonder Studio」にUEエクスポート機能追加。カメラやキャラクターアニメーションなどの要素に分解も可能
2024.02.16
Unreal Engine向けゲーム制作コンテスト『第21回UE5ぷちコン』開始!テーマは「おす」。応募締切は4/7(日)
2024.02.16
揺れ物を手軽に「かわいく」揺らせる疑似物理プラグイン「KawaiiPhysics」がアップデート。ボーン間の距離を維持して、モデルのスカート貫通問題を緩和しやすく
2024.02.12
「Unreal Engine」2024年2月の無料マーケットプレイスコンテンツが公開!Steam APIを活用したブループリントアセットや、ファンタジックなインテリアを集めた環境アセットなど
2024.02.07

注目記事ランキング

2024.02.27 - 2024.03.05
1
『フォートナイト』で動く本格的なゲームが作れるツール「UEFN」とは?従来のクリエイティブモードから進化したポイントを一挙紹介!
2
【CHALLENGE1】「クリエイター ポータル」を使って、UEFNで作成した島を世界中に公開する
3
【2022年5月版】今から始めるフォートナイトの「クリエイティブ」モードープレイ開始から基本的な操作方法まで解説
4
UEFNで使えるプログラミング言語「Verse」のノウハウが集結。『UEFN.Tokyo 勉強会 03 Verse Night』レポート
5
フォートナイト クリエイティブとUEFNで使える仕掛け一覧
6
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.1「アイテム系」
7
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.5「島の設定」
8
フォートナイトとUEFNがv28.30にアップデート。「NPCスポナー」が、スポーン・撃破時のエフェクトや移動速度のカスタマイズに対応
9
【STEP2】UEFNの基本的な使い方を覚えよう
10
【CHALLENGE2-1】フレンドと一緒にゲームを作ろう――UEFNプロジェクトをチームメンバーとリアルタイムで共同編集する
11
【STEP1】「UEFN」を入手しよう
12
まるで『マイクラ』?ボクセル地形を生み出す無料アセット「VoxelPlugin Free」で”地形を掘ったり積み重ねたり”して遊んでみよう
13
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.4「ゲームシステム系」
14
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.7「NPC系」Part1
15
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.2「ユーティリティ系」
16
フルカラー書籍「UEFN(Unreal Editor For Fortnite)でゲームづくりを始めよう!」、ついに本日発売!全国書店で好評発売中!
17
【CHALLENGE3】UEFNの機能「ランドスケープ」を使ってオリジナルの地形を作る
18
NIKEのAir Maxをテーマにしたフォートナイトの島『Airphoria』、制作に関するチュートリアルが公開
19
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.10「UI系」Part1
20
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.10「UI系」Part2
21
『フォートナイト』で建築ビジュアライゼーション!?UEFNでオリジナルの世界観をどう作り上げたか、その手法を解説【UNREAL FEST 2023 TOKYO】
22
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.6「チーム・対戦系」Part1
23
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.3「プレイヤー系」
24
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.7「NPC系」Part2
25
フォートナイトとUEFNがv26.30にアップデート。ロビー画面が一新され、クリエイターが島ごとにロビー背景を自由にカスタムできるように
26
【STEP6-1】「オリジナルキャラクターを登場させよう」――Fabでアセットをダウンロードしよう
27
「UEFN」って実際どうなの? 編集部が3時間で「みんなで遊べるアクションゲーム(?)」を作ってみた
28
【STEP4-1】コース外に出たらデスする仕組みを作る
29
【STEP4-2】リスポーンとチェックポイントの仕組みを作る
30
【STEP5-1】スタート時のカウントダウンを作る
VIEW MORE

イベントカレンダー

VIEW MORE

今日の用語

レンダリング(Rendering)
レンダリング コンピューターグラフィックスにおける、各種データ(3Dモデルなど)をプログラムを用いて計算し、画像として表示すること。レンダリングを行うプログラムをレンダラー(Renderer)と呼ぶ。
VIEW MORE

Twitterで最新情報を
チェック!