Création d'un matériau d'hologramme avancé dans UDK

Dans ce didacticiel, nous allons créer un matériau d'hologramme avancé dans UDK, qui s'animera à l'aide du mappage Parallax (mappage Bump) dans Unreal Development Kit. Nous allons également apprendre à utiliser les canaux RVB dans Photoshop pour créer une seule texture à partir de trois textures distinctes. Pour bien comprendre ce didacticiel, vous devez au moins connaître les bases de la création de shaders et de matériaux dans UDK..


1. préparation

Nous devons d'abord créer une texture pour l'hologramme dans Photoshop.

Avant de commencer à texturer, j'aimerais expliquer ce que nous allons faire exactement dans ce tutoriel. Comme indiqué dans l'image ci-dessus, à gauche du signe égal, nous avons trois textures: R, G et B. Si nous fusionnons (ou ajoutons) toutes ces textures ensemble, nous obtiendrons une nouvelle texture au format RVB. , qui est le résultat indiqué à droite du signe égal ci-dessus. L'objectif ici est de créer une texture à partir de ces trois textures en fusionnant des canaux. Passons donc à la création de la texture.

R


Cliquez pour agrandir

g


Cliquez pour agrandir

B


Cliquez pour agrandir

Nous allons utiliser les trois textures ci-dessus nommées R, G et B.

Comme je l'ai dit, au lieu de les enregistrer sous forme de trois textures distinctes; nous allons plutôt les fusionner dans le canal RVB. La modification et la création de canaux RVB dans Photoshop sont une procédure assez complexe, mais je vais néanmoins vous montrer comment ajouter des informations telles que des textures dans des canaux RVB dans Photoshop..


2. Créer les textures

Pour commencer, créez un nouveau 1024x1024 fichier dans Photoshop et chargez les trois textures ci-dessus dans le même fichier 1024x1024.


Cliquez pour agrandir

Après avoir créé le nouveau fichier 1024x1024 comme indiqué dans l’image ci-dessus, assurez-vous simplement de charger chaque texture dans un fichier. séparé couche et nommez-les R, g, et B respectivement, pour éviter toute confusion. Également créer un Nouveau calque rempli de noir pour le fond. Met le Mode de fusion de toutes les couches à Écran.


3. Copier le premier calque R

La chose importante ici est que tout les textures doivent être centrées exactement comme dans l'image ci-dessous. Si l'axe central des textures n'est pas le même, il y aura un problème.

Maintenant, la couche R appartient au canal rouge, la couche G appartient au canal vert et la couche B appartient au canal bleu. Commençons par le calque R pour le canal rouge. Tenir vers le bas CTRL et cliquez sur le R couche et copier la sélection en appuyant sur CTRL + C. Après avoir copié le calque, désactivez tous les calques, mais activez-le. seulement la couche noire remplie. Sélectionnez-le puis allez au Chaînes languette. Si vous ne voyez pas l'onglet CANAUX, activez-le à partir de l'option de menu Fichier, Windows> Chaînes.

Cliquez pour agrandir

4. Coller la couche R sur le canal rouge

Une fois que vous copiez le R couche, aller au Chaînes Onglet et cliquez sur le rouge canal, donc seulement le canal rouge sera activé et le reste sera désactivé. Sélectionnez le rouge canal et le coller en appuyant sur CTRL + V. Vous devriez maintenant avoir la texture au centre du canal rouge (comme sur la photo ci-dessous.) Une fois que vous avez la texture au centre du canal rouge, il est bon de partir.

Répétez cette procédure pour le g et B Couches. Rappelles toi g est pour le vert et B est pour le canal bleu.


Cliquez pour agrandir

Après avoir copié les trois couches dans les canaux appropriés, vous devriez maintenant avoir quelque chose qui ressemble à l'image ci-dessous. Ce que nous avons est, rouge pour le petit cercle intérieur, vert pour le cercle du milieu et bleu pour le grand cercle extérieur.


Cliquez pour agrandir

La dernière étape consiste à créer un autre nouveau calque rempli de noir. Et pour régler le Mode de fusion de notre nouvellement créé texture, à Écran mode (illustré ci-dessous.) Maintenant, sauvegardez la texture dans .TGA format.


Cliquez pour agrandir

Nous aurons également besoin d'une texture de scanner, alors créez un nouveau 128x128 texture de résolution, avec une belle ligne blanche mince et étalée (comme dans l'image ci-dessous). OU vous pouvez simplement télécharger l'image et l'enregistrer dans .TGA format.


Cliquez pour agrandir

5. Création du matériau dans UDK

Maintenant que nous avons les deux textures prêtes, il est temps de charger UDK. Une fois chargé, créez un nouveau Paquet appelé Hologramme. Après avoir créé un nouveau package Hologram et importé les textures dans UDK.


Cliquez pour agrandir

Créer un Nouveau matériel pour l'hologramme.


Cliquez pour agrandir

Double-cliquez sur le matériau Hologram nouvellement créé pour l'ouvrir. Éditeur de matériaux la fenêtre.

