🌈

そろそろShaderをやるパート63 ShaderGraph 超入門編

2022/03/19に公開

そろそろShaderをやります

そろそろShaderをやります。そろそろShaderをやりたいからです。
パート100までダラダラ頑張ります。10年かかってもいいのでやります。
100記事分くらい学べば私レベルの初心者でもまあまあ理解できるかなと思っています。

という感じでやってます。

※初心者がメモレベルで記録するので
 技術記事としてはお力になれないかもしれません。

下準備

下記参考
そろそろShaderをやるパート1 Unite 2017の動画を見る(基礎知識~フラグメントシェーダーで色を変える)

ShaderGraph 12.xからBiRP(Built-in レンダーパイプライン)でもShaderGraphが利用できるようになりました。

YouTubeのvideoIDが不正ですhttps://youtu.be/Jv6GcNYYKeI?t=277

また、レンダーターゲットを指定することで1つのShaderGraphファイルからBiRPやURP向けShaderを切り替えることができます。

今回は非URP対応プロジェクトに対して、BiRP対応のShaderGraphを作ってみます。
ShaderGraph自体の用意はPackage ManagerからImportするだけなので割愛します。

バージョン情報

Unity2021.2.12f1
ShaderGraph 12.1.4

デモ

色と透明度を操作するだけの超簡易デモです。

基本操作

色と透明度を操作するShaderGraphを作る流れに沿って基本操作をメモしておきます。

まずShaderGraphファイルを作成します。
ShaderGraphを正しくインポートできていた場合、プロジェクトウィンドウのCreateから以下画像のように辿れば作成できます。

作成したShaderGraphを開くとShaderGraphウィンドウが展開されます。
ここに新たに色を変更するためのNodeを作成します。左クリック後、Create Nodeを選択します。

検索ボックスでColorのノードを探して選択します。

次に追加したノードをプロパティーに変換します。これによりInspectorで値を操作可能になります。

プロパティーに変換後、以下の画面のようになります。
右上のGraph InspectorのNode Settingsでプロパティーの詳細設定が可能です。

ここまでの作業をウィンドウ左上のSave Assets押下で保存するとInspectorに反映されます。

同様にFloatのパラメーターを追加します。左上のBlack boardと呼ばれるパネルから追加することもできます。

ただ、このままだと透過しないので、Graph SettingsでBuilt-InのSurfaceTypeをTransparentに変更します。

URPはまだ理解してないので、ShaderGraphに慣れるためにBiRP対応のShaderGraphをしばらく作ってみようと思います。

参考リンク

【Unity】Shader Graphが楽しすぎる!基本的な使い方を紹介

Discussion