【Unity】シェーダー学習ログ #4
前回はこちら。
いきなり混乱
今回もこちらの動画を見ながら進めてみよう。
前回の時点で、オブジェクトの輪郭&衝突部分のアルファを調節できた。お次はそいつに「模様をつける」という工程。テクスチャとノイズの乗算で、適当にUVアニメーションさせるらしい。
解説「一見複雑そうに見えますけどやってる事は単純なんで飛ばし飛ばしでいきますね~」ぼく「ちょっとまってわかんないがすぎる」
情報量が多くて脳の理解が追いつかないので、ひとつひとつ分解して進めてみる。
UVスクロールさせる
テクスチャは、GIMPの新聞印刷機能を使ってクッソ雑な水玉模様(目に悪い)を作った。ループデータになってないので繋ぎ目が不自然だが、今はとりあえず動けばいいから気にしない事とする。
ググりながら作ったグラフがこちら。テクスチャのUとVを同じ速度で移動させている手抜き仕様だが、とりあえずこれでヨシとする。
まず、ドタマにTimeノードを置いてやる。Timeの出力には色々と種類があるようだが、「とりあえず一番上のTime使っときゃええねん」的な雰囲気を感じる。詳細はぶっちゃけ分からんが、みんなそうしてるのでそうする。
しかし愚直にTimeノードを繋ぐだけだとスピード調整ができないので、Multiplyで係数を掛けていい感じの速度に調整してやる。UV座標を変えていくと勝手にテクスチャがループするので、TillingAndOffsetの「Offset」にTime(を調整したもの)を入れると、それっぽくUVがループしてくれるようだ。
あとはそいつを、SampleTexture2DのUVに入れる。これで万事OKだわ。
そうすっと、無事UVがアニメーションするようになった。やったぜ。
パーリンノイズを使う
あとは、なんかあのモヤモヤしてる模様…動画で「ノイズ」と呼ばれている奴だが、Gradient Noiseノードとかいうやつで生成しているそいつの正体を探りたい。
ノードの説明を眺めてみると、「入力 UV に基づいて、グラデーションノイズ (パーリン ノイズ) を生成します。」と書いてある。パーリン…!?
調べてみたところ、パーリンさん(偉い人)が発明した、様々な用途に使えるすごいポテンシャルを秘めたサムシングのようだ。←よく分かっていない
試しにノードを置いてみたところ。Scaleを弄れば、拡大率というかモヤり具合が変わるようだ。数値が低ければ低いほど大雑把な感じになっていく。
さっき作ったUVアニメーションとノイズを乗算合成奴。水玉とノイズの速度はそれぞれ別指定できるようにしている。しかし、この模様をずっと眺めてるとだんだん精神が不安定になってくるなぁ。なんだかtanasinnを感じる。
その結果を乗算合成すれば、前回つくった衝突判定&輪郭奴と合体できる。
現時点でこんな感じ。モデルの中心部が透けつつ、輪郭とオブジェクトのキワはアルファが濃くて、ノイズでややモヤモヤした感じのUVスクロールもこなすキメラが爆誕している。
ストライプを作る
これだけでは終わらないようで、Sineノードを作ってストライプを造り、これも合成することでもっとエモエモにできるっぽい。UVのUだけ取り出して速度調整した上で、U方向にストライプを流している。
Remapノードについての説明はサラッと流されていたのだけれど、これを挟むとストライプの幅調整ができるらしい。俺の乏しい三角関数の知識だと、sinθの取りうる範囲は-1~1だったはずなので、そいつをRemapノードに入れて-1部分を0に補正する事で幅調整を実現している…という解釈で良いのだろうか。リファレンス読むの下手ニキだから間違えてたらすまんやで。
この時点の出力を愚直にメッシュのアルファへ適用したところ。たしかに、0~1のアルファがメッシュ全体を駆け巡っている。
ただ、Blenderでシームをズバズバ切った所がモロバレで違和感あるので、そもそもUVアニメーションさせたいときはキレイにUV割り当てられてるオブジェクトでやった方が良いんだろうな。
そいつをさっき作ったUVスクロール奴に合成。このBlendのOverlayとかいう奴は、早い話が「暗い所をさらに暗く」「明るい所をさらに明るく」というコントラストをつける合成方法らしい。
その出力をMultiplyしてさらにクッキリさせたり、Maximumノードを使って暗すぎる所を底上げするようなイメージ。
やることが・・・やることが多い・・!
成果物
ぜんぶ合体させ奴。なんだかわからんがすごいぞ!
ちょっとシェーダーを猿真似するだけでも新キャラというか新しいノードがガンガン出てくるので、そいつらをうまく使いこなせるようにならないとだなー。いつかは俺オリジナルのシェーダー組んでドヤりたい。
この記事が気に入ったらサポートをしてみませんか?