Starten met Programmeren van een 3D omgeving in Unreal Engine - Materialen Overzicht

Deze handleiding maakt deel uit van het programmeertraject:

Programmeren van een 3D-omgeving in Unreal Engine

Inhoud

Wat vooraf ging
Inleiding
Textures
Materials
PBR Materials
Workflow
Materialen toekennen
Praktisch voorbeeld: Gekleurd materiaal voor WhiteBoxing
Videosamenvatting

Wat vooraf ging

U bent vertrouwd met de werkomgeving van Unreal Engine.
U bent vertrouwd met Blueprint Visual Scripting.

Inleiding

Deze handleiding is een eerste in een reeks van handleidingen over Materials (materialen).

In deze handleiding wil ik als eerste kennismaking een overzicht geven van de basisbegrippen. De links in deze handleidingen verwijzen naar de officiële handleidingen waar u nog meer informatie vindt.

Om de zaken op orde te houden ga ik alle materialen bij mekaar plaatsen in een specifieke map (bv. een map Materialen).

Voeg in de Content Browser een map Materialen toe aan het project via Add New – New Folder. Denk even na waar u deze map het best plaatst binnen uw mappenstructuur. Omdat dit om een eenvoudige test gaat plaats ik de map hier gewoon onder de root.

Ga naar deze Folder door erop te dubbelklikken.

Om een Material aan te maken.

Klik met de rechtermuisknop in uw Materialen folder.
Klik op Material.

Textures

Textures zijn 2D afbeeldingen die gebruikt worden voor het aanmaken van materialen.

Zo kan er een textuur zijn voor:

Base Color/Albedo/Diffuse = de basiskleuren.

Roughness = de ruwheid die de weerkaatsing bepaalt.

Metallic = Metaal of niet.
Normal = de zogenaamde Normal map die informatie bevat over de richting waarin de Normals zich bevinden. Een Normal is de loodrechte op een vlak, dus de Normal map bevat informatie over de hoeken. Deze informatie wordt gebruikt voor de correcte weerkaatsing van het licht.

Ambient Occlusion = belichting en schaduw.
en eventueel nog andere mappen.

Textures importeren

Textures kunt u importeren door deze te slepen vanuit de Windows Verkenner of via de knop Import. Unreal Engine is slim genoeg om het type Texture (bv. een Normal-map) automatisch te herkennen en de juiste Compressie Setting te gebruiken.

Onderstaande formaten voor textuurafbeeldingen worden ondersteund:

Textures moeten voldoen aan een aantal regels:

Materials

Materials are a way to help display and manipulate how textures look on objects

Materials combineren en bewerken Textures tot een geheel dat als een materiaal kan toegekend worden aan een, deel van, een 3D object.

Material Tools

Materialen kunnen snel vrij complex worden, daarom komt Unreal Engine met verschillende tools.

Material Editor

Doel

De basis van al deze tools is de Material Editor, alle andere tools staan in dienst van de Material Editor.

De Interface

1	Menu Bar
2	Toolbar
3	Viewport Panel
4	Details Panel
5	Graph Panel
6	Palette Panel

In de Material Editor kunt u het materiaal op een visuele manier programmeren.

Master Material en Material Instances

Het basismateriaal zelf (Master Material) kan niet gewijzigd worden via programmeercode “at Run Time”.

Om waarden van een materiaal toch “at Run Time” te kunnen wijzigen kunt u parameters voorzien.

Vervolgens neemt u een Material Instance van het materiaal. Een Material Instance laat toe waarden van een materiaal, via voorziene parameters, te wijzigen “at Run Time”.

Shaders

Strikt genomen worden Materialen geprogrammeerd (in HLSL = High Level Shader Language).

Als u een materiaal ontwerpt is dit dus eigenlijk ook in HLSL geschreven.

Open een materiaal in de Material Editor, ga naar Window – Shader Code – HLSL Code.

U kunt nu het materiaal bekijken in HLSL.

Hieronder ziet u de workflow van Unreal Engine om een Material aan te maken.

