UVスクロールで手軽にリッチな炎を表現。シェーダー初心者向けエフェクト作成手法、グレッゾが技術ブログで解説

グレッゾは2026年1月22日（木）、「テクスチャスクロールで画面をリッチに！(シェーダー入門)」と題した記事を、同社の技術ブログで公開しました。

時間経過とともにUV座標をずらして取得することでテクスチャがスライドするような視覚効果を生む技法「UVスクロール」（記事では「テクスチャスクロール」と呼称）を用いて、炎のエフェクトを作成する手法を解説しています。

同記事は、シェーダー初心者やシェーダープログラミングに苦手意識を持つ方などに向けて、手軽な操作でリッチな演出効果を生む手法を解説したもの。

グラフィックスAPI「OpenGL」およびそのシェーディング言語「GLSL」を用いて、1枚のノイズテクスチャから炎のエフェクトを作成する手順を、サンプルコードを添えつつ紹介してます。

まず、画面に画像を表示するための頂点シェーダー（VertexShader）とフラグメントシェーダー（FragmentShader）のコードを記述。そして、経過時間のデータを受け取り、それに伴って取得するUV座標を徐々にずらしていく「テクスチャロール」を実装します。

その後、ノイズテクスチャの色や形状を炎に近づけるため、ノイズの明るさに応じて赤→黄→白とグラデーションさせる処理や、テクスチャ上部を細くすることで炎の先端が自然に消えていく仕組みを記述します。

さらに、別のノイズテクスチャを異なる速度・方向にスライドさせる処理を掛け合わせることで複雑な炎の揺らぎを表現するコードを追加。これをもってエフェクトが完成となります。

記事の最後では「行列計算やベクトルなど高度なロジックが必要であると敬遠しやすいシェーダープログラミングに興味を持つ一助になると嬉しい」と結ばれています。具体的なコードや実装手順など、詳細は記事本文をご確認ください。