Shader Graphを使う
•
0 likes•202 views
1. Shader Graph allows visual creation of shaders in Unity without coding. It works with Unity 2019.3 or higher. 2. To use Shader Graph, the Universal Render Pipeline (URP) must be installed. A pipeline asset is then created and assigned in project settings. 3. A Shader Graph asset and material are created. Nodes can then be added visually to modify properties like color or add effects. Information from textures, vertices, and other sources can be accessed as inputs.
More Related Content
More from Hiromichi Yamada
Recently uploaded
Recently uploaded (20)
Shader Graphを使う
- 1. Shader Graphを使う 2021/5/30 株式会社トルクス 山田 (@octi) ＠地域おこしXR研究会 ゆるもく勉強会
- 2. 自己紹介：山田宏道 株式会社トルクス（＠島根） 代表取締役 https://www.facebook.com/hiromichi.yamada 元ゲームプログラマー スマートフォン/PC向け アプリ開発 VR/ARやドローンなど、最新技術が好き。 地域おこしXR研究会を発足し、勉強会を開催 しています！
- 3. 自己紹介＜宣伝＞ Magic Leapコンテンツを制作しています 隠岐諸島の歴史をゲームで学べるXR教育コ ンテンツ | docomo XR | NTTドコモ A-Leaf（エイ・リーフ）を使用した3D観光案内 | docomo XR | NTTドコモ
- 6. Shader Graphとは Unity Shader Graph | Unity で シェーダーを視覚的に構築 | レン ダリング&グラフィック | Unity
- 7. できると確認したことを発表します 今回の発表内容は「Shader Graphを始める一つの方法」です 全てを把握するのは大変（開発環境 x 実行環境 x 機能） 古い環境のキャッチアップ等は本家の仕事 動かないデバイスや機能もある Unity Editor上（Windows 10）で動作確認 Oculus Quest 2で動作した Magic Leap Oneでも動いた Bloom系は動かなさそう＋見えなさそう 動かない機能もあると思う
- 9. Shader Graphを使う：流れ ① 対応しているUnityのバージョンを確認 ② URPの導入 ③ Shader Graphとマテリアルを作成 ④ ③をいい感じに使う！＜ここが目的＞
- 10. Shader Graphを使う① ① 対応しているUnityのバージョンを確認 ② URPの導入 ③ Shader Graphとマテリアルを作成 ④ ③をいい感じに使う！＜ここが目的＞
- 11. Unityのバージョン Unity 2019.3 以降（多分） 私が確認した環境 2019.4.22f1 (2019 LTS) 2020.2.6f1
- 12. Shader Graphを使う② ① 対応しているUnityのバージョンを確認 ② URPの導入 ③ Shader Graphとマテリアルを作成 ④ ③をいい感じに使う！＜ここが目的＞
- 13. URP(SRP)の導入 Scriptable Render Pipeline(SRP) URP: Universal Render Pipeline (旧 LWRP) HDRP: High Definition Render Pipeline Unityの次の標準レンダリングパイプライン Universal Render Pipeline は何がどう変わるのか | Unity Learning Materials (unity3d.jp) 汎用的な描画の仕組みから、カスタムできる描画の仕組みへの変更 （HDRPは試していません）
- 14. 1. Packageを追加 Package Managerを開き、Universal RPを追加する Unityを再起動する
- 15. 2. Pipelineアセットを作成 Projectパネルで、Pipelineアセットを作成します。 Create > Rendering > Universal Render Pipeline > Pipeline Asset (Forward Renderer)
- 16. 3. Render Pipelineを設定 Edit > Project Settings パネルを開く Graphics > Scriptable Render Pipeline Settingsを設定 （前項で作ったもの）
- 17. Shader Graphを使う③ ① 対応しているUnityのバージョンを確認 ② URPの導入 ③ Shader Graphとマテリアルを作成 ④ ③をいい感じに使う！＜ここが目的＞
- 18. 1. Assets内で作成 Assets > Create Shader > Universal Render Pipeline > Unlit Shader Graph を選ぶ 適当に命名 (like ..FirstSG)
- 19. 2. マテリアルを作成 Shader Graphアセットを選び 右クリックからMaterialを作成 適当に命名 必要に応じてシーン内のオブ ジェクトにアタッチする
- 20. Shader Graphを使う④ ① 対応しているUnityのバージョンを確認 ② URPの導入 ③ Shader Graphとマテリアルを作成 ④ ③をいい感じに使う！＜ここが目的＞
- 21. ノードメモ イメージから
- 22. Image/Raw Imageの情報取得 MainTex(_MainTex)：テクスチャ Vertex Color：Color（色）
- 23. Ellipse（楕円、円） 入力：UV, Width, Height 出力：1次元イメージ 二つの大きさが違うEllipseをSubtractすると 円のラインを描画できる
- 24. UGUI:Maskが適用されない StencilとZTest関係の設定が必要 Shader Graphの完成コードをテキストでコピーし、必要なソー スを追加して別Shaderとして使用する方法が良いらしい。 How to UGUI ShaderGraph Tutorial! (With Dropdown Mask) – YouTube https://www.youtube.com/watch?v=RxW7_qgkXPo だが、ダメっぽい。 2020.2だからか生成されたコードが複雑すぎる。
- 25. ウェブの情報 メモとともに
- 26. Unityステーション Unity道場2D編 Shader Graph はじめてみよう！実践編（7月13 日号） - Unityステーション https://www.youtube.com/watch?v=eJqFLsjPWcY #01 カラーの変更 #02 ブレるような動き #03 帯電ぽいやつ #04 スキャンライン #05 ボーダーライン
- 27. 詰め込まれている！ エフェクト作成のために知っておきたいShader Graphの話 - Unity道場2019 8月 https://www.youtube.com/watch?v=7ToExWKVZW0 歪み（屈折） https://youtu.be/7ToExWKVZW0?t=1196 UWPの場合、PipelineのOpaque Textureにチェックを入れ、複数マテリアルで 実現
- 28. Custom Function 自由に記述できる！ Unity で Shader Graph の Custom Function Node を試してみ た - 凹みTips (hecomi.com) 【Unity】C#で定義されたShaderGraphのカスタムノードが使 えない時の対応 – Qiita CustomFunctionで独自のノードを実装！ - Unity Shader Graph Advanced Tips – YouTube Foo.hlsl として保存 void BoxFilter_float(Texture2D source, out float4 output)
- 29. UGUIで使いたい Shader Graphからつくったマテリアルを作成 _MainTexを参照することでテクスチャ画像を使用可能 ImageのMaterialに適用する。
- 30. 勉強素材 Shader Graph Example Libraryを整理してみる - デコシノニッ キ (tattichan.work) Ice Refraction in Unity Shader Graph [Tutorial] – YouTube Glass/Water Refractive Shader in Unity using Shader Graph (Camera Texture Method) – YouTube Grid Shader in Unity LWRP - Shader Graph Tutorial – YouTube https://www.youtube.com/watch?v=JgmIM7qhGh8
- 31. 勉強素材 Unity Shader Graph completely explained! https://www.youtube.com/watch?v=9aOtie1DKCc
- 32. URPに関するメモ
- 33. UGUIにBloom等を適用したい Canvasの設定をScreen Space – Cameraにすると適用可能 Cameraの”Post Processing”にチェックを入れておく必要があ ります。