Unreal Engine vertrekt vanuit een Shader Template in geschreven HLSL.
In de Material Editor wordt een Shader Template bewerkt op basis van een Visual Scripting Node systeem.
De Material Editor schrijft, achterliggend, een nieuwe Shader in HLSL, die een combinatie is van de gebruikte Template en de toegevoegde nodes.
Er wordt een Material Instance genomen van deze Material Shader die waarden toekent aan de variabelen van deze Material shader.
Deze Material Instance wordt toegekend aan de mesh/object.

Het kiezen van de Shader Template gebeurt door een aantal keuzelijsten zoals Material Domain, Blend Mode, Shading Model,….

Iedere Shader Template heeft zijn eigen specifieke Output nodes. Hieronder ziet u een paar voorbeelden, merk het verschik in de Blend Mode op, die samen met het Material Domain en het Shading Model onderdeel zijn van de Shader Template.

Material Expressions

Het programmeren van een materiaal gebeurt via Material Expressions. Deze Material Expressions zijn de bouwstenen van het materiaal. Net als bij Blueprint Visual Scripting kan dit programmeren Visueel gebeuren door het verbinden van nodes.

Er zijn tientallen Material Expressions, maar zoals zo vaak gebruikt u 90% van de tijd slechts een klein percentage. De meest gebruikte Material Expressions ziet u hieronder.

Constant – een getalwaarde.
ConstantVector – een vectorwaarde bestaande uit 3 getallen. Denk aan een kleur die bestaat uit 3 getalwaarden, een getal voor Rood, een getal voor Groen en een getal voor Blauw.
TextureSample – een texture. TextureSample kan de texture op verschillende wijzen uitvoeren: als RGB, enkel de Roodwaarde, enkel de Groenwaarde, enkel de Blauwwaarde, enkel de Alphawaarde of RGBA.
TexCoord – de coördinaten van de texture. TexCoord wordt meestal gebruikt om de UV (de tweedimensionale map van de texture) te schalen.
Panner – Panner wordt gebruikt om een texture te verschuiven over een aantal coördinaten (Coordinate), over een zekere tijd (Time) aan een bepaalde snelheid (Speed).
Multiply – Vermenigvuldig twee waarden (A en B). Multiply wordt ook gebruikt om textures te combineren.
Lerp – Lineair interpolate kiest een waarde tussen A en B op basis van de waarde van Alpha (die een waarde is tussen 0 en 1).
Bijvoorbeeld A = 3 en B = 7 en Alpha staat op 0.5 en ligt dus juist halverwege tussen A en B. De uitkomst zal dus 5 zijn.

Voorbeeld

Bijvoorbeeld, een texture schalen kan als volgt:

De TexCoord-node wordt gebruikt om textures te schalen op basis van de tweedimensionale UV map. De TextureSample-node bevat een texture.

De UTiling en de VTiling eigenschappen van de TexCoord-node krijgen de waarde 5. De texture wordt bijgevolg 5 keer herhaald (geschaald) binnen eenzelfde ruimte, wat in dit geval zorgt voor kleinere bakstenen.

In plaats van 2 keer 5 in te typen kunt u er voor kiezen deze eenmaal te vermenigvuldigen door gebruik te maken van de Multiply-node.

Parameters

Maar stelt dat u niet steeds met 5 wilt vermenigvuldigen, maar afhankelijk van het gebruik van het materiaal met een andere waarde. Om niet telkens een vaste waarde te moeten gebruiken kunt u gebruik maken van een variabele parameter.

Om een invoerparameter te maken, klik met de rechtermuisknop op de gewenste pin (hier de B-pin die de waarde 5 bevat) en kies voor Promote to Parameter.

Geef een naam aan de parameter (hier Tile) en eventueel een Default Value.

Material Instance

Parameters kunt u de gewenste waarde geven via een Material Instance.

Klik met de rechtermuisknop op het (Master) Material en kies voor Create Material Instance.

Dubbelklik de Material Instance en u ziet dat u de parameter de gewenste waarde kunt geven.

Weet dat u meerdere Material Instances kunt nemen van hetzelfde basismateriaal zonder dat er bijkomend geheugen ingenomen wordt.

Werken met Material Instances op basis van een Master Material is een enorme flexibele en efficiënte manier van werken.

PBR Materials

Unreal Engine werkt met Physical Based Rendering Materials en probeert het materiaal zo realistisch mogelijk weer te geven onder alle omstandigheden (lichtinval, duisternis,…).

