色付きの半透明シャドウの使用

このチュートリアルでは、色付きの半透明シャドウをキャストするように Unreal Engine マテリアルを構成する方法について説明します。この機能が役立つアプリケーションはたくさんありますが、一般的な例としては、ステンドグラスの窓を通過した色付きの光が挙げられます。

Unreal Engine における半透明シャドウの色

透過シャドウの色

半透明シャドウの色とは、半透明のサーフェスを通過するシャドウに色がどのように付くかを説明するために使用される用語です。これは、透過 とも呼ばれます。マテリアルを透過する色付きのライトの量は、0 から 1 の オパシティ の値と、マテリアルにキャストされるライトの強度によって決定します。

• たとえば、[Opacity (オパシティ)] の値が「0」に設定されていると、マテリアルは完全に透明になり、色を透過したり、シャドウをキャストしたりすることがありません。
• [Opacity] の設定が「1」の場合、マテリアルは完全に不透明になり、ライトを透過することがありません。
• [Opacity] の値が 0 から 1 の間 の場合、そのオブジェクトを透過するライトはマテリアルの ベース カラー によって着色され、シャドウはその色をいくらか継承します。

さまざまなライティング システムとの互換性

半透明シャドウの色は、すべての Unreal Engine のライティング システムおよび グローバル イルミネーション システムでサポートされているわけではありません。次の表で、どのライティング機能が半透明の色付きシャドウをサポートしているかを示します。

このリストで注意が必要なのは、現在 Lumen のグローバル イルミネーション では半透明シャドウの色がサポートされていないことです。

Lumen のグローバル イルミネーション はすべての新規 UE5 プロジェクトにおいてデフォルトで有効になっているため、レベルで色付きの半透明シャドウを使用する場合は、[Project Settings (プロジェクト設定)] または PostProcessVolume のいずれかで Lumen を手動で無効にする必要があります。

次のセクションでは、半透明の色付きシャドウをキャストするシーンやマテリアルの設定方法について説明します。

UE5 で Lumen を無効にする

次の手順に従い、現在のレベルで Lumen のグローバル イルミネーションを無効にします。

1. ツールバーの [Create (作成)] アイコンをクリックし、[Volumes (ボリューム)] > PostProcessVolume を選択します。

   

2. レベルで PostProcessVolume を選択し、[Details (詳細)] パネルで 「extent」 を検索します。[Infinite Extent (Unbound) (無制限に適用 (アンバウンド))] の設定を有効にして、レベル全体に PostProcessVolume の効果を適用します。

   

3. [Details] パネルで「Global Illumination」を検索します。[Method (メソッド)] 設定を有効にし、ドロップダウンを使用してグローバル イルミネーション メソッドを [Lumen] から [None (なし)] に変更します。

   

   この設定により、現在のレベルの動的グローバル イルミネーションは無効になりますが、ライトマスを使用して静的ライトのグローバル イルミネーションをベイクすることは可能です。

ライティングの設定

ライティングに関する最も重要な考慮事項は、[Mobility (可動性)] が [Static (静的)] に設定されている Light アクタからのみ色付きの半透明シャドウをキャストできるということです。次のライトタイプのいずれかを使用することができます。

• Directional Light (ディレクショナル ライト)
• Point Light (ポイント ライト)
• Spot Light (スポット ライト)
• Rect Light (矩形ライト)

このページの例はすべて、Unreal Engine の「Time of Day」というレベル テンプレートのディレクショナル ライトを使用しています。アウトライナで [Directional Light (ディレクショナル ライト)] を選択し、[Details] パネルの [Mobility] を [Static] に変更します。

間接ライティングを使用すると色付きシャドウが色あせてしまい、マテリアルのベース カラーよりも彩度が低くなる場合があります。レベルで色付き半透明シャドウの表示に問題が発生する場合は、光源の [Indirect Lighting Intensity (間接ライティングの強度)] を下げることを検討するか、調光環境を使用してみてください。

マテリアルの設定

マテリアルのプロパティ

次のブレンド モードやシェーディング モデルのいずれかを使用して、色付きの半透明シャドウをキャストすることができます。

• Blend Mode: Translucent (透過処理)、Additive (加算)、AlphaComposite (アルファコンポジット)、または Modulate (調整)
• Shading Model: Default Lit (デフォルト ライティング)、Unlit (ライティング無し)、または Thin Translucent (薄い透明)

Modulate ブレンド モードを使用する場合は、[Details] パネルの Mobile Separate Translucency プロパティを無効にする必要があります。

Two Sided

Two Sided プロパティの有効化はオプションですが、マテリアルでプレイヤーにメッシュの両面を表示させる場合は必要です。Two Sided が無効な場合、色付きシャドウをキャストするためには、ライトがマテリアルの表示される面にキャストされる必要があります。

ライティングされている半透明のマテリアルを作成する

1. 新しい マテリアル アセットを作成して マテリアル エディタ で開きます。マテリアル グラフ内の任意の場所をクリックすると、[Details] パネルに マテリアルのプロパティ が表示されます。

2. [Details] パネルで [Blend Mode (ブレンド モード)] を [Translucent] に変更します。

   

3. マテリアルの Two Sided プロパティを有効にします (オプション)。

   

4. 下までスクロールして [Translucency (透過処理)] セクションを展開します。[Lighting Mode (ライティング モード)] を [Surface Translucency Volume (サーフェス透過処理ボリューム)] に設定します。

   

5. マテリアル グラフに Texture Sample を追加します。このサンプルではカラフルな幾何学模様を使用してステンドグラスの窓をシミュレートしていますが、他のカラフルなテクスチャでも問題ありません。彩度の高い画像は、彩度の低い画像に比べて色あざやかなシャドウが生成されます。Texture Sample の RGB 出力を Main Material ノード の Base Color 入力に接続します。

   

