0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Unity】Decal用Shader Graphでスポットライトっぽいデカールを作る

Posted at

作るもの

Decal_SpotLight_5-7s.gif

中心の球をミラーボールに見立ててURP Decal ProjectorでUnitychanマークを貼っています。
ミラーボールに近い部分は小さくなって、照明感が出ていますね。出ているんですよ。

環境

Unity6000.2.8f1

実装

Claude AIさん作のイメージ図

image.png
スポットライトっぽくしたい場合、本来のデカールは四角く並行投影でテクスチャを貼り付けるところを、円錐形にゆがめればいいことがわかります。

円錐形にゆがめるには、照明の位置(円錐の頂点)からの、「デカール直方体ローカル座標系」における色を塗りたい場所の座標が分かればよさそうですね。
照明の位置に近いほどUV座標を中心(0.5)に寄せつつ、且つ円形にアルファクリップするわけです。

Decal Shader Graphで取得できる情報

image.png
これで、色が塗られる不透明ピクセルの、「デカール直方体ローカル座標系」における座標が手に入ります。
座標系は以下のようになっています。

image.png

デカールの底面がxz平面であり、底面の中心がx=z=0であること。デカールの奥行きがy軸であり、一番奥のy座標1であること。これがわかれば、ローカル座標の意味するところは明らかです。

Shader Graph

image.png
まぁ許容範囲の複雑度かなという感じ。

  1. 円錐の頂点からy座標が近いほどテクスチャを縮小(より0.5から遠いUv座標を参照)
  2. 円形スポットライトなので、UV座標を見て円形に切り抜き
  3. 気分が乗ってきたのでUV座標回転

という処理になっています。

補足

デカールの仕組みについて

URP Decal Projector含め一般的なデカールは、メッシュとしてはただの直方体です。ただの直方体でどのようにしてデカールのような面白い表現ができているかというと、既に書きこまれた深度バッファを見ることで、その直方体と不透明メッシュとの、カメラから見える交差面を取得できるからです。(3D空間で考えると、直方体のメッシュから、視線方向に深度の差分だけ進めば交差点が見つかる)

理解しておくべきなのは、デカールというのはデカールの色を塗る前に、「ここは色を塗るべきかな」と判断するための深度バッファ参照が行われているということです。決して軽い処理ではないということですね。必要なら使えばいいですが、デカールの直方体が無駄に大きくならないよう注意すると良いです。

ところで、デカールの実体がただの直方体であることを考えると、Shader GraphのPositionノードで取得できる値が不思議です。本来であれば直方体の表面の座標が渡ってくるはずです。多分ここは使いやすいようにUnityさんが、視線の方向とデプスバッファを参照して計算した結果に変更してくれているのだと思います。Decalの場合はその方が使いやすいだろうということですね。
親切ではあるんですが、説明が欲しい……気はします。

ライトクッキーを使えばいいのでは?

image.png
……?

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?