バッテラが如く

プログラミングしましょ!

【Unity】ShaderGraphの使い方 (導入方法 〜 簡単な使い方を解説)

最近ShaderGraphという存在を知り勉強中の日々です。
基本的な使い方が分かってきましたので、
導入の仕方と専用エディタの使い方をざっくり解説しようと思います。

■開発環境

  • MacOS Monterey (12.1) Unity (2021.3.2f1)
  • ShaderGraph とは?

    ShaderGraphはシェーダーを作るために新しくできた機能です。

    docs.unity3d.com

    元々シェーダーというのはプログラムを書いて作る必要があり、さらにC#ではなく専用言語で書く必要があるので初心者には全然優しくない代物でした。

    これをプログラマーでも作れるようにしたのがShaderGraphのようです。

    ノードベースでシェーダーを組み立てる感じですが、Blenderにも同じようなものがあるのでモデリングしている方には親和性があるかもしれませんね。

    私はゼロ知識でしたので大変苦労しとります🤮

    ShaderGraphをインストール

    ShaderGraphはインストール作業が必要になってます。

    インストールするには、

    Windows → Package Managerと進みます。

    PackagesUnityRepositryに切り替えます。

    Shader Graphというのを探して、Installをします

    これでShaderGraphは使えるようになりました💪

    ShaderGraphファイルを作成する

    最初にShaderGraphファイルを作成する必要があります。

    作成するには、

    Assetフォルダの中で右クリック → Create → Shader Graph → "BuildtIn/URP" → Unlit Shader Graph と進みます。

    これでShaderGraph ファイルが作成できました。

    ShaderGraphファイルをダブルクリックすると専用エディタが表示されます。

    次項で解説します。

    ShaderGraphエディタの見方

    各パネルがどういった役割をしているのかをざっくり説明しますね。

    MainPreView

    作ったシェーダーがどのように見た目になるかのプレビュー画面です。

    これは特に説明いらないですね。

    MasterStack

    ShaderGraphの一番重要なパネルです。

    ここでNodeを組み合わせてシェーダーを作っていきます。

    Vertexは頂点情報関連で、Fragmentは色関連のNodeを追加して使います。

    ノードの作り方

    作り方ですが2通りありますね。

    1つ目は、
    右クリック → Create Node → 検索までに使いたいノード名を見つける → ダブルクリック で作成する方法です。

    2つ目は、
    既にあるノードの●をドラッグアンドドロップすると作成可能なノードが一覧が出るのでそこから選ぶパターンです。

    GraphInspector

    Nodeの初期値などのパラメータを設定するパネルです。

    Inspectorウィンドウみたいなものです。

    Blackboard

    シェーダーのパラメータを露出させるためのインターフェースを作るパネルです。

    少し説明がややこしやー。

    下図はBlackboardを使わずしてシェーダーを作りマテリアルにセットしたものです。

    それとよく使うデフォルトのStandardシェーダーで比較してみますと・・・

    ShaderGraphで作ったものはは何も変更できないのに対し、StandardShaderでは様々なパラメータを我々が好きなように調整できるようになっています。

    このように作った後から一部をいじるといったことができるようにするにはBlackboardと必要になります。

    ここは実際に使ってみないと言ってること分からないと思いますねー。

    Save Asset

    編集後に左上のSave Assetをクリックしないと保存されませんので忘れないようにしましょう。

    以上が各パネルの簡単な役割についての解説でした。

    ShaderGraphでシェーダーを作るには

    シェーダーで何をしたいのかによって使うノードが変わってきます。それを組み合わせるという感じです。

    以下は自分がやってみたレシピがあるのでよかったら参考にしてみてね。

    www.m2game.net

    www.m2game.net

    ShaderGraphで作成したシェーダーを反映させる

    こっからはShaderGraphと関係あんまないですが、
    シェーダーができたけどじゃあどう使えばいいの?という人もいると思いますので、シェーダの使い方をおさらいしておきましょう。

    ShaderGraphはシェーダーであり、シェーダーがマテリアルが必要になります。

    マテリアルファイルを作るには、

    右クリック → Create → Materialで作成できます。

    次はマテリアルにシェーダーをセットします。

    セットするには、Shaderのプルダウンを開きます。

    この中からShaderGraph → 作成したシェーダー名を選択します。

    これでマテリアルに対してシェーダーをセットすることができました。

    最後にマテリアルをオブジェクトにセットします。

    これでシェーダーを反映させることができました。

    あとがき

    実際にやってみてShaderGraphは難しかったです。

    その理由は2つありました。

    1つ目は、各ノードがどういう挙動するかを理解する必要があるのですが種類も多いため常に迷子になりがちです。

    2つ目は、Unityのバージョンで仕様が変わっているため参考記事が古いとその通りできなかったということです。

    いつか芽が出ると信じてしばらくShaderGraphを積極的に使っていこうと思います。