3DCG

ノーマルマップの向きって?DirectXとOpenGLの違いは?

  • #Blender
  • #normalmap
  • #モデリング
  • #ゲーム
ノーマルマップを適用したメカの3DCGレンダリング

よく聞くノーマルマップってなんでしょう?

直訳すると普通のマップ…ではないんですね。 ノーマルとは法線のことで、これをテクスチャに書き込むことで疑似的に法線を操り細かいディテールを再現しています。

この記事でわかること:

  • ノーマルマップとは何か?
  • DirectX?OpenGL?
  • ソフトごとの対応
  • 発注時に確認しておくと安心なこと

ノーマルマップとは何か?

ノーマルマップとは、細かい凹凸や質感を、より低ポリゴンで再現するべく生まれた技術で、ローポリゴンでもハイポリのようなディテールを付加することのできる魔法のようなテクスチャです。 正体は凹凸をRGBに割り当て法線の向きを操作し、光の影響をコントロールしています。 テクスチャなのでポリゴンの間にも細かな凹凸をつけることができます。 通常、青紫色になることがほとんどです。

一般的なノーマルマップの例。全体が青紫色で、凹凸の縁に緑やピンクの色が乗っている

生成するにはハイポリゴンからのベイクが必要です。

ベイクにはBlenderのCyclesのほか、Substance 3D PainterやMarmoset Toolbagなどがよく使われます。

なぜ青紫色なのか

ノーマルマップ(正確には「タンジェントスペース」のノーマルマップ)は、法線の向きをX・Y・Zの3方向に分け、それぞれをR(赤)・G(緑)・B(青)に割り当てて保存しています。

  • R(赤):左右方向の傾き
  • G(緑):上下方向の傾き
  • B(青):面の正面方向

凹凸のない平らな部分は「真正面を向いた法線」なので、RGBでいうと (128, 128, 255) 付近になります。これが、あの独特の青紫色の正体です。

タンジェントスペースとオブジェクトスペース

ノーマルマップには、法線の向きを「どこを基準に記録するか」で2つの種類があります。

種類 法線の基準 見た目 主な用途
タンジェントスペース ポリゴンの面そのもの 青紫色が中心 ゲーム・映像など、ほとんどの場面
オブジェクトスペース オブジェクト全体の座標軸 赤・緑・青が混ざったカラフルな色 変形しない静的なモデルなど、限られた場面

オブジェクトスペース は、法線の向きをオブジェクト全体のX・Y・Z軸を基準に記録します。向きをそのまま記録するため精度は出しやすい一方で、メッシュが変形するキャラクターのアニメーションには向かず、同じテクスチャを別の向きのパーツに使い回したり、左右対称(ミラー)のUVで共有したりすることもできません。

タンジェントスペース は、それぞれのポリゴンの面を基準に「面に対してどちらへ傾いているか」だけを記録します。基準が面にくっついているので、メッシュが変形しても、パーツを回転させても、同じテクスチャを使い回しても正しく表示されます。この扱いやすさから、現在はタンジェントスペースが標準になっています。

一般的に「ノーマルマップ」と言えばタンジェントスペースのことを指し、Blenderの「ノーマルマップ(Normal Map)」ノードも初期設定はタンジェントスペースです。この記事でも、ここから先はタンジェントスペースのノーマルマップについて解説します。

DirectX?OpenGL?

ノーマルマップには、大きく分けて DirectX形式 と OpenGL形式 の2種類があります。

名前はグラフィックスAPIに由来していますが、実際の違いはとてもシンプルで、G(緑)チャンネルの向きが逆になっているだけです。

形式 Gチャンネル(緑)の向き 別名
OpenGL 上向きがプラス Y+
DirectX 下向きがプラス Y-

下の図は、同じ形状(上段は出っ張り、下段はへこみ)を、それぞれの形式でノーマルマップにしたものです。

OpenGLとDirectXのノーマルマップの違い。法線が+Y方向を向いた部分は、OpenGLでは緑、DirectXでは紫になる

OpenGLでは、メッシュの法線が +Y方向(テクスチャの上方向) を向いている部分が緑になります。DirectXではY軸の向きが逆なので、−Y方向 を向いている部分が緑になります。同じ形状でも、上辺と下辺の色がちょうど入れ替わっているのがわかると思います。

