17.3K Views
April 14, 23
スライド概要
2021年11月に銀座Unityもくもく会でLTした資料です。
フリーランスのTAです。 主にもくもく会でのLT資料などをアップロードしたいと思います。
AmplifyShaderEditorはいいゾ おかひろ
自己紹介 おかひろ Twitter:@okahiro_p フリーランスのゲームプログラマー ソシャゲ4年半、ハイパーカジュアル半年 最近はHoudiniを勉強している 東方放置譚、東方地風陰、東方弾闘戯、咲夜ナイフというゲームをリリース
AmplifyShaderEditorとは Unity向けのノードベースShaderEditor https://assetstore.unity.com/packages/tools/visual-scripting/amplify-shadereditor-68570 ノードベースShaderEditor? ShaderLabを書かずに、ノードを配置してつなげるだけでShaderを組むことができる ShaderLab(C#ではない) ノードベース ※イメージです。左のコードと右のノードは同じものではありません。
メリット ShaderLabを書かなくても良い デザイナーでも使える 気軽に早くShaderを作れる AmplifyShaderEditor BuildInRP/HDRP/URPで使える ただし、作成したShaderの互換性はない。 ShaderGraphはBuildInRPでは使えない 2021.2以降では使える
デメリット AmplifyShaderEditor ちょっと高い 情報がありそうで、結構限られている $88 ShaderGraphほど情報がない印象 ノードベース コードなら一行で書けるものが、ノードだと複数になる ↑ShaderLab ノード→
参考資料 本家 AmplifyCreations(Youtube) http://wiki.amplify.pt/index.php?title=Unity_Products%3AAmplify_Shader_Editor https://www.youtube.com/c/AmplifyCreations/videos Unity道場 https://www.slideshare.net/nyaakobayashi/unity-dojoamplifyshadereditor101jpnjp
ここからは、おかひろがAmplifyShaderEditorを使っ て作成したShaderの例とノード構成を紹介します
おかひろの作例 ViewDot カメラの方向を向いている面が明るく、向いていない面を暗くする 球体の場合 キャラの場合。左は単色。右はViewDot あり
おかひろの作例 ViewDot ViewDirノードと WorldNormalノードの内 積で色分けする。 この例では、暗くしたい 部分のテクスチャを別途 用意している。
おかひろの作例 LightDot ライトの方向を向いている面が明るく、向いていない面を暗くする 球体の場合。左上が光 源 キャラの場合。左は単色。右はLightDot あり。(光源は右上)
おかひろの作例 LightDot WorldSpaceLightDirノード とWorldNormalノードの 内積で色分けする。 それ以外はViewDotと同じ。
おかひろの作例 Outline Outlineノードに色と幅を指定するだけで表示できる
おかひろの作例 Outline Outlineは黒一色 Outline色を場所ごとに設定
おかひろの作例 Outline アウトライン色用のテクス チャをColorに、 アウトラインマスク用のテク スチャをWidthに適用させる 例
おかひろの作例 VerticalFog StandardShaderのアセット を置いただけ。 遠近感などがわかりづらい オブジェクトの下の方を水色、上の方 を濃い青に設定。 遠くに置いたものは濃い方の色を少し 薄めに。
おかひろの作例 VerticalFog VertexPositionノードで、オ ブジェクトごとの頂点の座標 を取得可能
おかひろの作例 UVスクロール、頂点アルファ 風が渦巻くエフェクト 渦の開始と終了の場所が徐々に透明になっている。 これはメッシュに頂点アルファが設定されており、 Shaderでこの値を取得している。 メッシュ
おかひろの作例 UVスクロール、頂点アルファ UVスクロールはTime系ノードを使うことで、Shaderだけで動かせる。 頂点カラー(アルファ含む)はVertexColorノードで取得
おかひろの作例 SkyBox シンプルなSkyBox。 カメラがどこを向いても、色の境目の位置が 変わらないようにする
おかひろの作例 SkyBox ScreenPosition ノードで画面上の 位置を取得
おかひろの作例 前髪の上から見える眉毛 眉毛が前髪に隠れて いる 眉毛が見える
おかひろの作例 前髪の上から見える眉毛 眉毛専用のMaterialが設定されている 前髪専用のMaterialが設定されている 顔とMaterialが別 横/後ろ髪とMaterialが別 StencilBufferを使う UTS2と同じやり方 眉毛に設定するShader のStencilBuffer 前髪に設定するShader のStencilBuffer
ご清聴ありがとうございました