Créez de magnifiques bâtiments de traitement avec Blueprint

Présentation

La génération de plans de bâtiments procéduraux est une idée tentante. L'utilisation de modules standardisés et le placement automatique sont assez logiques, car, après tout, c'est la même architecture. Mais comment pouvons-nous, en texturant, atteindre la diversité naturelle au lieu de la répétition?

Ce bâtiment a été créé à partir d'un seul module, copié automatiquement dans Construction Blueprint . L'idée est que le matériel ne nécessite presque aucune saisie manuelle de données. Un seul matériau est utilisé pour l'ensemble du bâtiment (hors fenêtres). Ses fonctions sont utilisées pour contrôler la randomisation de la couleur des sommets et la position des pixels dans l'espace mondial.


Le seul module est tout ce dont nous avons besoin


Aucun placement manuel ou script. Toute randomisation se fait dans le matériau.

Le matériel décrit dans ce tutoriel:

• A une couche de saleté dépendante de la hauteur qui recouvre l'objet uniquement à la hauteur absolue spécifiée
• Sélectionne la couleur des objets pour chaque étage et segment au hasard
• Décale légèrement la position des petits objets, également de manière aléatoire
• Permet à l'utilisateur de sélectionner 2 couleurs pour les murs, ainsi que la valeur de leur destruction

Couleur de sommet en tant que données

03:34

En plus des positions des sommets et des normales, les moteurs de jeu donnent généralement accès à d'autres valeurs, par exemple la couleur des sommets. Lors de l'ombrage d'un triangle maillé, la couleur est interpolée entre les sommets. Vous pouvez le dessiner dans un éditeur 3D ou utiliser l'onglet Paint dans l'UE. Si vous le faites dans le moteur, vous aurez la possibilité de modifier une instance distincte du maillage dans le monde. J'ai expliqué ce cas d'utilisation dans le didacticiel sur le dessin de sommets . Cependant, dans ce cas, nous nous en tiendrons à la couleur importée, car j'ai décidé d'utiliser les canaux RVB comme masques exacts qui contrôlent la randomisation.


N'oubliez pas que la couleur dans les graphiques 3D n'est qu'un vecteur à trois composants . Ses composants sont la luminosité du rouge, du vert et du bleu dans la plage 0 - 1. La valeur est arbitraire, car la couleur du sommet n'est que des données. Au lieu de les utiliser directement pour peindre des textures, j'ai décidé d'emballer les couleurs des masques dans chaque canal:

• Le canal rouge est le masque des couleurs primaires et secondaires des murs . Les polygones avec une valeur de 0 utilisent la couleur primaire, avec 1 - la couleur secondaire.
• Canal vert - utilisé pour sélectionner une couleur dans la palette . Cela vous permet de contrôler la variation de couleur des petits articles, tels que le séchage des vêtements. Une valeur comprise entre 0 et 1 est arrondie à l'index (position UV) dans la texture de la palette.
• Canal bleu - décalage des positions des sommets pour déplacer les sommets horizontalement. Cela signifie que 0 sera utilisé pour les murs (pas de mouvement), et des valeurs jusqu'à 1 peuvent être attribuées au climatiseur ou au linge. Ce canal contrôle également la visibilité (masque d'opacité). Si la valeur est supérieure à 0, une valeur aléatoire est ajoutée, la sienne pour chaque segment du bâtiment, pour créer une variabilité.

Dans tout éditeur 3D sérieux, il existe une fonction pour peindre la couleur des sommets. Vous pouvez facilement trouver des instructions sur la façon de procéder dans votre éditeur. N'oubliez pas d'indiquer à Unreal Engine dans la fenêtre d'importation de maillage afin qu'il remplace ( Remplace ) la couleur des sommets (plutôt que de l'ignorer ( Ignorer )).

Comme je l'ai dit ci-dessus, la couleur de ce projet est un ensemble de valeurs exactes. Pour une tâche similaire, et presque n'importe quelle tâche technique de l'art du jeu, je préfère utiliser Houdini . Cependant, un résultat similaire peut être obtenu (avec un peu plus d'efforts) dans n'importe quel autre éditeur 3D. Faites juste attention à ce que chaque canal de couleur doit indiquer dans le shader.

J'ai mis en évidence l'ensemble du processus d'attribution de valeurs aux canaux de couleur de sommet dans un didacticiel distinct: stocker les données dans la couleur de sommet à l'aide de Houdini . Dans ce tutoriel, j'utilise les outils Houdini délicats pour rendre le processus plus efficace.

Plan de construction

07:57

Le plan que j'ai créé est simple. Il crée simplement un mur plat du bâtiment, reproduisant le maillage horizontalement et verticalement. Il a des variables mutables MeshWall (maillage statique), NumberOfFloors (entier), NumberOfSegments (entier) et Material .


Le résultat du plan: 4 étages, 2 segments.

L'ensemble du processus est exécuté dans Construction Script, c'est-à-dire pendant l'édition de niveau. Grâce à cela, le maillage résultant se comportera comme tout autre objet statique. Par exemple, il sera pris en compte lors de la construction de l'éclairage.


Les dimensions du maillage sont mesurées en premier. La longueur de la bordure signifie la moitié de la taille de l'objet. Nous pouvons le calculer une fois et l'enregistrer, car pour tous les segments, la valeur sera la même.


Le reste du code s'exécute en deux cycles. La boucle extérieure crée des étages dans leur ensemble, la boucle intérieure crée des segments dans l'étage actuel. L'emplacement est calculé par les indices d'itération de boucle multipliés par la largeur et la hauteur du maillage.



