Comment créer un effet scintillant?


9

J'essaie de créer un effet scintillant pour mon shader en temps réel mais je ne sais pas comment.

Voici un exemple et un autre exemple .

entrez la description de l'image ici

Quelle technique puis-je utiliser pour implémenter cela?


Il pourrait être atteint via un effet post-processus, similaire à la floraison, mais en appliquant un motif (une texture en étoile) à la phase de sous-échantillon. Tout cela n'est que spéculation difficile.
akaltar du

1
Une carte normale et spéculaire ne vous permettrait-elle pas de le faire via une texture?
JohnB

J'ai fait un test en utilisant une carte normale. Mais le plus difficile est de les faire briller selon l'orientation de la vue et l'orientation de la lumière.
MaT

Réponses:


10

Eh bien, lorsqu'on nous demande de concevoir un shader, nous devons commencer par décomposer les choses en petits problèmes. Et tout comme il est à noter que l'effet scintillant ne rend pas le shader vraiment bon, mais l'éclairage et l'effet global, en utilisant un seul d'entre eux, ne seront pas aussi bons.

Tout d'abord, disons ce qui ne fait pas directement partie du shader:

  1. L'observation ne fait pas partie du shader, et elle est effectuée via une passe d'observation séparée.
  2. Je suppose qu'il y a occlusion ambiante (surtout que cette image montrée dans la question n'utilise surtout pas le rendu en temps réel mais c'est une hypothèse).

Deuxièmement, décomposons le shader réel en effets séparés:

  1. Il y a un éclairage anisotrope, c'est très essentiel pour l'aspect général du shader. La raison de cela est que le matériau réel contient des tissus, ces tissus brillants rend la réflexion de la lumière ont la sollicitation directionnelle, ce qui rend le plus quantité de lumière réfléchie par le fait que certaine direction.

entrez la description de l'image ici

entrez la description de l'image ici Notez que ces tissus ont une infinité de normales, mais la technique décrite ici se rapproche de la normale la plus significative

Afin de rapprocher le plus important normale, une façon de faire, est d'utiliser les coordonnées de texture et de calculer tangentes du maillage, et au lieu de calculer N . L vous calculez 1- (NT).

Explication complète ici . Et vous devez probablement implémenter cela dans le shader de fragments plutôt que la technique de sommet dont ils parlent. D'autres modèles anisotropes peuvent également s'appliquer.

Maintenant pour l'effet scintillant:

Cela peut être fait dans l'espace du monde / l'espace de texture local ou l'espace d'écran comme un passage séparé.

L'algorithme auquel je peux penser utilise une technique de traitement d'image (en supposant que le maillage a des coords de texture).

  • Générez un bruit 2D haute fréquence sur la surface du maillage en utilisant ses coordonnées de texture, le bruit perlin semble être un bon candidat.
  • Appliquez un filtre max en utilisant un noyau 3x3 sur le bruit. Cela générera un effet similaire à l'image ci-dessous, et le filtre max est décrit ici .

entrez la description de l'image ici

Notez que l'image ci-dessus n'est qu'un exemple du filtre max, et l'appliquer sur le bruit donnera quelque chose de similaire à un champ d'étoiles.

  • Une fois que vous avez fait cela, appliquez un filtre gaussien avec une certaine déviation sur le bruit pour obtenir une forme semblable à une étoile.

entrez la description de l'image ici

Exemple de filtre Gausian appliqué sur le bruit max (ed).

  • La dernière étape consiste à combiner cela avec une texture de maille d'origine et de la lumière. Il est préférable d'utiliser une opération binaire (|) ou -ing avec la texture / couleur de maillage d'origine, cela ne prendra que le blanc du bruit et supprimera tous les pixels noirs. En ce qui concerne la lumière (et éventuellement d'autres cartes spéculaires), la meilleure chose à faire est de l'ajouter ou de la moduler avec vos pixels précédemment combinés. Vous pouvez également avoir besoin d'un effet de post-traitement de lueur pour une meilleure lueur.

Notez que cette technique peut nécessiter une optimisation importante pour un shader en temps réel.


3

Il y a un article intéressant AMD - Getting Procedural .

Il semble que les étincelles soient plus difficiles que je ne le pense.
Solution décente: utilisez la position 3D pour indexer la fonction de bruit 3D, ajoutez le vecteur de vue, utilisez la fonction frac pour randomiser davantage les choses.

Sparkle:
float specBase = saturate(dot(reflect(-normalize(viewVec), normal),
lightDir));
// Perturb a grid pattern with some noise and with the view-vector
// to let the glittering change with view.
float3 fp = frac(0.7 * pos + 9 * Noise3D( pos * 0.04).r + 0.1 * viewVec);
fp *= (1 - fp);
float glitter = saturate(1 - 7 * (fp.x + fp.y + fp.z));
float sparkle = glitter * pow(specBase, 1.5);
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.