Toguchi-Design

ゲームをプレイしたり作ったりします。

【Unite 2017】シェーダの講演を見たのでメモ

こちらの講演を見たので、メモします。

【Unite 2017 Tokyo】シェーダープログラミング入門!カスタムシェーダー、作るで!


シェーダーの定義
GPU上で実行されるインストラクション(プログラム)の集合

CPUを喰わないようにする
GPUの最適化


レンダリングパイプライン
Vertex Shading(形、大きさ)
フラグメント…最終的に画面のピクセルになるであろうもの
Pixel Shading(色を変える)

シェーダの種類
Vertex Shader
Fragment Shader
Surface Shader(Unityの中のライティングモデルを考慮)
More…


Vertex Shader
Input
複数の頂点の位置、法線、色
Output
新しい位置、その他

Fragment Shader
Input
ピクセルになるFragment
Output
ピクセルの色、アルファ値

Surface Shader


Shaderの書き方
言語
CG, ShaderLab

CG
C言語と似ている
精度が何種類かある -> float, half, fixedで使い分け
float, float2, float3 etc.
Swizzling 情報のアクセスの仕方
Color.rgb, color.rg, color.xyz, color.yx


Tags RenderType 透明にしたいなど
CGPROGRAM 実際のプログラム
#pragma vertex vert
#pragma fragment frag
各シェーダの関数の定義

v2f構造体 
vertex to fragment
float4 pos 頂点の位置情報
vert
UnityObjectToClipPos … 3Dの頂点を2Dに変換する
fragment
全てのピクセルを赤に
half4 frag(v2f i) : color{ return half4( 1,0,0,1);
}

vert, fragに全ての頂点、ピクセル全てが送られる→大量のデータが送られる
必ずしも明示的にプログラムを呼び出す必要がない→定義しただけでUnityが関数を呼び出してくれる

shader2
vert メッシュ自体の拡大縮小
float4 vert = v.vertex * 0.75 →大きさが0.75倍


Shader03
メッシュの書き方を知っておいたほうがいい
新しいMeshの生成
頂点を入れる
頂点に色を付与できる
trianglesの順番を指定
v2f 頂点位置、色
各頂点の色から補完色を生成

Properties…エディタとシェーダ間でデータを送る
→変数をPassの中で定義

Shader06
C#からShaderのPropertiesをいじれる

Shader07
テクスチャの話
UV テクスチャから色をモデルに適用
UV value テクスチャの中でメッシュの頂点に相当するポイントを指定
vert 位置、UV
frag そのUVポイントにあるテクスチャ

Shader08
ピクセルの色の描画だけを設定→ライティングは関係ない
Surface Shader ライティングを使いたい場合
#pragma surface surf Lambert
struct Input
{ float2 uv_MainTexture;
}

surf(Input, IN, inout SurfaceOutput o)
{
プロパティをOutput valueとして返す
o.Albedo = tex2D(_MainTexture, IN.uv_MainTexture).rgb;
}


Shader09
頂点の位置のアニメーション
surface + vertex
#pragma surface surf Lambert vertex:vert
頂点の位置のデータの変換

Shader10
テクスチャをモデルに適用するにはUVを使うが、それをアニメーションすることもできる
UVスクロール
void surf(Input IN, inout SurfaceOutput o)
{
float2 uv = float2(IN.uv_MainTexture.x + _Time.y * 0.2, IN.uv_MainTexture.y);
}

Shader13
よりゲーム的な見た目
しましまを上に動かす
TextureのUVのアニメーション
透明度の調整

サンプルコード
https://github.com/ArturoNereu/ShaderProgramming_101