Shader de verre réfractif

10

J'ai un sol hexagonal infini, généré en tessellant une grille de points dans une paire de shaders de tessellation:

entrez la description de l'image ici

Notez qu'il s'agit d'un filaire plat - les "ombres" sont un truc d'éclairage:

entrez la description de l'image ici

Maintenant, je voudrais que ce soit un verre épais et réfringent, mais je ne sais pas comment procéder.

La première chose qui m'est venue à l’esprit est de

  1. définir un uniforme contenant "l'épaisseur" demandée des blocs
  2. Lors du calcul de l'éclairage, utilisez la loi de Snell pour calculer la longueur du chemin optique qu'un rayon prendrait à travers le bloc hexadécimal, s'il était réellement aussi épais que le dit l '"épaisseur" uniforme, et additionnez l'alpha sur cette longueur. Cela donnerait la transparence, mais ne gère pas des choses comme la réflexion interne / TIR, etc.

entrez la description de l'image ici

Je n'ai pas encore essayé cela, donc je ne suis pas sûr du résultat visuel.

En fin de compte, pour ce niveau particulier, j'essaie d'obtenir ce look de sol hexagonal en verre utilisé dans Tron: Legacy pendant la bataille de disques. ( Voir cette image pour un exemple .)

Suggestions?

3Dave
la source
1
Pouvez-vous expliquer davantage quel look vous essayez d'obtenir? La photo Tron montre principalement la réflexion, AFAICT, pas la réfraction - vous ne pouvez pas vraiment voir à travers les plaques de sol dans la plupart des photos. En supposant que vous ne voulez pas seulement une surface brillante, que voulez-vous voir à travers le sol? Y a-t-il une texture de sous-plancher que vous souhaitez afficher? Y a-t-il toute une scène sous le plancher (comme dans Tron)? Ou voulez-vous qu'il ressemble davantage à du verre dépoli où vous ne pouvez pas voir une image distincte, mais avoir un effet de diffusion souterraine?
Nathan Reed
Diffusion souterraine, même si je ne savais pas que cela s'appelait. Rend Google plus facile. :)
3Dave

Réponses:

4

Cet article dans GPU Gems approfondit la réfraction, ce qui peut donner de très bons résultats

(a) Transparence totale (b) Verre réfractif

Au sens le plus élémentaire

La première étape de la technique de réfraction de base consiste à rendre la géométrie de la scène en texture, en ignorant tous les maillages de réfraction. Cette texture peut être utilisée pour déterminer quels objets sont visibles derrière les objets réfractifs qui seront rendus lors d'un passage ultérieur. Nous désignons cette texture par S.

La deuxième étape consiste à rendre les maillages réfractifs, en recherchant les valeurs de la texture S avec une perturbation appliquée pour simuler l'aspect réfractif. La perturbation peut être obtenue en utilisant une carte normale N, où les composants rouges et verts (XY) de la carte normale sont utilisés et mis à l'échelle par une petite valeur pour ajouter un déplacement dans les coordonnées de texture projetées. Cette approche est simple à mettre en œuvre dans un shader:

  1. récupérer la texture N
  2. utiliser les composants XY mis à l'échelle par une petite valeur (telle que 0,05)
  3. ajouter cette valeur de déplacement dans les coordonnées de texture projetées pour S

La liste suivante montre un shader qui illustre cette approche

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);
}

Les images suivantes illustrent ces trois étapes

Les trois étapes répertoriées dans le shader ci-dessus

Il y a des techniques plus avancées dans le même article qui peuvent obtenir un look beaucoup plus attrayant


Pour un effet similaire dans Unity, vous voudrez peut-être consulter la page wiki de The Refraction Shader

codemonkey
la source
3

Je vais prendre l' image que vous avez montrée comme référence pour la façon dont j'imagine l'effet. L'algorithme auquel je pense est simple:

  1. Rendez l'environnement dans une texture de carte de cube afin de simuler la réflexion de l'environnement.
  2. Appliquez la texture de la carte du cube dans un plan qui représente la couche sous le plancher réfractif. Ne rendez pas encore l'avion.
  3. Rendez l'avion dans une texture, une texture 2D normale.
  4. Passez la texture au shader de réfraction utilisé pour rendre le sol réfractif.
  5. Rendez maintenant les mailles réfractives / sol avec un shader de réfraction.

En ce qui concerne le shader de réfraction, afin de simuler le verre que vous pouvez faire

  • Utilisez le terme de Fresnel pour simuler la réflexion et la réfraction.
  • Utilisez la carte normale / normale pour effectuer une extraction de texture.

J'ai juste pensé à l'idée, donc je ne l'ai pas testée. Je suis sûr qu'il a besoin de plus de travail, peut-être que je le ferai à mon retour du travail.

concept3d
la source
Approche intéressante - je vais devoir mijoter un peu. Merci pour la contribution.
3Dave