ゲームエフェクトデザイナーのブログ | A Real-Time VFX Artist's Blog

About Making Materials on UE, Making Tools with C#, etc

NVIDIA Texture Tools Exporter for Adobe Photoshop を使ってミップマップを自作する

テクスチャのミップマップを自作して UE5 で利用するフローについて紹介します。

ここでは DDS を作成して Photoshop で編集するために NVIDIA が提供している「Texture Tools Exporter for Adobe Photoshop」をインストールして利用します。

Texture Tools Exporter のインストール


公式サイトはこちら。

ツールのダウンロードにはアカウントの作成と「NVIDIA Developer Program」に参加を求められます。(アカウント作成時に参加するか質問があるので、これからアカウントを作成される場合はその際に参加すると手っ取り早いです)

そしてページの下にある「Adobe Photoshop Plugin」の方のインストーラーをダウンロードします。

次にダウンロードしたインストーラーを実行してインストールします。
問題なくインストールできたら次の項目に進んでください。

もし古い「NVIDIA Photoshop Plug-ins 64 bit」がインストールされている場合は、こちらのようにプログラムを削除して再度インストールするよう求められます。

その場合は Windows の 設定 > アプリと機能 からアンインストールします。

再度インストーラーを実行、無事インストールされるとこちらの表示になります。

これで準備完了です。

Photoshop でテクスチャを作成して DDS で出力する


UE では PSD / TGA / PNG など一般的なフォーマットの画像をインポートすると UE 側でテクスチャの設定に応じて BC 圧縮が入ったりミップマップが生成されたりしますが、インポート前の時点でミップマップを自作するには DDS ファイルを作る必要があります。

ちなみに筆者の個人所有の Photoshop は未だに CS6 ですが Texture Tools は正常に動作しています。Creative Cloud からインストールした最新の Photoshop 23.5.3 でも同じ UI &同じ動作なのを確認できています。


まずは Photoshop を起動してテクスチャを作成します。

別名保存でファイル形式は DDS を選択。

出力時の設定ウインドウが表示されるので、赤枠内を下記のように設定します。

Format: 8 . 8 . 8 . 8 BGRA 32 bpp |  unsigned
Image Type: Color Map
Generate Mipmaps: True


※ ちなみにウインドウ右側に画像が正常に表示されない場合は Image Type を一度別の設定に切り替えると表示されるようになりました。

また、どんな感じでミップマップが生成されているかは右上の Mip Level のバーをスライドさせるとプレビューできます。

設定が完了したら、ウインドウ右下にある Save ボタンで DDS が出力されます。
これでミップマップ入りの DDS を用意できました。

 

Photoshop でミップマップを編集して再度出力する


ここでは、低解像度である高レベルのミップマップを削除して、残りのミップマップも切り替えが分かりやすいよう色を変えてみます。

まずは先ほど出力した DDS を Photoshop に読み込みます。インポート時のダイアログが表示されるので「Load Mipmaps」にチェックして OK します。

するとこちらのように全てのミップマップレベルが並んだ状態で開きます。
元のサイズが 256 x 256 なので全部で9段階です。

4 x 4,  2 x2,  1 x 1  のミップマップを除去するように切り抜きます。

色も付けました。

上書き保存または別名保存で DDS で保存します。
すると出力設定のウインドウが表示されるので‥

赤枠内を下記のように設定します。

Format: 8 . 8 . 8 . 8 BGRA 32 bpp |  unsigned
Image Type: Color Map
Extract Mipmaps From Atlas: True
Number of Mips in Atlas: 元サイズも含めたミップマップ数を指定
Generate Mipmaps: False


Mip Level を変えてみるとこちらのような感じです。

これでミップマップを編集したテクスチャが用意できました。

UE5 で読み込む


出力した DDS を UE5 のコンテンツブラウザにドラッグ&ドロップで読み込みます。
ちなみに試した際の UE のバージョンは 5.1.0-22346211 です。

テクスチャエディタを開いてミップマップの数を確認すると、ちゃんと Mip Level 5 までしか存在しないことが確認できます。

Mip Level を切り替えると、色もちゃんと反映されています。

UE5 に DDS ファイルをインポートする際にエラーが出る場合は、Photoshop から DDS 出力時の設定を今一度確認してみてください。

以上になります!