タイリングテクスチャをリピート感なく敷き詰める方法はいくつかあるだろうが、この度、またひとつ面白い手法を思いついたので共有する
例えばこのようなテクスチャを平面に張る場合を考える
何も考えなしに張り付けてこんな感じになるだろう
1つの画像だけであればこの通り問題ないわけだが、これが何個もリピートされるとなると、話が変わってくる
UV展開をし直し、リピートさせた
このテクスチャはシームレステクスチャのため、リピートはできる
が、見ての通り、リピート感が目立ち、使えたものじゃない
これを解決するにはいくつか方法はあるだろうが、こういう時に有効な手段を今回思いついた
テクスチャはシームレスで、かつ、四隅がタイルの区切りになっている
だとすれば、そのテクスチャをランラムに回転させればいい感じにリピート感がなくなるのでは?
ということで、これをノードにより実現してみる
ノードは現在こんな感じだ
UVから出てきたベクトル情報をもとにテクスチャがマッピングされている
まずはここにスナップを追加してみる
すると、ベクトルの増分がスナップにより段階的になる
ここではXYZそれぞれに1を設定しているため、1増えるごとに次の数、というような増え方になった
これはUVの画像の範囲と一致する
UVは0-1で一区切りのため、この正方形の四角の隅はこの時、テクスチャの隅と一致する
そしてここに、ホワイトノイズをつなげた
これにより、先ほどの段階的に増えるUV座標が0-1のランダムな数に変換される
さらに、ホワイトノイズから出てきた値を再びスナップする
数値は0.25だ
これにより、0、0.25、0.5、0.75の数値を持ったUV展開と一致する領域が平面上にマッピングされた
これをもとにテクスチャを回転させてやればいいわけだ
テクスチャを回転させるために、ベクトル回転を追加した
これにより、テクスチャを回転することができる
その回転度合いを、先ほどの四角の領域で、90度ずつ回転するようにすればよい
つまりこういうことだ
スナップから出てきた数値は0、0.25、0.5、0.75なので、それに360を乗算して最大で270度回転するようにする
それをラジアンに変換し、テクスチャの入力を回転させる
ちなみに、乗算に中途半端な値を入れるとこうなる
先ほどの四角の領域ごとにテクスチャが回転しているのがわかる
ついでに、これらのノードをノードグループにまとめてみた
場合にもよるが、これを通せば、リピート感を大きく減らすことができる
入力はベクトルならなんでも大丈夫なので、ジオメトリの位置でも同じく入力にすることができる
あとは、テクスチャの補完を近接に変えると、よりきれいにテクスチャが張られる
厳密にいえば、この方法はシームレスではなく、たまたまテクスチャの端が要素の端になるときのみに使える
ただ、テクスチャによっては今回の紹介のように、十分使える技術だと思うので、なんとなく、ここで静かに公開しておく
Tweet
この記事をツイートする
Youtubeやってます!
作品発表、メイキング、解説もやってます
よろしければ高評価、チャンネル登録、よろしくお願いします
お仕事募集中です!
お問い合わせはツイッターのDM、またはお問い合わせフォームまで
お気軽にご相談ください