Unity道場11 Shader Forge 101...
-
Upload
- -
Category
Engineering
-
view
3.977 -
download
6
Transcript of Unity道場11 Shader Forge 101...
Unity道場 11
Shader Forge 101 ~ShaderForgeをつかって学ぶシェーダー入門~
基本操作とよく使われるノード編
Unity Technologies Japan合同会社 コミュニティエバンジェリスト
小林信行 2016/08/28
自己紹介 : 小林 信行ユニティテクノロジーズジャパン合同会社コミュニティエバンジェリスト
UnityやMayaをはじめとする各種3Dツールの研究、ゲーム制作のノウハウの普及をしてます。その前は『涼宮ハルヒの追想』『涼宮ハルヒの約束』『とらドラ・ポータブル!』などの原作付きキャラクターゲームの企画&監督。
本コースを受講することで得られる知見
• 本コースは、「ShaderForgeを使ってシェーダーを学ぶ」のが目的ですので、ShaderForgeの全機能を紹介するものではありません。
• 本コースでは、ShaderForgeの基本的なオペレーションと、よく使うノードについて学びます。
• よく使うノードの機能を学んだ後は、実際にシェーダーを組んでいく上で、しばしば使われるパターンを実際に見ていきましょう。
シェーダーを学んでみよう!
シェーダーは、「独自の絵づくりのためには必要だ」
とよく言われているけれど…
そもそも「シェーダー」って、なに?
• 「シェーダー」とは、主にGPUによって処理される、画像処理の手順を指定した、小さめのスクリプトのことを指します。
• Unityの場合には、サーフェイスシェーダー、バーテックスシェーダー、フラグメントシェーダー、コンピュートシェーダーの4種類があります。
• サーフェイスシェーダーは、Unity独自のシェーダー言語であるShaderLabで通常は書きます。さらにそれ以外のシェーダーは、ShaderLabにCgやHLSLなどのより一般的なシェーダー言語を組み合わせて書かれます。
• 「Shader Forge」は、その内のサーフェイスシェーダーをノードベースでエディットできるように、エディタ拡張で作られたツールです。
http://docs.unity3d.com/ja/current/Manual/SL-Reference.html
絵画における「質感」を構成するもの • 色 (材質およびそれに当たる光の色の表現)
• 陰影 (光が当たっている面の陰影の出方による立体表現)
• タッチ (材質の表面状態の表現)
⇒絵画は、「色+陰影+タッチ」の組み合わせで、様々な「質感」を表現する。
Unite 2016 Tokyo 『Unityとアセットツールで学ぶ「絵づくり」の基礎~ライト、シェーダー、イメージエフェクト~』
シェーダーはこの全てに関わっている
3DCGにおいて「質感」に影響を与えるもの
• マテリアル (マップおよびシェーダー)
• ライト (直接光と間接光、ホワイトバランス、ソフトネス、アングル)
• カメラ (HDRとフォーカス、スクリーンスペースでのイメージエフェクト)
⇒絵画における「色+陰影+タッチ」の組み合わせは、3DCGの場合には、
「マテリアル×ライト×カメラ」の各設定として、設計される。
Unite 2016 Tokyo 『Unityとアセットツールで学ぶ「絵づくり」の基礎~ライト、シェーダー、イメージエフェクト~』
シェーダーを使った絵づくりを学ぶためには、これら要素を切り分けて理解することが大切。各々の役割をごっちゃにしないこと!
特に、「マテリアル = マップ × シェーダー」 u 物理ベースシェーダー(Standardシェーダーなど)の場合
• 「物理ベースシェーダー」としての機能面は、Standardシェーダーなどのゲームエンジンがデフォルトで提
供しているシェーダーが受け持っている。
• 従って、絵づくりはシェーダーに割り当てる、各ワークフローに則ったマップ(テクスチャ)の作り込みとライ
ティングが中心となる。
• マップ(テクスチャ)は、Substance DesignerやSubstance Painterなどで制作する。
u ShaderForgeが担当するのは、「シェーダーの機能面の作成」で、マップの作り込みではない
• ShaderForgeを使いこなすことで、自分だけのカスタムシェーダーを作成することができる。
• カスタムシェーダーは、自分だけの独自の絵づくりの一翼を担うもの。
ここに様々なマップやライティングを組み合わせることで、最終的な絵づくりが完成する。
目的に合わせて、ツールも使い分けましょう!
ShaderForgeなどのノードベースエディタで
シェーダーを学ぶメリットってどんなところ?
ノードベースのシェーダーエディタでシェーダーを学ぶ利点 l シェーダーのコード記述特有の「めんどくささ」が回避できる。
• シェーダーのコード記述には、お約束のルールが結構ある。
• 同じことを繰り返して書かなければいけないことが結構ある。⇒ShaderForgeなどのノードベースエディタでは、この辺りの「めんどくささ」を意識しないでよい
l 通常のプログラミングよりは、ノードのバリエーションが圧倒的に少ない。⇒ビジュアルプログラミングの場合、ノードが複雑になると、ロジックが見づらくなるが、 シェーダーはグラフィック処理に特化している分、それほど複雑にならないですむ
l 一度憶えると、他のDCCツールやゲームエンジンでも同じようなノードやセマンティクス(シェーダー入力/出力に付加される指定文字列のこと)があるので、相互運用がしやすくなる。
l ShaderForgeの場合、「変更が即、グラフィックに反映される」ので、イタレーションがしやすい。⇒「トライアンドエラーがしやすい」ということは、「学びやすい」ということでもある
ShaderForgeの画面構成
マテリアルの新規作成
マテリアルに割り振られているシェーダーの変更
ノードエディタの基本操作
ノードエディタの基本操作
l ノードリンクの削除:Alt/Option + RMB。リンクのまとめ切断も可能
l Macでノードを削除:Command + X (切り取り)で(WindowsならDeleteキーで)
l ノードのクイックサーチ:ノードの頭文字を入れて、マウススクロール。 左クリックで決定
l ノードの範囲選択指定:Alt/Optionを押しながら、LMBドラック
l ノードの範囲選択中は、ヒエラルキー状態を保ちながらノードを移動できる
l ノード上でRMBでコメント挿入ができる他、各ノードの機能をWEBから検索できる
用途別に見る基本的なノードの機能
テクスチャを貼る
UV Coordinates Texture 2D
Main
テクスチャを貼る
Emissionに接続すると、ライトの影響を受けなくなる(Unlitの状態になる)。
Diffuse/Base Colorに接続すると、ライトの影響を受けるようになる。
テクスチャにカラーを重ねる
Color Multiply Add
テクスチャにカラーを重ねる
Multiplyでカラーを重ねると、輝度は下がる。 (「白」なら変わらない)
Addでカラーを重ねると、輝度は上がる。 (「黒」なら変わらない)
テクスチャにカラーを重ねる
Multiply/Addノードには、2つ以上のノードを入力することが可能
2つのテクスチャやカラーを混ぜる
Lerp(線形補間)
Value
Blend(Photoshop的)
2つのテクスチャやカラーを混ぜる
Lerpは、2つのテクスチャやカラーをValueの値に従って、線形補間(Linear interpolation)することで混ぜる。
Blendは、2つのテクスチャやカラーをPhotoshopのレイヤー合成的に混ぜる。
ノーマルマップを貼る、合成する
Texture 2D / Normal map
Main / Normal
Normal Blend
Lerp / Value / Normalize
ノーマルマップを貼る、合成する
ノーマルマップを、MainノードのNormalに接続するとノーマルマップが適用される。
2つのノーマルマップを合成する時は、Normal Blendノードを使う。
ノーマルマップを貼る、合成する
Lerpを使用して、Valueで指定した強度で2つのノーマルマップを合成することもできる。その場合、合成したノーマルマップをNormalizeノードで正規化しておく。
カラーやマスクを反転する
One Minus
カラーやマスクを反転する
カラーや白黒のマスクなど、「0~1」の範囲にあるベクトルや画像を反転させる際に、One Minusノードを使用する。特にカスタムライティングをする際に、良く使われるノードである。
UVマッピングをタイリング(スケール)する
UV Coordinates / Multiply / Value / Vector2
UVマッピングをタイリング(スケール)する
UV CoordinatesノードをMultiplyノードに接続することで、UVマッピングを任意にタイリング(スケール)することができる。 MultiplyノードにVector2ノードを接続すると、UV方向に違ったスケールをかけられる。
UVマッピングをタイリング(スケール)する
Value = 1 の時
Value = 0.25 の時
Value = -0.25 の時
UVマッピングをオフセット(スクロール)する
UV Coordinates / Add / Value / Vector2
UVマッピングをオフセット(スクロール)する
「赤1」に着目すると 右に1コマ、下に2コマオフセットしている
左に1コマ、下に1コマオフセットしている
UV CoordinatesノードをAddノードに接続することで、UVマッピングをオフセット(スクロール)することができる。
UVマッピングをアニメーションさせる
Timeノードから取得した時間変化分を、AddノードでUV Coordinatesノードに接続することで、UVマッピングがスクロールアニメーションをする。
UV Coordinates / Time / Add
UVマッピングをアニメーションさせる
Timeノードから取得した時間変化分に、MultiplyノードでVector2を掛けることで、スクロールの移動方向と速度の調整ができる。
専用ノードでUVマッピングをアニメーションさせる
Pannerノードで、UVマッピングをスクロールアニメーションすることもできる。Distanceに値を接続すると、Timeノードから値を取得しない限り、UVマッピングのオフセットとして機能する。 PannerノードのUVで、スクロールの速度と方向を指定できる。
UVマッピングを回転アニメーションさせる Rotatorノードを使うことで、UVマッピングを回転アニメーションさせることができる。
実際にシェーダーを組んでみよう!
UVタイルアニメーションを作ってみよう
シェーダーとテクスチャアトラスの準備
テクスチャアトラスの表示
1コマサイズで表示する
DivideノードA/Bを計算するノード
時間でスクロールさせる
時間でスクロールさせる
Fracノード 0から1まで、小数点以下のみを繰り返す関数。 0~1の繰り返しタイマーなどに使う。
コマ単位でアニメーションさせる
コマ単位でアニメーションさせる
Floorノード 小数点以下を切り捨てて、整数にする関数。 ステップ進行などに使う。
+X方向に進行して、-Y方向にジャンプする
UnityやMayaのUV座標系は上図。DirectXでは、原点が左上になり、かつV軸が反転する。
+X方向に進行して、-Y方向にジャンプする
Component Maskノード ベクトルの各要素を分解するノード。 ベクトルの各要素から数値を取り出すのに使う。他、Vector3からXY要素(UV要素)のみを取り出すのに使用したりする。
Appendノード 数値を合成して、ベクトルを新規に作り出すノード。 各数値をベクトルの構成要素にして、新規にベクトルを作り出すのに使う。
「苔むした岩」(環境ブレンディング)を作ってみよう
2つのテクスチャを合成するための準備
Lerpノード 2つのテクスチャやカラーを、0~1の範囲内のTの値に従って、線形補間(Linear interpolation)することで混ぜる。Tとして、Valueの他にマスクノードなどを接続できる。
共に50%の比率で、Lerp合成する
ベースマテリアルの「上側」を示すマスクを作る
岩の上方ほど、苔がより生えて いる状態を表現したい…。
岩の表面の凹凸でも、上方ほど、苔がより生えている…。
ノーマルマップが使えないか?
ベースマテリアルの「上側」を示すマスクを作る
タンジェントスペースからワールドスペースに変換
Y方向(上方向)の情報のみ取得
UnityやMayaでは、ワールド座標での上方向はY軸方向(Y-up)。一方、3ds Maxや他のゲームエンジンではZ軸方向が上(Z-up)になるので注意。
Transformノード ワールド/ローカル/タンジェント/ビューの各座標空間に、ベクトルを変換するノード。
タンジェントスペースの概念 ローカル座標にあるUVZ座標(空間)を「タンジェントスペース(接空間)」という
ノーマルマップのカラーと法線の傾きの関係のイメージ
http://marupeke296.com/DXPS_S_No5_NormalMap.html
(L)Normal (L)Tangent
(L)Binormal
UV座標
マスクの濃度調整をする
Clamp 0-1ノード 0以下、または1以上の値を切り捨てるノード。 マスクなど、 0~1の範囲内にある必要がある数値の調整用に用いられる。
マスクをシャープにする
Subtractノード A-Bを計算するノード。
マスクで、2つのテクスチャのLerp合成をする
参考文献 l SHADER FORGE Nodes http://acegikmo.com/shaderforge/nodes/ l Shaders 101 – Foundational Shader Concepts for Tech Artists
Ben Cloward (CG Supervisor Bioware) / GDC Vault http://www.gdcvault.com/play/1023152/Technical-Artist-Bootcamp-Shaders-101
l プログラマブルシェーダーについては、『ゲームつくろー!』「プログラマブルシェーダ編」http://marupeke296.com/ProShader_main.html