窓ガラスにつく水滴表現したいですね。ヒントとなりそうな情報をまとめてみました。
基本的には全画面エフェクトが多いです。ゲームであればカメラに水滴が垂れるような演出ですね。窓ガラスのようなオブジェクトに対応するためには基本情報を基に自分で何とかしないとダメです。
水滴表現に関しては2つのパートからなります
- 垂れる水滴のシミュレーション（だいたいは水滴群を表現するグレースケール画像作るのが目標
- CPU実装
- GPU実装
- 描画（水滴っぽい見た目にする
水滴シミュレーションCPU版
Build software better, together
GitHub is where people build software. More than 73 million people use GitHub to discover, fork, and contribute to over 200 million projects.
github.com
Rain & Water Effect Experiments - Codrops
Some experimental rain and water drop effects made with WebGL and shown in different demo scenarios.
tympanus.net
解説あり
Breakdown: Animated Raindrop Material in UE4
Harry “deBug” Emelianov kindly prepared a step-by-step breakdown of his animated Raindrop opaque and transparent materials made in UE4.
80.lv
最も軽量、flowmap使ったテクニック。ue4だけどノードベースなので簡単に移植できます。
VR Conservatory Part 1: Rainy Glass Shader – Toadstorm Nerdblog
www.toadstorm.com
最も軽量2、同じくflowmap。unity amplify。
水滴シミュレーションGPU版
Shadertoy
Build shaders, share them, and learn from the best community.
www.shadertoy.com
オリジナル版をUnityに移植したもの。これは全画面エフェクトではないですね。ソースコードの公開は停止されてます。
Unity-Raindrops/Raindrop.shader at master · yumayanagisawa/Unity-Raindrops
raindrops shader. Contribute to yumayanagisawa/Unity-Raindrops development by creating an account on GitHub.
github.com
こちらに全画面エフェクト版が公開されてます。
http://hojogames.blog.fc2.com/blog-entry-313.html
hojogames.blog.fc2.com
Unity Compute Shader実装です
もしかしたら一番優しい？ Amplify Shaderですが、ShaderGraphでも実現できるだろうと言ってますね。
particle systemで水滴等のシミュレーションを行い、結果をRenderTextureに描きこんでいます。得られたグレースケールRenderTexutreuをAmplify Shaderで箱やキューブ用の水滴テクスチャとしていい感じにしています。
描画
とても丁寧な解説です。
まとめ
水滴系は毎フレームグレースケール画像相当のものを作成するところが重すぎるのでGPU実装をする傾向にあります。
