はじめに
自身が自主制作しているゲームにて、チェック柄のマテリアルを使用している。
そのマテリアルについて、チェック柄のテクスチャをそのまま描画していたため、テクスチャを使用している分、無駄な負荷になっていた。
そのため、どこに置いてもチェック柄になるようなシェーダーを作成した。
作成手順
処理の手順を簡単に説明すると以下のような感じ...
ローカル座標を整数グリッド化
→ XYZ の偶奇を判定
→ 合計の偶奇でチェック柄にする
作成にはシェーダーグラフを使用している
１．オブジェクト空間の座標を取得
チェック柄が回転で崩れないように、PositionノードをWorldにして使用する。
シェーダーグラフ内
Position(World)
２．セルサイズで割る→整数グリットに落とし込む
Divideノード→Floorノードによって、ワールド空間を「立方体のグリッド」に分割する。
これをすることで、XYZそれぞれが整数値になる。
シェーダーグラフ内
pos = floor( objectPos / cellSize )
３，XYZそれぞれの偶奇を判定する
XYZの各軸ごとに
シェーダーグラフ内
frac( (pos * 0.5) ) * 2
をすることで、
偶数：０
奇数：１
というマスクが得られる
４．XYZの偶奇を合計し、その合計の偶奇を再判定する
３軸のチェック柄は「合計の偶奇」で決まる。
シェーダーグラフ内
sum = xParity + yParity + zParity
finalMask = (sum % 2)
ShaderGraph では：
Add（X + Y）
Add（+ Z）
Multiply（0.5）
Frac
Multiply（2）
という構成で %2（偶奇判定）を実現している。
これにより：
偶数 → 0
奇数 → 1
という 3D チェック柄マスクが完成する。
（「X XOR Y XOR Z」をしてる）
５．Lerp で２色を切り替える
最終マスクを使って、２色を切り替える。
シェーダーグラフ内
color = lerp(colorA, colorB, finalMask)
メリット
テクスチャを使った描画よりも軽い。
処理が単純で、同じ色であれば同様のマテリアルが使えるため、その分軽いはず。
デメリット
角度をつけた際に崩れる。
座標を四角に捉えて描画しているので、平面じゃないと以下のような感じでチェック柄が崩れてしまう。
左が角度０の四角形、右が角度をつけた四角形