ShaderGraphの頂点シェーダーでペラペラ感の無いビルボードエフェクトを作る

概要

ShaderGraphで @kaneta1992 さんの「8頂点でサイリウムを綺麗に表現する」を再現します

ShaderGraph

ベースはこちらを流用します

解説

本来4頂点で十分なビルボードを、上下に3分割して折り曲げることで一定の角度まで不自然にならないビルボードを作ることが出来ます

細かい理屈の解説は元記事を参考にしてもらうとして、
ShaderGraphでは「Pane」という四角で囲んだ部分が前回との差分です

UV1には移動距離が入れている、ShaderGraphではカメラからの角度だけ計算して掛け算するだけです

メモ

• 回転する4つの頂点は最初、回転しない4つの頂点と同じ位置にあること
• 回転しない4つの頂点のUV1は0（移動しない）が入れていること

オプション

このビルボードエフェクトではMeshに細工が必要です
わざわざ3Dツールを使うでも良いですが、めんどくさいのでUnity上で生成出来るようにします

このコードも @kaneta1992 さんの記事から拝借してます

    public class BulletModelController : MonoBehaviour
    {
#if UNITY_EDITOR
        [SerializeField] float height;
        [SerializeField] float radius;
        [SerializeField] string path;
        
        [ContextMenu("MakeMesh")]
        void MakeMesh()
        {
            var mesh = new Mesh();
            mesh.name = "Bullet";
            mesh.vertices = new Vector3[]
            {
                new (radius * -2, -height, 0),  // 0
                new (radius * -2, -height, 0),  // 1
                new (radius * 2 , -height, 0),  // 2
                new (radius * 2 , -height, 0),  // 3
                new (radius * -2,  height, 0),  // 4
                new (radius * 2,  height, 0),  // 5
                new (radius * -2,  height, 0),  // 6 
                new (radius * 2 ,  height, 0),  // 7
            };

            mesh.uv = new Vector2[]
            {
                new (0, 0),
                new (0, 0.5f),
                new (1, 0),
                new (1, 0.5f),
                new (0, 0.5f),
                new (1, 0.5f),
                new (0, 1),
                new (1, 1),
            };

            mesh.uv2 = new Vector2[]
            {
                new (radius * -2.0f, 0),
                new (0, 0),
                new (radius * -2.0f, 0),
                new (0, 0),
                new (0, 0),
                new (0, 0),
                new (radius * 2.0f, 0),
                new (radius * 2.0f, 0),
            };

            mesh.triangles = new[]
            {
                0, 1, 2, 
                1, 3, 2,
                1, 4, 3, 
                4, 5, 3,
                4, 6, 5, 
                6, 7, 5,
            };

            AssetDatabase.CreateAsset(mesh, path);
            AssetDatabase.SaveAssets();
        }
#endif
    }

他

ShaderGraphを勉強中です
https://qiita.com/archeleeds