De Shading (kleur) van PBR Materials wordt bepaald door:

Base Color – een basiskleur of een texture.
Metallic – Metaal of niet, een 0 of een 1 waarde of een Texture die in zwart wit aanheeft waar het materiaal Metallic is en waar niet.
Roughness – hoe ruw is het materiaal, een waarde tussen 0 en 1 of een Texture met grijswaarden die de ruwheid weergeeft.
Specular – hoe weerkaatsend (reflectie) is een niet Metallic materiaal, een waarde tussen 0 en 1 (wordt weinig gebruikt, enkel voor een artistiek effect).

Voor een overzicht van specifieke waarden verwijs ik door naar de officiële handleiding (gebruik de sliders om de waarden te wijzigen en het effect ervan te bekijken).

Base Color

Metallic

Roughness

Specular

Conclusie

Voorbeelden

Op basis van kleur

Op basis van textures

Combinatie van kleuren en textures

Workflow

Concreet maakt u een aantal basismaterialen/Master Materials (een basismateriaal voor glas, voor gras, voor hout,…) aan die u voorziet van parameters.
Vervolgens maakt Material Instances van deze basismaterialen en geeft u de gewenste waarden aan de parameters om verschillende soorten glas, gras, hout,… te creëren.

Materialen toekennen

Materialen worden toegekend aan meshes.

Een mesh kan echter meerdere materialen bevatten aangeduid met Element 0, Element 1,…

De materialen vindt u terug in de Content Browser.

Indien de mesch maar uit één element bestaat kunt u het materiaal rechtstreeks slepen vanuit de Content Browser naar de mesh in het level of via het pijltje toekennen aan het gewenste element.
Heeft de mesh meerdere materialen, open dan de mesh en gebruik de keuzelijst of het pijltje voor een toekenning aan het specifieke element.

Praktisch voorbeeld: Gekleurd materiaal voor WhiteBoxing

U hebt wellicht het onderstaande reeds gelezen in de handleiding over Whiteboxing.

Het lijkt misschien wat tegenstrijdig om tijdens WhiteBoxing gekleurde materialen te gebruiken maar door een kleurtje toe te voegen aan de Geometric Brushes, die u gebruikt tijdens het Whiteboxen, kunt u deze Geometric Brushes reeds een extra betekenis geven. Zo kunt u een kleurtje gebruiken voor muren, een ander voor de vloer, voor water, nog een kleurtje voor Geometric Brushes waar de speler schade kan oplopen,…

Niet alleen maken deze kleuren de level overzichtelijker maar geven ze ook al meteen een extra betekenis aan de vormen.

Voeg eerst een nieuw, Default level toe (of gebruik een bestaand level) aan uw project.
Plaats er op zijn minst een vloer en een muur (al dan niet met een deurtje in de muur zoals in mijn onderstaand voorbeeld).

We gaan deze vloer en muur voorzien van een eigen kleurtje.

Om een kleurtje te geven aan de Geometric Brushes moeten we beschikken over gekleurd materiaal. We gaan dit zelf ontwerpen.

Om de zaken op orde te houden ga ik alle materialen bij mekaar plaatsen in een specifieke map (bv. een map Materialen).

Voeg in de Content Browser een map Materialen toe aan het project via Add New – New Folder. Denk even na waar u deze map het best plaatst binnen uw mappenstructuur. Omdat dit om een eenvoudige test gaat plaats ik de map hier gewoon onder de root.

Ga naar deze Folder door erop te dubbelklikken.

We gaan nu een volledig nieuw, erg eenvoudig, materiaal maken.

Klik met de rechtermuisknop in uw Materialen folder.
Klik op Material.

Geef het materiaal een gepaste naam. Omdat ik eerst een basismateriaal ga maken waarvan ik later andere materialen kan afleiden (instances) noem ik dit materiaal Kleur_Basis.

Dubbelklik het materiaal Kleur_Basis om het te openen.

We gaan deze Material editor nog vaker tegenkomen en ik ga het principe toepassen “al doende leert men”, wat inhoudt dat ik hem niet volledig ga bespreken maar gewoon telkens datgene ga bespreken dat we op dat ogenblik nodig hebben.

Maar omdat het misschien de eerste keer is dat u met deze Material editor werkt, toch even een korte rondleiding.