Un nouveau composant de maillage statique est ajouté à chaque segment. Dans certains cas, il sera utile d'utiliser des instances. L'ajout de composants entraîne une augmentation du nombre d'appels de tirage, ce qui peut provoquer des problèmes dans les scènes «lourdes».


C’est tout. Lors de la définition de nouveaux NumberOfFloors et NumberOfSegments, le bâtiment sera automatiquement mis à jour.

Deux couleurs de mur masquées par la couleur des sommets

21:16


Les deux couleurs sont accessibles en tant que paramètres. Le canal rouge de la couleur des sommets est utilisé comme coefficient de mélange entre eux.

Emballage et mélange de canaux

14:22


Nous voulons que les couleurs des murs affectent uniquement les murs eux-mêmes, mais pas les cadres de fenêtres et les climatiseurs. De plus, ils ne devraient pas affecter les zones endommagées. Cela peut être fait en enveloppant le masque dans le canal alpha de la couleur de base. En d'autres termes, la texture de la couleur de base a un fond transparent, et c'est là que les couleurs des murs sont affectées.

Soit dit en passant, j'ai emballé les textures de métal, de rugosité et d'occlusion (toutes dans des tons de gris) dans les canaux R / G / B de la même texture . Cela réduit le nombre d'échantillonneurs, de fichiers et de Lerp de trois fois - une excellente optimisation qui ne nécessite aucun compromis. Un tutoriel sur cette technique se trouve dans les notes.

Le bruit de la texture

Ce motif de bruit a été utilisé pour se fondre entre le premier (propre) et le deuxième (endommagé) jeux de textures. Au lieu de le calculer en temps réel, ce qui pour un bruit de haute qualité sera une procédure coûteuse, je le charge simplement à partir de la texture. Le nœud WorldAlignedTexture le projette sur trois côtés ( il génère des coordonnées UV de manière procédurale ).

Saleté en fonction de la hauteur. Fonction de remappage

18h00


La saleté est une couleur plate appliquée par un dégradé dans l'espace mondial. La composante Z de la position des pixels dans le monde est convertie en intervalle 0-1. Cela nous donne un masque utile - coefficient de Lerp . Le minimum et le maximum initiaux (par exemple de 150 à 700 cm) sont transmis par l'utilisateur sous forme de paramètres scalaires. Un peu de bruit est ajouté pour rendre la transition plus naturelle.



La fonction TAA_Remap_01_Clamped a été créée par mes soins. Je l'utilise dans presque tous les shaders. Il convertit la valeur de l'intervalle source en intervalle 0-1. Idéal pour créer des masques en fonction de la distance (de la caméra, du sol ou même pour les formes dans l'espace UV).

Randomisation des couleurs, masquage des éléments

22 h 55


L'obtention d'une valeur aléatoire à partir du point de référence de la position du segment vous permet de décaler la palette de couleurs pour les petits objets. Une palette est une texture avec des couleurs alignées horizontalement, donc déplacer l'image utilisée pour la lecture nous donne la couleur finale.



La texture de la palette à plus grande échelle. Sa taille habituelle est de 8 × 1 pixel avec compression désactivée


Le canal de couleur du sommet vert sert de valeur de randomisation et de masque. Une valeur de 0 signifie "ne pas appliquer de couleur ici".

Appliquer le décalage de position locale

La dernière fonction consiste à déplacer des objets de façon aléatoire le long de l'axe X. Pour ce faire, un décalage de position contrôlé par le matériau est ajouté aux sommets. Lorsque vous utilisez cette astuce, vous devez être attentif à deux choses - les collisions complexes (pour la prise de vue) et les champs de distance. L'un et l'autre paramètre ne savent pas qu'un tel décalage a été effectué.

Je reprendrai le canal bleu et ajouterai un nombre aléatoire - le même bruit basé sur la position du segment que nous avons utilisé plus tôt. Convertissons-le de l'intervalle 0-1 à l'intervalle de -0,5 à 0,5, afin que le mouvement soit effectué dans les deux sens. Ensuite, nous le multiplions par PositionOffsetStrength . Le nœud Append ajoutera les axes restants (constante 0 sur Y et Z).

De façon assez inattendue, Unreal nécessite que la sortie soit décalée en coordonnées universelles . Nous avons calculé la position locale . Comment le convertir?

Cela peut être fait en transformant l'espace de cette nouvelle position locale en espace mondial en utilisant le nœud Transformer . Ensuite, je soustrais la position initiale du sommet dans le monde de cette nouvelle position du sommet, obtenant le décalage du monde au lieu de la position. Combinez cela avec la sortie du matériau World Position Offset , et c'est là que le travail est effectué.

Matériau fini

J'espère que vous avez appris quelque chose de nouveau grâce à ce tutoriel. Voici une capture d'écran de l'intégralité du graphique du nœud de matériau:

Fichiers du projet et discussion

Vous pouvez télécharger des fichiers de projet gratuitement (ou pour un don, si vous le souhaitez): fichiers de projet . Si vous avez des commentaires ou des questions, rejoignez la discussion dans Reddit .

Lecture complémentaire

• Un moyen simple d'intégrer des textures dans des canaux RVB consiste à enregistrer trois textures en niveaux de gris dans les canaux d'une seule image RVB à l'aide de Photoshop. L'emballage vous permet d'économiser de l'espace et, plus important encore, d'obtenir trois textures en une seule opération de lecture. Cela en vaut la peine car la lecture des textures de la mémoire est l'une des opérations GPU les plus longues.