屈折ガラスシェーダー


10

テッセレーションシェーダーペアのポイントグリッドをテッセレーションすることで生成される無限の六角形の床があります。

ここに画像の説明を入力してください

これはフラットワイヤーフレームであることに注意してください。「シャドウ」は照明のトリックです。

ここに画像の説明を入力してください

これを厚く屈折したガラスのように見せたいのですが、どうすればよいかわかりません。

最初に頭に浮かんだのは

  1. ブロックの要求された「厚さ」を含むユニフォームを設定します
  2. ライティングを計算するときは、スネルの法則を使用して、「厚み」のユニフォームが言うほど実際に厚い場合、光線が六角形ブロックを通過する光路長を計算し、その長さのアルファを合計します。それは透明性を与えますが、内部反射/ TIRなどのようなものを扱いません。

ここに画像の説明を入力してください

私はまだそれを試していませんので、視覚的な結果がどうなるかわかりません。

最終的に、この特定のレベルでは、ディスクバトル中にTron:Legacyで使用されているそのガラスの六角形の床の外観を取得しようとしています。(例については、この画像を参照してください。)

提案?


1
あなたが達成しようとしている外観をもっと説明できますか?Tronショットは、ほとんど反射でAFAICTを示しています。屈折ではありません。ほとんどのショットでは、床板を実際に透視できません。光沢のある表面だけが必要ではない場合、床を通して何を見たいですか?表示したいサブフロアテクスチャはありますか?床の下に全体のシーンがありますか(トロンのように)?それとも、明確な画像を見ることができないが表面下の散乱効果がある曇りガラスのようにしたいですか?
ネイサンリード

表面下散乱、それが何と呼ばれるかは知りませんでした。グーグル操作が簡単になります。:)
3Dave、2014年

回答:


4

GPU Gemsのこの記事では、屈折について深く掘り下げています。これにより、かなり良い結果が得られます。

(a)完全な透明性(b)屈折ガラス

最も基本的な意味で

基本的な屈折テクニックの最初のステップは、すべての屈折メッシュをスキップして、シーンジオメトリをテクスチャにレンダリングすることです。このテクスチャを使用して、後続のパスでレンダリングされる屈折オブジェクトの背後に表示されるオブジェクトを決定できます。このテクスチャをSと表します。

2番目のステップでは、屈折メッシュをレンダリングし、テクスチャSから摂動を適用して値を調べ、屈折の外観をシミュレートします。摂動は、法線マップNを使用して実現できます。この場合、法線マップの赤と緑(XY)コンポーネントが使用され、投影されたテクスチャ座標に変位を追加するために、いくつかの小さな値でスケーリングされます。このアプローチは、シェーダーに実装するのが簡単です。

  1. テクスチャNをフェッチする
  2. 小さな値(0.05など)でスケーリングされたXYコンポーネントを使用する
  3. この変位値をSの投影されたテクスチャ座標に追加する

次のリストは、このアプローチを示すシェーダーを示しています

half4 main(float2 bumpUV : TEXCOORD0,
  float4 screenPos : TEXCOORD1,
  uniform sampler2D tex0,
  uniform sampler2D tex1,
  uniform float4 vScale) : COLOR
{
  // fetch bump texture, unpack from [0..1] to [-1..1]
  half4 bumpTex=2.0 * tex2D(tex0, bumpUV.xy) - 1.0;

  // displace texture coordinates    
  half2 newUV = (screenPos.xy/screenPos.w) + bumpTex.xy * vScale.xy;

  // fetch refraction map
  return tex2D(tex1, newUV);
}

次の画像は、これらの3つのステップを示しています

上記のシェーダーにリストされている3つのステップ

同じ記事に、より魅力的な外観を実現できるより高度なテクニックがあります。


Unityで同様の効果を得るには、The Refraction Shader wikiページをご覧ください。


3

ご覧いただいた画像を参考に、その効果を想像させていただきます。私が考えることができるアルゴリズムは単純です:

  1. 環境の反射をシミュレートするために、環境を立方体マップテクスチャにレンダリングします。
  2. キューブマップテクスチャを、屈折床の下のレイヤーを表す平面に適用します。まだ飛行機をレンダリングしないでください。
  3. プレーンをテクスチャ、通常の2Dテクスチャにレンダリングします。
  4. 屈折床のレンダリングに使用される屈折シェーダーにテクスチャを渡します。
  5. ここで、屈折メッシュ/床を屈折シェーダーでレンダリングします。

屈折シェーダーに関して、あなたができるガラスをシミュレートするために

  • フレネル項を使用して、反射と屈折をシミュレートします。
  • 法線/法線マップを使用して、テクスチャフェッチを実行します。

私はそのアイデアを思いついたので、テストしませんでした。もっと仕事が必要だと思います。仕事から帰ったら多分やります。


興味深いアプローチ-私はそれを少し煮込む必要があります。入力いただきありがとうございます。
3Dave、2014年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.