こんにちは。プログラマの寺沼です。

先日、インゲームのUIとして、次のような表現が必要になりました。

中が空洞になった円が3色で塗り分けられています。このような画像を、色が塗られている範囲を変えて、複数パターン用意する必要があったのですが、パターンごとに画像を作るのは手間がかかります。

このような場合は、パターンごとに画像を用意するより、Unityのシェーダーで色を塗る機能を作成した方が早いです。

シェーダーとは、GPUで動くプログラムで、グラフィックの描画に関する処理を書くことができます。 普通、シェーダーは専用の言語で記述しますが、UnityにはShader Graphという機能があります。

Shader Graphを使うことで、ノードベースでシェーダーを記述することができます。

こんな感じで、角度や色などのパラメータを元に、それぞれの色の範囲を合成し…

自由に表示範囲や色を設定できるUI素材を用意することができました。

Shader Graphはプログラムを記述する必要が無いため、プログラマ以外でもシェーダーをいじれるのが強みですね。

それでは。