Pour ce matériel d'hologramme et pour mieux comprendre la configuration, j'ai divisé la configuration en 4 parties qui se présentent comme suit:

  • 1. Jauge centrale - Cela rend la texture du cercle central animer dans le Z axe, aller et retour.
  • 2. Rotateur à engrenages - Pour randomiser la rotation avec le reste du cercle.
  • 3. Effet de scintillement - Pour un effet de projection endommagé.
  • 4. Effet Scanline - Effet de balayage électronique pour le rendre plus réaliste.

Et ensuite, nous allons fusionner toutes les configurations ci-dessus en deux expressions Add.


6. Configuration de la jauge centrale

dans le Éditeur de matériaux fenêtre, glissez et déposez le Hologramme Texture et obtenez deux expressions, une Rotateur et BumpOffset. Comme le montre l'image ci-dessous, un Constant Vecteur valeur de 1,5 est branché sur le la taille du BumpOffset, qui est ensuite branché sur le Coordonner du Rotateur, puis branché sur le UV du Texture d'hologramme.

le rouge canal de la Texture d'hologramme est alors Multiplié avec une valeur de Constant3Vector expression, R=0.5, g=1,6 et B=1,5. Une fois que vous avez tout configuré correctement (comme dans l’image ci-dessous), sélectionnez l’ensemble de cette configuration en sélectionnant en portant vers le bas CTRL + ALT, puis faites glisser le bouton gauche de la souris et dupliquez la sélection en appuyant sur CTRL + W.


Cliquez pour agrandir

Après avoir dupliqué la configuration, ajoutez-les simplement à l'aide d'un Ajouter expression. Comme vous pouvez le voir sur l'image ci-dessous, les seuls changements que nous devons apporter ici concernent les valeurs de Vecteur constant expression, qui est 1. le La vitesse du Rotateur lequel est 0,125 et les valeurs RVB du Constant3Vector pour un bon mélange de couleurs jaune clair, qui sont 1,5, 1,6 et 0.5 de R, g et B respectivement.

le Constant3Vector est alors Multiplié avec le Bleu canal de la Texture d'hologramme. Appelons cela (ou commentons) comme "Centre Gauge", par en portant vers le bas CTRL + ALT puis en faisant glisser le la gauche bouton de la souris autour de la configuration, puis Droite-cliquez dessus et sélectionnez Nouveau commentaire. Type "Jauge centrale"et a frappé Entrer.


Cliquez pour agrandir

7. Configuration du rotateur à engrenages

Créez à nouveau une nouvelle configuration, mais cette fois, au lieu d’utiliser une valeur constante pour la hauteur du bumpoffset, nous utiliserons Sinus et Temps expressions. Il suffit de brancher le Temps dans le Sinus et ensuite donner le Sinus une Période de 2.0, dans les propriétés. Et puis branchez ça Sinus dans le la taille du Bumpoffset. Ce que font ces expressions sinusoïdales et temporelles, c’est osciller dans l’axe Z avec une période de 2, ce qui nous donne une belle et douce animation dans l’axe Z..

Comme indiqué dans l'image ci-dessous, branchez le Bumpoffset dans le Coordonner du Rotateur, puis branchez-le sur le UV du Texture d'hologramme. Pour lui donner un bel effet de couleur verdâtre, obtenez un Constant3Vector expression et entrez les valeurs suivantes R=1, g=2 et B=1 dans les propriétés. ensuite Multiplier avec le rouge canal de la Texture d'hologramme. Une fois cela fait, sélectionnez toute cette configuration et dupliquez-la.


Cliquez pour agrandir

Après avoir dupliqué l’ensemble de la configuration, ajoutez les deux en utilisant un AJOUTER expression. Comme indiqué dans l’image ci-dessous (Setup 1 + Setup 2.). Il ne nous reste plus qu’à modifier la valeur de Rotateur, alors il suffit de changer le La vitesse du Rotateur à -0.5 (Négatif .5).

Maintenant que nous avons créé une nouvelle configuration, il est temps de fusionner cette configuration avec le Jauge centrale configuration que nous avons créée plus tôt. Pour ce faire, obtenez un Ajouter expression et branchez le Sortie du Ajouter pour les configurations 1 et 2, dans le UNE de la nouvelle création AJOUTER expression, comme dans l'image ci-dessous.

Où le point de fusion est du principale AJOUTER expression (qui fusionne les deux Jauge centrale et Rotateur à engrenages configurations) font sûr brancher le Sortie de la jauge centrale AJOUTER expression, dans le B de cette fusion Ajouter expression. Ce qui est montré dans l'image au dessous de.


Cliquez pour agrandir

Les deux configurations devraient maintenant ressembler à ce qui est montré ci-dessous. Maintenant, il est temps de configurer certains effets de scintillement.


Cliquez pour agrandir

8. Effets scintillants