Linksboven, die zwarte bol ziet u een Preview. Zo zal uw materiaal eruit zien. Hebt u liever een andere vorm dan een bol dan kunt u één van de andere vormen kiezen. De laatste vorm, het theepotje, staat voor de huidige geselecteerde Static Mesh.
Linksonder ziet u het Details-panel en kunt u gedetailleerde eigenschappen instellen.
Rechts ziet u een pallet met allerhande mogelijke “functies” die u kunt gebruiken om het materiaal aan te maken.
In het midden hebt u de Viewport. Hier bouwt u het materiaal door de gewenste waarden toe te kennen aan de beschikbare delen (Result nodes) die samen het materiaal bouwen.

Het materiaal dat we gaan maken is heel eenvoudig, het bestaat uit:

Een kleur
Een Texture van een Grid (we kiezen de meegeleverde Grid)
De kleur en de grid worden gecombineerd (Multiply) en toegevoegd aan de Base Color (u zou ze ook kunnen toevoegen aan de Emissive Color dat een lichte gloed verspreidt).
Omdat we dit materiaal willen hergebruiken, maar met een ander kleurtje, gaan we van de kleur een parameter maken.

Kleur

Een kleur bestaat uit 3 waarden, een waarde voor Red, Green en Blue (RGB). Zo u wilt kunt u er een 4de waarde aan toevoegen voor het Alpa-kanaal (transparentie).

We moeten dus 3 waarden kunnen invoeren en dit gebeurt via de Constant3Vector.

Klik met de rechtermuisknop in de Viewport en zoek naar Constant3Vector (druk op 3).

Dubbelklik op de aangemaakte node en gebruik de Color Picker om een witte kleur te selecteren. Klik op OK

Texture

Textures zijn afbeeldingen die gebruikt worden bij het aanmaken van materialen. Ze zijn de “tekening” van het materiaal. In ons voorbeeld wensen we als “tekening” een Grid.

Klik met de rechtermuisknop in de Viewport en zoek naar TextureSample.

Om een Texture toe te voegen klik u in Details-panel, terwijl Texture Sample geselecteerd is, onder Material Expression Texture Sample – Texture op het pijltje van de keuzelijst en zoekt u naar DefaultWhiteGrid. Vindt u dit niet meteen zorg dan dat onder de View Options een vinkje staat bij Show Engine Content.

Multiply

Deze twee nodes dien nu met mekaar gecombineerd te worden. Dit gebeurt via een Multiply-node.

Klik met de rechtermuisknop in de Viewport en zoek naar Multiply (druk op *).
Order de nodes zodat u ze gemakkelijk kunt verbinden.

Verbindt het witte bolletje van de Texture Sample met de A van Multiply. Verbindt de Constant3Vector met de B van Multiply. Verbindt de uitgang van Multiply met Base Color. U merkt dat de Preview nu effectief de preview toont (er is nu immers iets gewijzigd aan de Base Color.

Parameter

Omdat we dit eenvoudig materiaal willen hergebruiken, telkens met een andere kleur, maken we een parameter van de kleur. We noemen dit ook Instanced Material. Dit beantwoordt aan het programmeerprincipe DRY (Don’t Repeat Yourself).

Klik rechts op de Constant3Vector en klik op Convert to Parameter.

In het Details-panel kunt u nu een gewenste naam geven aan de parameter (bv. Kleur). Eventueel kunt u er ook nog de standaardwaarde (Default value) wijzigen.

Het materiaal is klaar, vergeet het niet te bewaren.

Klik op Save en sluit het venster.

Instanties (Instances) nemen van het basismateriaal

We gaan nu van het basismateriaal (Kleur_Basis) een Instanced Material maken met een andere kleur.

Klik met de rechtermuisknop op het basismateriaal (Kleur_Basis) en klik op Create Material Instance.

Geef het een passende naam (bv. Kleur_Bruin).
Dubbelklik de Material Instance om het te openen.
Merk dat u niet in de Designer komt maar in een scherm waar u de parameter Kleur kunt wijzigen.

Vink eerst de parameter kleur aan.
Gebruik de Color Picker om de gewenste kleur te selecteren. Klik op OK eens u die gevonden hebt.