6. Scalar Parameter を作成して名前を「Opacity」に変更します。Scalar Parameter を選択し、[Details] パネルで [Default Value (デフォルト値)] を 0 から 1 の値に設定します。Slider Max の値を「1」に設定し、[Opacity] スライダーの値の範囲を制限することもできます。

   

7. Scalar Parameter を Opacity 入力に接続します。次の画像のようなマテリアル グラフになります。

   

8. ツールバーで [Apply (適用)]、[Save (保存)] の順にクリックして、マテリアルをコンパイルして、アセットを保存します。

   

ライティングをビルドする

マテリアル エディタを閉じ、マテリアルをレベルにあるスタティック メッシュに適用します。このサンプルでは、Unreal Engine のスターター コンテンツにあるシンプルな平面を使用します。ディレクショナル ライトの角度は平面に対してほぼ垂直なため、シャドウは下の地面に直接落ちます。

ツールバーで [Build (ビルド)] > [Build Lighting Only (ライティングのみビルド)] と移動してライティングをベイクします。ライトマスのビルドが完了すると、色付きの半透明シャドウが表示されます。

シャドウのシャープネス

シャドウのシャープネスは、透過したシャドウの色を受信するメッシュのライトマップ解像度、ライトのソース角度、およびテクスチャ サンプルの品質など、いくつかの要素から影響を受けます。次の画像のように結果がぼやけて焦点が合っていない場合は、受信するメッシュのライトマップ解像度が低すぎる可能性があります。

シャドウが落ちているスタティック メッシュを選択します。このサンプルでは床のアセットです。[Details] パネルで、[Lighting (ライティング)] セクションまでスクロールして下がります。[Overriden Light Map Res (オーバーライドされたライトマップ解像度)] 設定を有効にし、新しいライトマップ解像度を入力します。

スタティック メッシュの大きさにより、シャープなシャドウを表示するためには比較的高い解像度が必要になることがあります。次のスライダーは、ライトマップ解像度を徐々に増やした場合の変化を示しています。

[Light Map Resolution (ライトマップ解像度)] が「256」から「1024」、「2048」、最終的に「3072」まで増えています。

この場合、「256」から「2048」までは劇的に向上しますが、解像度を「3072」まで上げると効果は低下します。ライトマップが大きくなるほどパフォーマンスのコストがかかるため、必要以上に解像度を高くしないように注意してください。

マテリアルのバリエーション

オパシティとシャドウの彩度

マテリアルのオパシティの値は、シャドウの彩度と強度に影響します。次の比較では、3 つのスライドで オパシティ の値が「0.2」から「0.9」に増加したときの変化を示しています。このような屋外の環境では、色付きシャドウはオパシティの値が高いほど見やすくなります。ただし、薄暗い屋内では、オパシティの値が低いほどより良い結果を得ることができます。

「0.2」、「0.5」、および「0.9」のマテリアルのオパシティ。

マスクされたオパシティ

オパシティ マスクは、色付きの半透明シャドウをキャストするとき、期待どおりに機能します。テクスチャのアルファ チャンネルを使用するか、白黒のテクスチャを Opacity 入力に接続して、マテリアルのどの部分を表示したり、シャドウをキャストしたりするかを制御することができます。このプロセスに不慣れな場合は、こちらからテクスチャ マスキング について参照してください。

次の例は、色付きの半透明シャドウをキャストしているマスクされたマテリアルを示しています。マテリアルのプロパティはいずれも変更されていませんが、マテリアル グラフは次のように変更されています。

Opacity Scalar Parameter を直接 Main Material ノードに接続する代わりに、白黒の Texture Sample で乗算されています。マスクの黒い領域は透明ですが、白い円形の領域は表示されます。

ライティングを再ビルドすると、結果は次のようになります。

パス トレーサーを使用した色付きシャドウ

パス トレーサーはベータ機能で、[Project Settings (プロジェクト設定)] でいくつかの設定を有効にする必要があります。パス トレーサーの有効化については、こちらのページ を参照してください。

動的な色付きシャドウはパス トレーサーでサポートされていますが、マテリアルで Thin Translucent シェーディング モデルが使用される場合に限られます。次の手順に従って上述のマテリアルを変更すると、パス トレーサーで色付きの半透明シャドウをキャストすることができます。

1. マテリアル グラフの背景で任意の場所をクリックすると、[Details] パネルにマテリアルのプロパティが表示されます。

2. [Shading Model (シェーディング モデル)] を [Thin Translucent] に変更します。

   

3. [Translucency] セクションまでスクロールして下がり、[Lighting Mode (ライティング モード)] を [Surface Forward Shading (サーフェス フォワード シェーディング)] に変更します。

   

4. 右クリック メニューかマテリアル パレットで 「thin translucent」を検索し、グラフに ThinTranslucentMaterialOutput ノードを追加します。

   

5. Texture Sample の RGB 出力から 2 番目の接続を Thin Translucent Material ノードの Transmittance Color 入力にドラッグして接続します。残りの部分は前の例から変更されていないため、グラフは次の画像のようになります。

   
6. マテリアルをコンパイルし、レベルのメッシュに適用します。

次のビデオでは、パス トレーサーが有効な場合の薄い透明のステンドグラス マテリアルの結果を示しています。パス トレーシング モードでは、色付きシャドウは完全に動的で、平面や光源が回転すると、すぐに更新されます。ビデオでは、マテリアルのオパシティとディレクショナル ライトのソース角度が変更された場合の変化も紹介しています。