Obtenir un Temps expression et branchez cela dans un Sinus, et dans les propriétés lui donner un Période valeur de 0,000010. Branchez ça Sinus expression dans un Pince constante expression et lui donner les valeurs suivantes, Min= -3 et Max= 1,0 dans ses propriétés. Maintenant, dupliquez ces trois expressions et obtenez un Multiplier expression, puis branchez ces deux configurations dans le Multiplier nœud. Comme indiqué dans l'image ci-dessous, il suffit de changer le Période valeur de la nouvelle Sinus à 0,01 et aussi changer le Pince constante, Min et Max valeurs à -dix et 2 respectivement.

Désormais, nous avons besoin que cette texture d’Hologramme soit désaturée. Désaturation expression et branchez le Texture d'hologramme dans le Désaturation, juste lui donner un Luminance valeur de 1,0 à chaque canal de désaturation qui est RGBA. Nous avons besoin que cette texture désaturée soit animée aussi, alors obtenez un Temps et un Sinus expression, puis branchez le Temps dans le Sinus.

Nous avons également besoin d’être légèrement compensé dans le Z axe. Nous avons donc besoin d'un BumpOffset et un Rotateur expression pour faire pivoter la texture. Alors, prenez ces deux expressions et branchez le Sinus dans le la taille du Bumpoffset, et branchez ça Bumpoffset dans le Coordonner du Rotateur. Enfin, branchez-le sur le UV du Texture d'hologramme (comme dans la configuration présentée en bas de l'image ci-dessous.) Nous devons maintenant multiplier toutes les configurations, alors branchez-le. tout les connexions correctement comme indiqué dans l'image ci-dessous, et passons à la création d'un effet Scanline.


Cliquez pour agrandir

9. Effet Ligne de balayage

Faites glisser et déposez ça Scanner texture dans cette Hologramme Éditeur de matériaux la fenêtre. Et obtenez deux expressions, une Panner et un TexCoordinate. Branchez le TexCoordinate dans le Panner, et maintenant dans les propriétés du Panner, met le Vitesse de X et Y à la même La vitesse de 1,0 et branchez ceci Panner dans le UV du Scanline Texture que nous avons importé plus tôt.

Nous avons besoin que cette Scanline soit un peu bleutée, nous devrons donc Multiplier ceci avec un Constant3Vector expression. Tout comme dans l'image ci-dessous, branchez cette Scanline Texture dans le UNE entrée du Multiplier et branchez le Constant3Vector dans le B du Plusieurs expression. Puis entrez RVB valeurs de 1, 2, 2 dans les propriétés du Constant3Vector respectivement.

Pour compléter la configuration, nous avons également besoin de la texture de l’Hologramme, mais dans une version en niveaux de gris ou désaturée. Hologramme Texture avec un Désaturation expression et branchez Texture d'hologramme dans le Désaturation (comme indiqué ci-dessous.) Dans les propriétés du Désaturation expression, donner un Luminance valeur de 1,0 à chaque canal qui est RGBA. Maintenant, nous devons fusionner toutes ces expressions, alors obtenez un LERP expression ainsi qu'un Constant Vecteur expression, avec une valeur de 0.

Maintenant, branchez ça Vecteur constant expression à la UNE du Lerp entrée, et pour B, branchez simplement ça Multiplier expression de la Scanline Texture, et puis branchez ça Désaturation dans le Alpha Entrée du LERP. Assurez-vous simplement que chaque connexion est correctement branchée (comme indiqué dans l'image ci-dessous.)


Cliquez pour agrandir

Maintenant que toutes les configurations sont prêtes, c’est le Jauge centrale, Rotateur à engrenages, Effet de scintillement et le Effet Scanline, il est temps de fusionner les quatre configurations en utilisant simplement deux AJOUTER expressions. Donc obtenir deux AJOUTER expressions. La connexion va comme ceci: le Rotateur à engrenages et Effet de scintillement sont branchés sur le UNE Et B Les entrées du Ajouter respectivement, alors ce AJOUTER est branché dans le UNE de la seconde AJOUTER Contribution. Et finalement, le Effet Scanline est branché sur le B de la seconde AJOUTER contribution.

À présent Commentaire ces deux AJOUTER expressions, comme "Interrupteur principal". Maintenant, branchez simplement le deuxième AJOUTER dans le DIFFUSER Channel, juste comme dans la photo ci-dessous. Et puis aller à Windows> Propriétés.


Cliquez pour agrandir

10. Propriétés du matériau

dans le Propriétés fenêtre, développez le Matériel section et définir la Valeur du clip du masque d'opacité à 0,2. Met le Mode de fusion à BLEND_Additive, la Modèle d'éclairage à MLM_Unlit et assurez-vous aussi À deux côtés le visage est SUR en cochant l'option.


Cliquez pour agrandir

Conclusion

C'est tout! Votre matériel d'hologramme est prêt. Il suffit d’appliquer ce matériau sur n’importe quel maillage et de voir la magie!

Vous trouverez ci-dessous un aperçu complet en haute résolution de la configuration du matériau de l'hologramme..


Cliquez pour agrandir