Le blog d’un développeur de jeu indépendant
Démos, dessins, tutos et galères du quotidien…

Suivez l’actu par mail !

Pour ne rien rater.

Chute d’eau et lacs

Salut!

Aujourd’hui, ce sera un article (presque) rapide sur le travail de la semaine: créer une apparence convenable pour les chutes d’eau et les lacs (c’est-à dire pas l’océan principal du jeu).

Le look final des chutes d’eau

 

En effet, je veux créer un monde avec des îles flottant/suspendues dans les airs. Peut-être l’avez vous déjà remarqué, mais il y a déjà de l’eau dans le jeu. J’ai déjà travaillé sur l’Océan principal, et ça n’a pas été facile de trouver un look correct. J’ai finalement choisi d’avoir une eau purement réflective (pas de réfraction). Le problème principal est que l’affichage de cet océan est très lourd en temps de calcul (à cause du reflet, qui demande d’afficher 2 fois la scène en réalité).

Si j’ai envie de rajouter d’autres plans d’eau (par exemple un lac sur une île) ou des chutes d’eau, je ne peux pas utiliser la même approche, car ça ralentirait beaucoup trop le jeu. En plus, calculer la réflexion de l’environnement pour un plan est « assez » facile, mais pour des formes complexes (comme une chute d’eau), les calculs sont autrement plus ardus, et l’architecture des cartes graphiques n’est pas (encore) très adaptée pour ce genre d’approche. Donc je dois trouver une alternative si je ne veux pas passer des jours à essayer de créer un matériau/shader incroyablement complexe que personne ne remarquera de toutes façons.

Finalement, j’ai choisi une combinaison de plusieurs techniques assez utilisées dans les jeux vidéos.

I – Texture environmentale (environment/cube map)

Une texture environnementale est une sorte de texture « sphérique » (en réalité, elle est souvent représentée sur les faces d’un cube) qui est appliquée sur un maillage en fonction de l’orientation de la normale de chaque face. L’idée est de simuler une réflexion du monde sur l’objet.

Une texture environnementale simule une réflexion parfaite de l’environnement. Ca marche bien sur une sphère, mais ce n’est pas toujours aussi convaincant sur d’autres primitives.

Techniquement, il est possible de calculer cette texture environnementale en temps réel pour obtenir une réflexion « réelle » de l’environnement. Mais en pratique, c’est très lourd en temps de calcul (il faut faire 6 rendus de la scène pour créer la texture en question). Et même dans ce cas là, le mapping (la manière de plaquer la texture sur le maillage) est toujours approximatif, ce qui ne trompera pas un œil averti.

C’est pourquoi j’ai choisi d’utiliser une texture environnementale pré-calculée: celle du ciel (que j’ai déjà décrite dans un post précédent).

II – Des « normal maps » mouvantes pour les vagues

Ensuite, afin de casser l’aspect lisse et plat de la réflexion parfaite, je rajoute 2 « normal maps » qui bougent à 2 vitesses différentes. Cela permet de créer un effet de vagues assez convaincant (car les « normal maps », comme leur nom l’indique, viennent altérer la normale de chaque surface et donc la réflexion calculée). C’est la même technique que j’utilise sur l’océan principal.

La texture environnementale avec des normal maps pour simuler les vagues

III – Texture d’écume

Celle-ci est une texture tout ce qu’il y a de plus classique que je rajoute par dessus les vagues. Pour garder une certaine cohérence graphique avec l’océan principal, j’utilise un blanc pur pour l’écume, et je joue avec le canal de transparence pour moduler l’impact visuel.

L’écume au dessus de l’eau.

IV – Distortion de l’écume

Comme je ne veux pas que l’écume reste statique, j’y ajoute une distorsion en altérant les coordonnées de texture via une texture de bruit (en réalité c’est la « normal map » que j’utilise pour générer les vagues, mais avec une échelle et une vitesse différente).

De l’écume qui bouge!

 

V – Gestion du cycle jour/nuit

La dernière étape est de prendre en compte le cycle jour/nuit déjà présent dans le jeu. En effet, le ciel/l’environnement changent en fonction du temps de jeu, et je ne peux pas laisser un ciel de nuit qui se réfléchit dans l’eau alors qu’on est au beau milieu de la journée par ailleurs, ça casserait totalement l’immersion du joueur. Je dois donc faire un « mix » des différentes textures d’environnement (jour/nuit) en fonction de l’heure (virtuelle) du jeu.

 

Réflexion en plein jour

 

Réflexion au crépuscule

VI – Réglages et particules

La dernier point difficile est le paramétrage de ce matériau de « fausse eau » (réflexions simulées). Il faut que son apparence soit le plus proche possible de l’océan principal. En toute rigueur, ceci est évidemment impossible car les 2 méthodes d’affichage diffèrent totalement, mais je dois réduire au maximum l’écart visuel.

L’océan principal avec de vraies réflexions.
L’eau d’un lac avec des réflexions simulées.

Comme vous pouvez le voir sur les images ci-dessus, pour les lacs et les étendues d’eau, la différence avec l’océan principal peut être assez flagrante en fonction de l’angle de la caméra. Mais pour le moment, je ne peux pas faire mieux.

Peut-être que plus tard je modifierai le shader de l’océan principal pour le rendre structurellement plus proche de celui des lacs, en espérant que ça me permette de réduire encore l’écart visuel de ces 2 matériaux (sans perdre la réflexion sur l’océan principal évidemment). Ou peut-être que je trouverai un autre moyen d’avoir des réflexions temps réel sur les lacs sans mettre à genoux la carte graphique (j’ai déjà essayé, mais sans succès pour l’instant).

Pour les chutes d’eau en revanche, l’effet est assez satisfaisant. Bon, j’imagine que c’est dû au fait que toutes les chutes d’eau ont le même matériau. Au passage, j’ai du ajouter des particules pour créer les éclaboussures.

Une chute d’eau avec des éclaboussures

Et voilà pour aujourd’hui! J’espère que ce post assez détaillé vous aura intéressé.

Et, je n’en parle pas ici, mais j’ai corrigé beaaaaaucoup de bugs depuis la dernière démo. Merci à tous les testeurs qui m’ont fait des retours!

A+


Publié

dans

par

Étiquettes :

Commentaires

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *