【Unity】Shader Graph の触り方

注意（2018/5/8）

この記事は Unity 2018 がまだベータ版だった頃に書かれた記事で、
導入手順などが古いためご了承ください

はじめに

Unity 2018.1.0b2 からノードベースのシェーダエディタ
「Shader Graph」が使えるようになりました

そして「Shader Graph」の使い方がこちらのフォーラムに記載されていたので、
このフォーラムの内容を一部翻訳して、この記事で紹介していきます

Shader Graph の触り方

Unity 2018.1.0b2 で「Shader Graph」を試すためには
専用のサンプルプロジェクトをダウンロードする必要があります

https://oc.unity3d.com/index.php/s/mWv6mGlHtCHfz7S

上記のページにアクセスして
「Download LightweightAndShaderGraph.zip」ボタンを押して
ダウンロードした「LightweightAndShaderGraph.zip」を展開して
中にある「LightweightAndShaderGraph」フォルダを Unity で開きます

プロジェクトを開いたら、Project ビューの「Create」を押して
「Shader Graph」を選択します

そして、作成した Shader Graph のファイルをダブルクリックするか、
Inspector の「Open Shader Editor」を選択すると、

シェーダの編集ウィンドウが表示されます
最初は「マスターノード」のみが存在します

上記のスクリーンショットのように、マスターノードのパラメータを編集するだけでも
シェーダをカスタマイズすることが可能です

ノードを追加したい場合は編集ウィンドウを右クリックして「Create Node」を選択します

例えば、Color ノードを追加したい場合は、検索欄に「Color」と入力して
表示された「Color」を選択します

これで、Color ノードが作成されました

そして、Color ノードの色を設定して、マスターノードに接続することで

Color ノードで設定した色が反映されます

テクスチャを反映したい場合は、Sample Texture 2D ノードを使用します

Shader Graph を保存したい場合は「Save」ボタンを押します

作成した Shader Graph は通常のシェーダと同様に使用できます
Shader Graph のファイルを右クリックして「Create>Material」を選択すると

作成した Shader Graph が割り当てられたマテリアルが作られます

また、例えば、テクスチャをマテリアルの Inspector から設定できるようにしたい場合は
上記のように Texture 2D Asset ノードを作成して、
Texture 2D Asset ノードと Sample Texture 2D ノードを連結して

Texture 2D Asset ノードを右クリックして「Convert To Property」を選択します

すると、Texture 2D Asset ノードが Property ノードに変換され、
シェーダの Properties に追加されます

マテリアルの Inspector を見てみると、
テクスチャのプロパティが追加されていることがわかります

作成したプロパティの名前で上記の入力欄で変更できます

サンプル

GitHub でいくつか Shader Graph のサンプルプロジェクトが公開されています

関連記事