[FAQ] [3D] Effets graphiques
Qu'est-ce que le glow ?
Dans la réalité:
Le glow dans la réalité est en fait le halo lumineux que l'on peut voir au niveau de sources lumineuses.
Pour que nos yeux voient une couleur il faut que des photons les "percutent". Une source lumineuse va envoyer des photons dans une ou plusieurs directions (dans le cas d'un laser ils sont envoyés dans une seule direction ce qui explique on ne le voit pas, alors qu'une lampe va en envoyer dans toutes les directions et donc on la voit) et on voit un halo lumineux quand plusieurs de ces photons ont été déviés de leur trajectoire.
En effet il arrive que des photons percutent des atomes contenus dans l'air (ou dans l'eau), et ils sont donc déviés de leur trajectoire.
Le fait que le halo lumineux soit diffus est provoqué par le fait qu'il y a de moins en moins de photons qui suivent la même trajectoire.
Si par exemple un laser lance 10 000 photons (c'est bien plus que ça en réalité mais c'est pour l'exemple), il se peut que 1000 photons subissent une même déviation, mais ensuite parmi ces 1000 photons peut être que 500 vont être déviés de la même façon, alors que les autres vont être déviés dans une autre direction. Et donc au final il y aura de moins en moins de photons qui se retrouveront déviés au même endroits, ce qui explique ce halo diffus.
Voici ci dessous un exemple de glow sur un laser:
On peut voir sur l'image qu'il y a un halo lumineux diffus autour du laser, nous avons donc notre glow.
Vous remarquerez aussi que le glow est plus important quand il y a de la fumée ou du brouillard au niveau de la source lumineuse. Ce phénomène s'explique par le fait que dans de telles situations il y a plus d'atomes susceptibles d'être percutés par les photons.
Dans les jeux vidéo:
Dans les jeux vidéo une des façons de reproduire cet effet est de flouter (rajouter du flou) l'image puis d'ajouter l'image floue à l'image de base en faisant bien attention de n'ajouter que les parties lumineuses.
Ainsi on obtient une image finale sur laquelle les sources lumineuses sont entourées d'un halo lumineux.
Exemple en pseudo code:
On aurait par exemple une première pass dans le pixel shader, sur laquelle on va faire un render to texture (on stocke notre résultat directement dans une texture)
Voici à quoi pourrait ressembler cette pass en pseudo code:
Une fois qu'on a une image contenant uniquement la lumière (le reste étant noir) et qui est floue, on peut passer à la 2eme pass.=> point d'entrée du pixel shader depuis lequel on reçoit les coordonnées de la texture (ici la texture est l'image finale, donc le framebuffer, mais pour lequel on a extrait la lumière (pour ça vous pouvez utiliser une image servant de mask et contenant les intensités de lumière pour chaque pixel, ou bien directement stocker cette information dans le cannal alpha (s'il ne vous sert pas)))
- On stocke la couleur de la texture avec les coordonnées courantes.
- On ajoute à notre couleur la couleur de la texture avec des coordonnées légèrement modifiées (par exemple TexCoord.x-0.01)
- On répète l'étape du dessus autant de fois que vous le voulez et avec des coordonnées différentes à chaque fois, mais qui restent proches des coordonnées actuelles
- On divise la couleur obtenue par le nombre de fois qu'on a modifié la couleur (pour faire une moyenne et ainsi garder une couleur cohérente)
- On a donc notre pixel flouté, maintenant il faut l'enregistrer dans la texture crée (car on fait un render to texture dans cette pass)
Dans cette 2eme pass on va simplement prendre notre image ainsi que le framebuffer et mélanger les 2 ensemble:
=> point d'entrée du pixel shader.
- On va ajouter la couleur du pixel courant de notre image floue avec la couleur du pixel courant de notre framebuffer
Et nous voilà donc si tout va bien avec un effet de Glow
Lien: Onversity: Comprendre les effets visuels
**********************************************************
Qu'est-ce que le bloom ?
Dans la réalité:
L'effet bloom se produit lorsqu'une importante source lumineuse rencontre une surface très réfléchissante (comme du chrome). En effet à se moment là la surface réfléchissante pourra être assimilée à une source de lumière (plus ou moins importante en fonction de sa réflexion) et c'est ainsi qu'on obtient un effet de bloom.
Quand on a un effet de bloom on a généralement avec lui un effet de glow.
Voici un exemple d'effet bloom:
Context original de l'image ici: Next revision
Comme vous pouvez le voir depuis cette image une partie de la théière est très éclairée ce qui provoque un effet de bloom.
Dans les jeux vidéo:
Pour réaliser cet effet dans les jeux il faut travailler avec des grandes intensités de couleur (HDRR). Ainsi au lieu de travailler avec des canaux sur 8 bits vous allez travailler avec des canaux en nombres flottants sur 16 bits. de cette manière vous aurez une plus grande précision et un meilleur contraste avec les lumières intenses et le reste de la scène. Cependant les moniteurs ne supportent pas une telle précision, il vous faudra donc revenir sur des canaux 8 bits pour l'affichage, c'est le passage HDR -> LDR qu'on appelle le tone mapping (Plus d'infos sur wikipédia).
Il va donc vous falloir pour votre effet une image vous servant de mask et stockant l'intensité de lumière pour chaque pixel (ou bien vous vous servez du canal alpha si vous n'en n'avez pas besoin).
Depuis ce mask vous allez pouvoir transformer vos pixels qui sont sur des canaux 8 bits en pixels sur des canaux en nombre flottants 16 bits par une simple opération que vous choisissez. (par exemple: nombre16bits = nombre8bits * intensité).
Vous avez donc vos pixels en HDR, il vous faut maintenant les transformer en pixels LDR avec une formule de tone mapping comme par exemple: nombre8bits = pixelCourant16bits / plusGrandeValeurPixel16bits. Dans cet exemple pour chacun des pixels vous divisez sa valeur par la plus grande valeur de pixel que vous avez trouvé dans l'image. (Attention cependant car cette formule donne de mauvais résultats sur des images avec très peu de lumière très intense, car tous les pixels vont être divisés par cette couleur très intense, et donc l'image finale sera très sombre.)
Une fois que vous avez votre effet de bloom vous pouvez y ajouter un effet de Glow pour rendre la scène encore plus réaliste.
L'utilisation des 2 effets peut d'appeler l'effet Glare (éblouissement).
Lien: Onversity: Comprendre les effets visuels
**********************************************************
Qu'est-ce que le Depth of Field (DOF) ?
Dans la réalité:
Le depth of Field (DOF), ou encore champs de profondeur, est en fait un effet de flou généré sur des objets que nous ne regardons pas mais qui sont dans notre champs de vision.
En fait vous avez surement du remarquer que quand vous regardez un objet, les autres objets de votre champs de vision vous apparaissent flous. Si vous n'êtes toujours pas convaincus alors imaginez-vous dans votre voiture: vous avez devant vous le pare brise et derrière celui-ci il y a la route. Habituellement vous regardez la route, donc celle-ci vous apparaît nette, mais maintenant regardez le pare brise et seulement lui, eh bien vous verrez que cette fois la route vous apparaît floue.
Voici un exemple d'effet de champs de profondeur:
Contexte original de l'image: ce site
Dans les jeux vidéo:
Pour implémenter cet effet il faut d'abord, pour chaque pixel du framebuffer, savoir à quelle distance il se situe par rapport à la caméra.
Une fois que l'on connaît cette distance on va calculer le coefficient de flou à lui appliquer en fonction de cette distance, et on stocke ce coefficient à la place du canal alpha par exemple (Ou bien en créant une nouvelle texture avec cette information).
Une fois ceci fait, alors pour chaque pixel on va appliquer un flou qui sera plus ou moins fort en fonction du coefficient de flou. (Pour en savoir plus)
Cet algorithme suppose que vous regardiez l'objet le plus prêt de vous. Si ce n'est pas le cas, alors au lieu de calculer le coefficient de flou par rapport à la distance du pixel par rapport à la caméra, vous devez le calculer en fonction des informations qui vous intéressent.
Lien: Onversity: l'effet DOF
**********************************************************
Qu'est-ce que le motion blur ?
Dans la réalité:
Le motion blur est un effet de flou sur les objets en mouvement. Ce flou est provoqué par la persistance rétinienne de nos yeux. Ainsi quand nous voyons un objet son "fantôme" reste encore visible quelques secondes (voire moins) même quand l'objet en question n'est plus visible.
Voici un exemple de motion blur:
Contexte original sur: Cordermind
Dans les jeux vidéo:
Il y a plusieurs façons d'implémenter cet effet, mais le plus simple qui me vient à l'esprit serait que pour chaque objet en mouvement on stocke quelque part sa direction et sa vitesse (sa position étant déjà connue dans le vertex shader), et que par rapport à ces informations on crée un effet de flou qui suive la direction et qui aille plus ou moins loin en fonction de la vitesse de l'objet.
Lien: Onversity: Comprendre les effets visuels
**********************************************************
Qu'est-ce que le streak ?
Dans la réalité:
Pour vous mettre en condition imaginez que vous êtes dans la rue et qu'il fait nuit. cette rue est éclairée par des lampadaires, et si vous regardez leur source lumineuses vous verrez que ça forme une étoile.
Voici un exemple:
Vous pouvez voir sur cette image un exemple d'effet streak (qui veut dire écart). En effet on voit bien que les rayons lumineux partent dans tous les sens et formes une sorte d'étoile.
Cet effet est en fait provoqué par toutes les cassures, impuretés, poussières, etc... qu'il y a sur le verre et qui provoque donc une déviation de certains rayons lumineux, ce qui donne cet effet d'étoile.
Dans les jeux vidéo:
Cet effet n'est pas très dur à reproduire dans les jeux, et il y a plusieurs façons de le faire:
- Soit en se servant d'une image mask, sur laquelle ce qui est blanc (ou très clair) représente l'étoile, et ce qui est noir (ou très sombre) ne représente rien.
Avec cette technique il suffit, lorsqu'on a une source de lumière dans la scène, de récupérer la couleur de la lumière et d'appliquer ce mask au niveau de la lumière en appliquant la couleur de celle-i.
- Soit en faisant ça procéduralement (donc avec des calculs). Pour cette technique il faut par exemple définir différentes directions à partir de la lumière, et appliquer un flou depuis la lumière dans les différentes directions (vous choisissez la distance jusqu'à laquelle aller). Ainsi vous obtiendrai plusieurs rayons (en fonction du nombre de directions que vous avez choisis) qui partent de la source lumineuse et qui vont dans les directions que vous aurez choisies.
**********************************************************
Qu'est-ce que le lens flare ?
Le lens flare (effet de lentille) est en fait l'apparition de plusieurs halos lumineux lorsqu'on regarde une forte source de lumière avec une caméra (ou autre objet avec une lentille comme un appareil photos).
Voici un exemple de lens flare:
Contexte original sur GameDev
Sur cette image vous pouvez voir qu'il y a plusieurs cercles lumineux, c'est donc l'effet lens flare. (Cette image est tirée d'un article qui montre la création de cet effet ce qui explique que dans la réalité ce ne soit pas tout à fait comme ça)
Cet effet est produit à cause de la réflexion de la lumière entre les lentilles de la caméra qui crée des images fantômes de cette source de lumière.
Dans les jeux vidéo:
Cet effet à été l'un des premiers à être implémenter dans les jeux vidéo en raison de sa simplicité.
En effet pour créer ce genre d'effet il suffit d'avoir une image servant de mask représentant un cercle lumineux et d'appliquer ce mask aux bons endroits dans l'image.
Pour savoir où sont les bons endroits, il suffit de connaître la position de la source lumineuse et d'appliquer le cercle lumineux autant de fois que vous le voulez en direction de la caméra.
Lien: GameDev
Répondre avec citation
Partager