リムライトでキャラクターを際立たせる
UnrealEngine5を使用したアニメ調表現の第5回です。
このWebページでは、アニメ調シェーダーの作成やアウトラインの制御と安定化を行いました。
今回は、リムライトを追加しキャラクターにドラマチックな光の演出をします。
リムライト (Rim Light)とは
リムライト (Rim Light)とはバックライトとも呼ばれる、キャラクターの背後から当たる光によって、輪郭のフチだけが光って見えるライトのことです。アニメや映画では、キャラクターを背景から際立たせ、立体感を強調するために使われます。
リムライトの発生条件
今回の目標は、マテリアル内で以下の条件を満たすピクセルを特定し、指定した色で光らせる仕組みを作ることです。
リムライトが発生する条件を、下記の2つに分け、それぞれのノードを作成後2つをかけ合わせます。
- フチ（輪郭）の特定
- 陰（光源の反対）側の特定
| フチの特定 | カメラの視線と表面が直角に近い部分を見つける。 |  |
|---|---|---|
| 陰側の特定 | 光源の方向と表面が反対を向いている部分を見つける。 |  |
| 「フチ」と「陰側」の統合 | フチの特定と陰側の特定の結果を掛け合わせ、リムライトの色と強さを設定。 |  |
これらを掛け合わせることで、「陰側のフチ」だけを検出します。
最終的に、前回のアニメシェーダーとブレンドし
最終 Color = 「フチ」と「陰側」の統合 + アニメ調シェーダー
以上がシェーダーの全体の流れです。
フチの特定
前回のマテリアルノードの読み込み
今回は、Part1で作成したアニメ調（トゥーン）シェーダーマテリアルを読み込みます。
これに、リムライトを追加していきます。始めましょう！
フチの部分を白くする仕組みの作成
フチの部分が1.0（白） になり、正面の部分が 0.0（黒） になる値を作成します。
マテリアルグラフ上でTabキーを押すか右クリックしてcameravectorwsと入力します。
ノード名: Camera Vector（カメラ方向）
役割: カメラが向いている方向を取得します
マテリアルグラフ上でTabキーを押すか右クリックしてVertexNormalWSと入力します。
ノード名:VertexNormalWS （カメラ方向）
役割: メッシュ表面の向き（法線）を取得
Dot Product ノードを配置
マテリアルグラフ上でTabキーを押すか右クリックしてDot Productと入力します。
ノード名: Dot Product（内積）
役割: 2つのベクトルの「一致度」を計算
Camera Vector → AVertexNormalWS → B
に接続します。
確認の為マテリアルのEmissiveColorに接続してみます。
カメラ正面に向いているフェースが明るくなり、カメラに対し斜めのフェース（縁）が暗くなりました。
One Minus ノードを配置
マテリアルグラフ上でTabキーを押すか右クリックしてOne Minus と入力します。
ノード名: One Minus
役割: 1から入力値を引く（反転）
Dot Product の出力をOne Minus ノードに接続します。
確認の為マテリアルのEmissiveColorに接続してみます。
フチが明るくなりました。リムライトの原型の完成です。
フチの強調（Rim_Sharpnessの追加）
現状では光の幅が広すぎるのでコントラストを上げてシャープにします。
Power ノードを配置します
ノード名: Power
役割: 数値を累乗（べき乗）する
Scalar Parameter を配置します
マテリアルグラフ上でTabキーを押すか右クリックしてScalar Parameterと入力します。
ノード名: Scalar Parameter
役割: 後から変更可能な数値を設定する
名前を Rim_Sharpness とします。
デフォルト値（例）を3.0としました。この数値は後々変更可能です。
One Minus の出力→ Base ピンに接続し、Rim_Sharpness → Exponent ピンに接続します。
確認の為マテリアルのEmissiveColorに接続してみます。
コントラストが上がりフチがシャープになりました。
陰側の特定
現状は、フチの部分全てにライトが当たっている完全逆光ライティング状態です。このままでもよいのですが、少し変化をつけたいと思います。
光が当たっていない部分が1.0 （白）になる値を作成します。
前回使用したSkyAtmosphere Light Directionを今回も使います。
ノード名: SkyAtmosphere Light Direction
役割: シーン内の太陽光の方向を取得する
先ほどと同様のVertexNormalWS を作成します。
ノード名:VertexNormalWS （カメラ方向）
役割: メッシュ表面の向き（法線）を取得
先ほどと同様のDot Product ノードを配置します
ノード名: Dot Product（内積）
役割: 2つのベクトルの「一致度」を計算
先ほどと同様のOne Minus ノードを配置します
ノード名: One Minus
役割: 1から入力値を引く（反転）
SkyAtmosphere Light Direction → AVertexNormalWS → B
に接続します。Dot Product の出力をOne Minus ノードに接続します。
確認の為マテリアルのEmissiveColorに接続してみます。
ライトの当たっていない側が明るい状態が出来ました。
この陰影と先ほどのリムライトを重ね合わせることでライトの当たっていない側のフチのみを明るくすることが出来ます。
「フチ」と「陰側」の統合
フチの特定と陰側の特定の結果を掛け合わせ、リムライトの色と強さを設定します。
光る場所の特定
Multiply ノードを配置します。
ノード名:Multiply
役割: 2つの値を掛け算する
Aピンに ステップ 2-1 の Power の出力（フチの強調結果）を接続します。
Bピンに ステップ 2-2 の One Minus の出力（陰側の検出結果）を接続します。
両方がブレンドされ、リムライトの明暗に変化が付きました。
色と強度の適用
Vector Parameter を配置し、名前を Rim_Color とします。
Vector Parameterとは？
一言で言えば、Scalar Parameterの「色・ベクトル版」です
「Scalar（スカラー）」が 1.0 や 0.5 といった1つの数字を扱うのに対し、「Vector（ベクトル）」は R・G・B・A という4つの数字をセットで扱います。
マテリアルインスタンスからカラーパレットを使って直感的に色を変えたい時や、ライトの「方向」を指定したい時に欠かせないノードです。
水色など、リムライトの色を設定します
Multiply ノードをさらに配置し、Rim_Color→ A
1.の結果 (光る場所) → B
に接続します。
リムライトのグラデーションを2階調のアニメ調に
現状のリムライトの陰影はグラデーションの状態です。これを2階調のアニメ調に変更します。
階調の数値を後々変更できる様に、先ほども使用したScalar Parameter を配置します
名前を Rim_Threshold とします。
デフォルト値（例）を0.2としました。この数値は後々変更可能です。
ノード名:Step
役割: 閾値より大きいか小さいかで0か1 を出す
こちらで一旦アニメ調のリムライト完成とします。
パラメータの調整と効果
実装したリムライトの、Scalar Parameterの値を調整してみましょう。それぞれの値を動かすことで、キャラクターの印象が変わります。
| パラメータ | 役割 | 効果 |
| Rim_Sharpness | 光の境界線の鋭さ（減衰） | 値を大きくするほど、光の当たり方が急峻になり、フチに向かって鋭く絞り込まれます。 |
| Rim_Threshold | リムライトの表示範囲 | Stepノードのしきい値です。値を大きくすると光の面積が狭くなり、小さくすると広くなります。アニメ的な「線の太さ」を調整する感覚で使用します。 |
| Rim_Color | リムライトの色と強度 | 色を変えるだけでなく、カラーピッカーの値を 1.0 以上 に設定することで、発光（エミッシブ）のような強い輝きを与えることができます。 |
Rim_Sharpness と Rim_Threshold は似ているように見えますが、結果が異なるので視覚的に確認して適時調整をお勧めします。
リムライトとシェーダーの統合
完成したリムライトをPart1の回で作成したアニメ調シェーダーの結果に統合（ブレンド）していきます。
前回作成したアニメ調シェーダーのPowerノードのアウトプットを新規追加するノード（赤部分）上側に接続します。
先ほど作成したリムライトノード（オレンジ部分）のStepノードのアウトプットを新規追加するノード（赤部分）下側に接続します。
ブレンドの方法による結果の違い
新規追加するノード（赤部分）は、種類（ブレンド方法）によって結果が変わります。
好みや表現する世界観によって、より良いものを選び、使い分けてください。
Add ノードは、マテリアル内で加算（Add）を行うノードです。
最終色 = シェーダーカラー + リムライトの色
Add の問題点
単に 既存の Base Color + リムライトの色 で Add すると、色の彩度が高くなりすぎたり、色の情報が白飛びしたりする傾向があります。
MultiplyAdd ノードは、マテリアル内で乗算（Multiply）と加算（Add）を一度に行う複合ノードです。
MultiplyAdd の利点（Base Colorとの統合）
リムライトの結果を既存の Base Color に統合する際、MultiplyAdd を使うことで、リムライトを「加算」として扱うだけでなく、Base Color に対して特定の光の影響を乗算でブレンドするような、より自然な統合が可能になります。
アウトラインの追加（任意）
Part2で作ったアウトラインも追加してみました（こちらはお好みで）。
接続ノード全体図
アニメ調シェーダーにリムライトが追加された最終的な状態です。
本日接続したノードは黄色く選択されている箇所です。
まとめ
今回は、キャラクターの輪郭に光を加える「リムライト」の実装に挑戦しました。
リアルな物理計算では滑らかに消えてしまう光のフチも、UE5のマテリアルノードを駆使することで、アニメ特有の「パキッとした境界線」として表現できるようになりました。
今回のポイント
- 「フチ」を数値化する:
Dot ProductとOne Minusを使い、カメラから見て「面が真横を向いている部分」を特定しました。 - アニメ調の要「Step」ノード: グラデーションを強制的に 0 と 1 に分けることで、セルルックな質感を生み出しました。
- ライティングとの連動:
SkyAtmosphere Light Directionを活用し、シーンの太陽光の位置に合わせて光る場所が自動で変わる仕組みを作りました。 AddMultiplyAddによる統合: 単なる加算ではなく、既存のベースカラーを活かしながら色を乗せることで、深みのある最終画質を実現しました。
リムライトは、キャラクターを背景から際立たせ、3DCG特有の「のっぺり感」を解消するための非常に強力な武器になります。Rim_Threshold や Rim_Color を調整して、あなたのキャラクターに最適な「光の演出」を見つけてみてください。