【UE5】POM/POMデカールマテリアルを作ってNiagaraでひびエフェクトを出す＆POMデカール回転対応
本記事は「Unreal Engine (UE) Advent Calendar 2023」24日目の記事です！
POM（ピーオーエム）とは？
「POM = ParallaxOcclusionMapping（パララックスオクルージョンマッピング）：視差隠蔽マッピング」という思わず言いたくなる必殺技みたいなかっこいい名前の機能があります！！
簡単に言うと凹凸表現ができるようなマテリアルの機能です。
今回のゴール、経緯
1. POMマテリアルの基本的な作り方についてまとめる
└自分で試してみようと思ったときにネット上に細かい情報がなかなかまとまっていなくて苦戦したので、調べたついでにPOMの作り方についてまとめておこうと思います。
（と、2年くらい前に思ったまま書かずに放置だったので、今回アドカレにエントリーしたという経緯です(^^;)）
※マテリアルの基本的な使い方やパラメータ整理、データの最適化などは、長くなるので今回は割愛します
2. POMデカールに改造してNiagaraでも試してみる（本命これがやりたい）
└UE5のNiagaraでデカールも使えるようになったとのことだったので、Niagaraデカールを触るついでに、POMデカールとしてもひびエフェクトなど色々できないかなーというのも試してみました
リファレンス
テクスチャや焼けた表現などはこのあたりを参考にしてみました
はじめにざっくり結論
＜うまくいった点など＞
- 機能別サンプルのPOMサンプルのレベルが一番参考になってスムーズだった
- 「ピクセル深度オフセット」を入れると別オブジェクトも凹凸に沿って遮蔽される
- POMデカールで回転対応する場合には、有志の方が開発のGitHubからMaterialFunctionインポートで解決（が早い）
- デカールをNiagaraで制御する場合には、マテリアルでDecal Colorの指定が必要
＜うまくいかなかった点＞（そもそも解決できるかわからない）
- POM上を歩くとキャラが浮いてしまう…
まず参考に機能別サンプルを開く
いきなりですが、機能別サンプルの「ParallaxOcclusionMapping」 のレベルを開きます。
色々ネットも調べてみましたが個人的にはこれを分解してみるのが一番わかりやすかったです。
＜★機能別サンプルのご紹介★＞
一応、意外とご存知ない方も多いようなので少し紹介できればと思います！
「機能別サンプル」は、Epic Games公式のサンプルでキャラ、背景、モーション、UI、エフェクト、BP、ポスプロなどなど最新機能含めのたくさんのデータが展示されているプロジェクトです。
神サンプル！！
困ったり、「なんか新しい機能試してみたいな～」と思ったらいろんなサンプルレベルを開いてみるのがおすすめです！（解読するのに結構時間かかりますが…Google先生と気合でなんとか…。）
シンプルなPOMマテリアルを作成してみる
参考は、機能別サンプルの「M_Parallax_Shadows2」です。基本はこれ通り組んでみました。
新規マテリアルを作成し、名前は「M_POM_000」としておきます。
内容は機能別サンプルの「M_Parallax_Shadows2」の写経です。（一番確実だと思ったので。）
TextureObjectParameterやTextureSamplerParameter2Dのパラメーター名は好みで「TX 〇〇」に変更しました。（この辺は好みで問題ないです）
以下は、昨年マテリアル学びはじめの頃に、そもそも表示名と違うノードが分からずに召喚できなかったので色々メモってます。検索の参考までに…！拡大版は下に続けます。
（全体像）クリックで拡大
（左側）クリックで拡大
（右側）クリックで拡大
使いそうなPOMパラメーターの解説
クリックで拡大
- 「Height of Texture」
└どのくらい凹ませるか
→ 黒ほど低い場所、凹む - 「MinSteps」
└上から見たときの凹みミルフィーユの層の分割数
→ 4のままで良さそう - 「MaxSteps」
└いろんな角度から見たときの凹みミルフィーユの層の分割数
（たぶん上げるほど重くなる？） - 「ref plane」
└Heightテクスチャの白（1）基準で凹む
→ 1のままが良さそう
ピクセル深度オフセットについては、機能別サンプルの以下のあたりを見るとわかりやすかったです。
これがオンだと、いい感じにPOMの凹凸に他オブジェクトが馴染むようになるようです。
一旦確認
マテリアルインスタンスを作成して、「MI_POMTest_000」にリネームしておきます。
Planeをシーンに配置して、作成した「MI_POMTest_000」を適用します。
「アクタを配置」のウィンドウを開くには？
「ウィドウメニュー > アクタを配置」をクリックで開けます
↑ 機能別サンプルの「M_Parallax_Shadows2」と同じテクスチャを使用していれば、以下のような表示になるはずです。ひとまず問題なさそうですね。
自分で適当に作ったHeightマップ、Normalマップも入れてみます
↓特にツールは問わないので、今回は無料お絵かきソフトのKritaを使って10秒くらいで描いてみました！
この黒い場所が凹む想定です。
無料ツール「Krita」で適当なHeightマップを作る方法
個人的にPhotoshopの代用で無料ツールならKritaを気に入っています（以前同僚に教えていただきました）
新規ドキュメント作成（512 x 512など、白背景）
ブラシで描いて、消しゴムで消して、好みでぼかしフィルターなどかけてみます
ノーマルマップはSubstance 3D Designerなどで普段は作成していますが、今回は手頃にこちらのノーマルマップ変換サイトで変換してみました
機能別サンプルのノーマルマップを見る限り、Invert R, Gにチェックは入れたほうがいいのかなと思いました。
「NormalMap-Online」の使い方
「MI_POMTest_000」を開いてテクスチャを差し替えてシーンで見てみるとこんな感じです。
ふちがガタガタしてしまう場合の原因と対処法
これは「MaxSteps」が足りないというより、グラデーションの幅が狭すぎるとこのような状態になってしまうようです…。
試しにブラーをかけてグラデーション幅を広くしてみたらなめらかになりました！
クリックで拡大
マスクとベースカラーが設定できるようにPOMマテリアルを改造する
まず先程のマテリアルは複製して、「M_POM_001_Crack」としておきました。
マテリアルインスタンスもついでに作って「MI_POMTest_001_Crack」とおきます。
シーンのPlaneにもついでに適用しておきましょう。
「M_POM_001_Crack」の編集です。
とりあえず、ひびの形にマスクできる機能、色変えの機能を追加したいので以下更新。
- 「Blend Mode : Translucent」に変更
- オパシティにTextureSamplerParameter2Dを接続
- ベースカラーの最後にVectorParameterを乗算
ついでにTX BaseColorのタイリング数が変えられるようにScalarParameterを設定しておきました。
これでマテリアル保存して、「MI_POMTest_001_Crack」のTX Maskにマスクテクスチャを入れれば範囲が切り抜かれます。
また、他のテクスチャやBaseColorのタイリング、色をいじればこの時点でもだいぶいい感じです！
テクスチャはこのあたり参考に改造して作成するといい感じです
ここまでは、機能別サンプルのちょい足しという感じですね
深い場所ほど光るPOMマテリアルに改造してみる
以下のようにノードを追加します。
クリックして拡大
機能的には、TextureObjectParameterの「TX Height」を「Texture Sample」ノードでサンプリングして、白黒反転、コントラスト調整をして、VectorParameterで着色するような構成にしてみました。
「MI_POMTest_001_Crack」は以下のように追加設定しています。黄色が好きなので黄色にしてみました！
地形が平坦であればこのメッシュに貼る方法で全然問題ないかなと思います。
POM "デカール" マテリアルに改造してみる
「M_POM_001_Crack」を複製して「M_POM_002_CrackDecal」とリネームしておきます。
マテリアルインスタンスも作成して「MI_POMTest_002_CrackDecal」とリネームしておきます。
マテリアルインスタンスのパラメータやテクスチャは適宜設定しておきました。
デカールにすること自体は簡単で、「M_POM_002_CrackDecal」を開いて「Material Domain : Deferred Decal」に設定します。
これでマテリアルは保存して、テクスチャやパラメータ設定した「MI_POMTest_002_CrackDecal」をシーンに配置してみます。
ひとまずは、これで基本のPOMデカールも完成です。
POM "デカール"をNiagaraで発生させてみる（若干はまった…）
個人的にはこれが本題感あります。
まずマテリアルですが、どうやらNiagaraのDecalRendererを使用する際には、ParticleColorではなくDecalColorなるものを使用するのが標準仕様のようです。
というわけで、マテリアル側のParticle ColorをDecal Colorノードに差し替えました。
Niagara側は、デフォルトのままだととても小さく表示されるので、DecalSizeアトリビュートに値をセットします。
色はスケールカラーなどでの変更で反映されました。
無事NiagaraでもPOMデカールを発生させられました！
POMマテリアル関連の問題点
POMについては、以下問題がありました。
POMの問題
POMマテリアルの深さが深い場合、上に乗ったキャラが浮いてしまう問題があります
深さを浅くするか、地形のコリジョン自体変化をさせる方法もあるんですかね？
（解決済み）POM "デカール" の問題 回転させるとルックが破綻する
左：メッシュに適用したPOMマテリアル
右：配置したPOMデカール
回転したら右のPOMデカールのルックが破綻しているのがわかります。
おわりに
処理的に重いらしいので使い所は選ぶ技術かもしれませんが、かっこいいので自主制作ではガンガン取り入れていきたいですね。
また、情報を見つけるまではつまづいて苦戦しましたが、EpicGamesさん公式の機能別サンプル ＋ 先人の皆さんの情報のかけらのお陰で比較的簡単にPOMのマテリアルを作成、機能拡張できました。今回思考整理できて参加してよかったです！
仕様的に若干、うまく行かない部分もありましたがもし打開案などご存知の方がいらっしゃればご教示いただけますと幸いですm(__)m
最後までお読みいただきありがとうございました！
アドベントカレンダーも明日で最終日（間違ってたらすみません…！）のようで、１ヶ月で約100記事以上ですかね（すごい…） 他の気になった方の記事もぜひ覗いてみてください！
Discussion