たったこれだけの違いですが、形式を間違えると次のような症状が出ます。

  • 出っ張っているはずの部分が、へこんで見える
  • 光が下から当たっているように見える
  • 見る角度によって、陰影に違和感がある

「ディテールは出ているのに、なんだか変」というときは、まずこの形式違いを疑ってみてください。

見分け方のコツ

ノーマルマップの画像を見て、ボタンやボルトなどの出っ張りの上側が明るい緑っぽく見えればOpenGL、下側が明るい緑っぽく見えればDirectX、と覚えておくと判断しやすくなります。

とはいえ、画像を見ただけでは判断しづらいことも多いので、ファイル名に _gl や _dx を付けて管理しておくのがおすすめです。

ソフトごとの対応

主なソフトやゲームエンジンが、どちらの形式を前提にしているかをまとめました。

ソフト・エンジン 形式
Blender OpenGL
Maya OpenGL
Unity OpenGL
Unreal Engine DirectX
3ds Max DirectX
Substance 3D Painter 書き出し時に選択可能

ソフトのバージョンや設定によって扱いが変わる場合もあるので、実際の案件では使用するバージョンの公式ドキュメントもあわせて確認してください。

形式が違うときの直し方

形式が合っていないときは、Gチャンネルを反転すれば変換できます。

  • Photoshop:チャンネルパネルで「グリーン」だけを選び、「色調補正」→「階調の反転」(Ctrl + I)
  • Blender:シェーダーノードで「カラー分離(Separate Color)」→ Gだけを反転(1 − G)→「カラー合成(Combine Color)」の順につないでから、「ノーマルマップ(Normal Map)」ノードへ
  • Unreal Engine:テクスチャの設定にある「Flip Green Channel」にチェックを入れる

Unreal EngineでOpenGL形式を使う場合

Unreal EngineはDirectX形式が基本ですが、テクスチャの設定画面の「詳細設定」にある Flip Green Channel にチェックを入れると、Gチャンネルが反転され、OpenGL形式のノーマルマップもそのまま使えます。

Unreal Engineのテクスチャ設定画面。詳細設定の中にFlip Green Channelのチェックボックスがある

ただし、この方法はあまりおすすめしません。テクスチャごとにチェックの有無を管理することになるため、「どれが反転済みか」が分かりにくくなり、設定漏れの原因になります。プロジェクト内のノーマルマップは、最初からDirectX形式にそろえておく方がスマートです。Flip Green Channelは、形式の違う素材を急ぎで使いたいときの応急処置と考えておくとよいでしょう。

Blenderでノーマルマップを読み込むときは、画像テクスチャノードの色空間を 「非カラー(Non-Color)」 にするのも忘れずに。ここが「sRGB」のままだと、形式が合っていても正しく表示されません。

発注時に確認しておくと安心なこと

3Dモデルを外注する場合、ノーマルマップの形式は意外と伝え漏れが起きやすいポイントです。次の点を最初に共有しておくと、納品後の手戻りを防げます。

  1. 最終的に使うソフト・エンジン:Unreal EngineなのかUnityなのか、Webなのか
  2. ノーマルマップの形式:DirectXかOpenGLか(1が決まっていれば、制作側で判断できます)
  3. ファイル名のルール:_normal_dx のように、形式が分かる名前にしてもらう
  4. テクスチャの解像度と枚数:2K・4Kなど、用途に合わせたサイズ

まとめ

  • ノーマルマップは、法線の向きをRGBに記録して、ローポリゴンでも細かな凹凸を再現するテクスチャです。
  • 青紫色なのは、平らな面の法線がRGBの (128, 128, 255) 付近になるためです。
  • DirectXとOpenGLの違いは、Gチャンネル(緑)の向きが逆なことだけです。
  • 形式を間違えると凹凸が逆に見えるので、Gチャンネルを反転して合わせます。
  • 外注するときは、使用するエンジンと形式を最初に共有しておくと安心です。

Blenda Coreでは、ゲームエンジンやWeb向けのテクスチャ制作・データ変換のご相談も承っています。お気軽にお問い合わせください。