シェーダー基礎
教材一覧

Appearance

第12回 頂点アニメーション

4 / 4 頂点変形の確認と法線の更新 ​

このステップの目的

固定端・元位置・表示範囲を確認し、Lit表現へ進む場合の法線計算を理解します。

基本課題 ​

Planeの一辺を固定したまま、SpeedとFrequencyをそれぞれ変更します。元の形、静止した波、動く波を同じCameraで記録し、どの値を変更したか説明してください。保存時はAmplitude=0へ戻し、採用した値を記録します。

変位の範囲とBounds ​

BoundsはRendererが描画対象を含むと判断する範囲です。頂点シェーダーで範囲外へ大きく動かした場合、Cameraによって表示が消えることがあります。色の設定を変更する前に、元のMeshのBoundsと変位の最大量を比較します。大きな変形用の素材では、想定する動きに合うBoundsを準備します。

Litへ進む前の法線 ​

基本のUnlit表示には照明計算がありません。Lit Graphへ変えた場合は、位置を曲げただけでは元の法線が残るため、曲がった面と明暗が一致しなくなります。小さな変位での観察と、大きくたなびく旗としての完成を分け、後者では法線も更新します。

法線の向きは、面に沿う二つの方向から外積（Cross Product）で求められます。例えばXZ平面なら、Z方向(0,0,1)とX方向(1,0,0)の外積は上向き(0,1,0)です。順番を逆にすると下向きになります。第07回の発展を読んでいなくても、この入力と結果を確認してから次の計算へ進めます。

発展：同じ変形を三点で計算する法線更新

変形を一つのSub Graphへまとめる ​

標準PlaneのObject空間XZ面を使い、前の変形を複製したGraphで作業します。Shader Sub Graphを作り、Vector3の入力P、FloatのTime Value・Speed・Frequency・Amplitudeを用意します。この計算例ではUVのUに代えて、Object空間のXから(P.x + 5) / 10を固定端のMaskとして計算します。X=−5の辺が0、X=5の辺が1です。UVの並び方向に依存せず近くの点のMaskも計算できるようにするためです。次の変形を組み、Vector3として出力します。

text
mask = (P.x + 5) / 10
y = sin(Time Value × Speed + P.x × Frequency) × Amplitude × mask
F(P) = P + (0,y,0)

親GraphでPosition(Object)をPへ渡し、F(P)をVertex Positionへ接続します。X=−5の辺が固定され、反対側が動くことを先に確認します。UV版と固定辺が逆になる場合は、Maskの基準を変えた結果として区別します。

近くの二点との差 ​

同じSub Graphをさらに二つ置きます。時刻・Speed・Frequency・Amplitudeは三つとも共通にします。一つにはP+(0.01,0,0)、もう一つにはP+(0,0,0.01)を渡します。

text
tx = F(P + (0.01,0,0)) - F(P)
tz = F(P + (0,0,0.01)) - F(P)
normal = normalize(cross(tz, tx))

Subtractで二つの差を求め、Cross ProductのAへtz、Bへtxを接続します。Normalizeの出力を、Vertex側のNormalへ渡します。値はObject空間で計算しています。Fragment側のTangent SpaceのNormalへそのままつながないでください。

Amplitude=0で上向き(0,1,0)になることを確認します。その後に小さい値へ戻し、同じLightで法線更新の有無を比較します。この計算は近くの点の差による近似です。任意の草やキャラクターへ適用するには、素材の面の方向と変形・Maskの対応を作り直す必要があります。

発展資料

座標空間と行列を詳しく確認する場合は、次の資料を参照してください。

チェックリスト
  • Amplitude=0で元の形へ戻り、固定辺が保たれる。
  • SpeedとFrequencyの変更結果を説明できる。
  • Litの大変形では法線更新が必要な理由を説明できる。