道路が途切れて見える。影の設定を二行足したら繋がった

日本進化シミュレーション第6回 ／ 全17回目次

見た目の作り込みを進めていたある日、道路をまっすぐ敷いたはずなのに、画面の中では所々が途切れて見えた。

データを確認すると、道路のセルはちゃんと隙間なく並んでいる。
論理的には一本道のはずなのに、目に見える結果だけがぶつ切りになっている。
データではなく、描画の側に何かがある。僕はそう見当をつけて調べ始めた。

正体はシャドウアクネだった

道路は、薄い箱のようなメッシュを隙間なく並べて作っている。
このゲームは影を落とす仕組みを使っているのだが、光源の影の設定に、深度バイアス（shadow.bias）と法線バイアス（shadow.normalBias）を何も指定していなかった。

薄い板を隙間なく並べた継ぎ目は、自分自身の影を自分に落としやすい。
バイアスが無いと、その自己遮蔽がノイズになって、板の境目に沿った黒い筋として現れる。
これがシャドウアクネと呼ばれる現象で、名前を知ってから見ると、まさにその通りの見た目だった。

直したのは、たった2行

光源にbiasとnormalBiasを設定するだけで直った。
コード量としては本当に2行程度で、それまで悩んでいた時間に対して拍子抜けするくらい小さい修正だった。

3D表示の不具合は、原因が分かるまでの距離が長いものが多い。
「データは正しいのに見た目だけおかしい」という時は、モデルではなく描画の設定側を疑うべきだという教訓が、ここで一つ増えた。

ついでに、轍の筋も足した

この修正のついでに、舗装される前の時代の道路に、轍（わだち）の筋を足した。
道路にはすでに、時代ごとに違う質感を出す手続き型のノイズテクスチャが実装されていた。
これを見落として二重に作りかけたことがあり、既存のコードを先に読む大切さを改めて実感した回でもあった。

轍そのものは、道路の中央線を描くのに使っていたメッシュを、時代別の色で流用するだけで作れた。
新しい仕組みを増やさずに済むと、それだけで気持ちが軽くなる。

「見た目だけおかしい」時のあたりの付け方

今回の件で、自分の中に一つ基準ができた。

データを疑う前に、まずその見た目が「規則的なパターン」を持っているかを見る。
継ぎ目に沿って、一定間隔で、似たような形で現れているなら、それはデータの間違いというより、描画のどこかの設定漏れであることが多い。
データのバグは、もっと不規則で、局所的に出ることが多い印象がある。

次は、この続きの話を書く。
道路の影は日中は直ったが、夜になるとまた別の壊れ方をしていた。

ゲームを1本作るときの進め方を、noteにまとめています（書いているのは私です）。
noteで読む