【Unity】初めて『シェーダーグラフ』でシェーダーを学んでみる 基礎編.㊲

 f:id:Effect-Lab:20180506132430j:plain

 

こんにちは。

 

シェーダーを一度も触った事のないデザイナーが、Unityの「シェーダーグラフ」を使ってシェーダーを学んでみるシリーズ。

 

このシリーズでは、公式のサンプルシーンを元に僕がシェーダーグラフで学んだ事を解説していきます。
シェーダー学習初という事もあり、たくさんの方のブログを拝見し、勉強させていただきました。
このシリーズには僕が参考にさせていただいたブログのリンクを貼らせていただいておりますので、そちらも併せて読んでいただくとより一層理解が深まるかと思います。
 

 

今回は「基礎編.㊲」という事で、公式のサンプルシーンにある上の画像の雲模様のようなシェーダーがどのように作られているかを解説します

 

 

 まずはこちらの記事で紹介したサンプルシーン「Shader Graph Example Library」を開いてください。

 

シーンは開けましたか?
それではシェーダーの解説に入ります。

 

 シェーダーを開く

サンプルのシーンを開いたら、「Procedural-Noise-ColorBlend」というファイルをダブルクリックして下さい。

f:id:Effect-Lab:20180506132513j:plain

 

するとシェーダーグラフのエディターが立ち上がります。
※Propertyにコンバートされていたノードは「Convert To Inline Node」で元に戻してあります。
※各種パラメーター値はマテリアルの値に変更しています。

f:id:Effect-Lab:20180506134543j:plain

  

 全体の流れ

個々のノードを見ていく前に、このシェーダーが何をしているのか、全体の流れを軽く把握していきましょう。

f:id:Effect-Lab:20180506134652j:plain

このシェーダーは、①で雲模様のようなノイズの値を作り、それを基にLerpノードで2色を塗り分けて作成されています。

f:id:Effect-Lab:20180506135745j:plain

 

 重要ノード群の解説

さて、全体の流れを把握した所で、今回のシェーダーで重要な役割を持つノードを詳しく見ていきましょう。 

 

 ① Simple Noise

f:id:Effect-Lab:20180506135849p:plain

このノードは、雲模様のようなノイズの値を作るノードです。

Scaleの値を変更するとノイズの細かさを調整する事ができます。

 

 完成!

f:id:Effect-Lab:20180506135745j:plain

これで今回のシェーダーは完成です!

 

 まとめ

このシリーズの基礎編も、今回を含めて残すところあと9個となりました。
今回からは、今まで以上にエフェクトに使われそうなシェーダーが登場します。
さっそくノイズを加えるという使用頻度が高そうなノードも出てきました。
あと少し、頑張っていきましょう!

さて、今回覚えるべきノードは1つです。

  1. Simple Noiseでノイズをつくる!

 

この1つを覚えたら次へ進みましょう!