スポンサーリンク

[シェーダー]ガラスにつく雨、水滴の表現

Shader
2019.03.13

窓ガラスにつく水滴表現したいですね。ヒントとなりそうな情報をまとめてみました。

基本的には全画面エフェクトが多いです。ゲームであればカメラに水滴が垂れるような演出ですね。窓ガラスのようなオブジェクトに対応するためには基本情報を基に自分で何とかしないとダメです。

水滴表現に関しては2つのパートからなります

  • 垂れる水滴のシミュレーション
    • CPU実装
    • GPU実装
  • 描画
スポンサーリンク

水滴シミュレーションCPU版

GitHub - EdoFrank/RainDropEffect: RainDropEffect for the Unity Asset Store
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

解説あり

雨の日のカメラを作る - しゅみぷろ
はじめに カメラのレンズに雨が付着した感を出してみました。 ささっと作ったのですが、ちょっといい感じになったので自分で驚いてます。 雨粒が付着した部分は背景の映り込みが歪むようになっています。 Unity Standerd Assetに含まれるガラスシェーダーを使いまわしたので、10分くらいで実装することが出来ました。...
esprog.hatenablog.com
Making a rainy window in Unity – Part 1
たぶん一番丁寧

水滴シミュレーションGPU版

Shadertoy
Build shaders, share them, and learn from the best community.
www.shadertoy.com

オリジナル版をUnityに移植したもの。これは全画面エフェクトではないですね。ソースコードの公開は停止されてます。

【Unity】カメラに滴る雨をコンピュートシェーダで【解説未完】 - 北条ゲームズ Hojo Games
錦の北条の開発ブログ
hojogames.blog.fc2.com

Unity Compute Shader実装です

描画

Unity シェーダーチュートリアル　屈折表現
ノーマルマップを使用した屈折表現の作り方
tsumikiseisaku.com

とても丁寧な解説です。

まとめ

水滴のシミュレーションは真面目にやると数が多いのでGPU実装をするという流れです。最近はJobSystemが使えるのでCPUでも別スレッドにすれば案外いけるんじゃないかなと思っています。

スポンサーリンク