ガラスを流れ落ちる水滴……その様子をシェーダを使って再現したデモがチュートリアル記事付きで登場！
チュートリアル記事も用意されている
今回ご紹介するのは、驚きの水滴シェーダを使ったデモと、それを実装する方法を解説したチュートリアル記事です。
まるで、本物の水滴越しに撮影した写真なのではと一瞬疑ってしまうような、見事な水滴シェーダがお目見えです。しかもその実装方法までこうして解説してくれているとは、なかなか興味深いですね。
メタボールや液体の表現は、なかなか資料が無い、あるいは本格的な学術的記述でなかなかプログラミングに応用できない、というケースが多いような気がしますが、今回のチュートリアル記事はかなり参考になるのではないでしょうか。
ボカシ処理をうまく利用したメタボール
今回の水滴シェーダは、まずは実行して見てみることがなによりおすすめです。
本当にプロシージャルにその場でシェーダで描かれているものなのか、一瞬疑いたくなるような見事な完成度になっています。
シェーダを記述するには高い知識と、ある種の経験のようなものが必要になると個人的には思っていますが、その実現方法を見れば、思わずなるほどと言いたくなってしまうのではないでしょうか。
うっすらと靄が掛かったような背景の写真もいいですが、なにより本物の水滴のように見える、シェーダで描いている水滴が見事ですよね。
気温の表示の下にはアイコンが並んでおり、天気のマークがいくつかありますね。これは単純に気候を表していて、水滴の粒の大きさや密度などが天候の種類によって変化するようになっています。
雨の日、少雨の日、あるいは晴れの日から激しい雷鳴が轟く雷雨の日まで、様々に用意されています。音は鳴らないので安心してください。
また、チュートリアル記事を見ると、実際にこの水滴シェーダがどいのように実装されているのか、GLSL のコードと共に掲載されています。
完全なコードの掲載ではありませんが、実現するために必要となる概念や考え方は全て漏れ無く解説されています。
水滴の形状をどうやって表現しているのかや、水滴によって風景が歪んで映る現象をどうやって再現しているのかなど、とても参考になるのではないでしょうか。
ちなみに、水滴同士が微妙に結合するメタボールのような表現には、ブラーを応用したテクニックを使っているみたいですね。
上の画像は、あえて小さい背景画像用いそれを引き延ばすことによって、低コストでぼやけた景色を表現するという、面白いフェイクテクニックを解説しているチュートリアル記事の一部です。
こういった具体的な解説記事というのはなかなか少ないので、シェーダの記述に興味がある、あるいはぼかしやメタボール、法線を使った演出方法などをいかに活用するか、そんなことに興味がある方はぜひ参考にしてみるといいでしょう。
全編英語ですが、画像も多く用意されており、雰囲気でチュートリアル記事の内容はわかると思います。実際に動作するデモと併せて、ぜひチェックしてみてください。
