Starten met programmeren van een 3D-omgeving in Unreal Engine – Prototyping (WhiteBoxing)

print
Deze handleiding maakt deel uit van het programmeertraject:


Inhoud


Wat vooraf ging


Gebruikte terminologie

Level

A Level is a user defined area of gameplay. Levels are created, viewed, and modified mainly by placing, transforming, and editing the properties of the Actors it contains. In the Unreal Editor, each Level is saved as a separate .umap file, which is also why you will sometimes see them referred to as Maps.

Geometry Brush Actors

Geometry Brushes are the most basic tool for level construction in Unreal. Conceptually, it is best to think of a Geometry Brush as filling in and carving out volumes of space in your level. In general, you can think of Geometry Brushes as a way to create basic shapes for use in your level design process, either as permanent fixtures or as something temporary to test with while your artists finish creating final meshes.

BSP

Binary Space Partitioning, or BSP for short, is a simple and quick way of laying out space in your level; defining what’s solid and what’s not. Designers place BSP Brushes to create Geometry which is what forms the foundation of a level.

Material

A Material is an asset that can be applied to a mesh to control the visual look of the scene. At a high level, it is probably easiest to think of a Material as the “paint” that is applied to an object. But even that can be a little misleading, since a Material literally defines the type of surface from which your object appears to be made. You can define its color, how shiny it is, whether you can see through the object, and much more.


Inleiding

In deze handleiding gaan we van start met de eerste fase, Prototyping, ook wel WhiteBoxing, GreyBoxing of Blockouts genoemd.

Gebruikmakend van basis geometrie (BSP) wordt “quick and dirty” de lay-out van het level vastgelegd in heel eenvoudige vormen, eventueel voorzien van een kleurcode (om gemakkelijker het onderscheid te maken tussen een muur, vloer,…). Maar… dit moet reeds speelbaar zijn omdat het ook gebruikt wordt om de basis gameplay uit te testen, of de lay-out bruikbaar is en of alles “werkt” (bv. de deur moet breed genoeg zijn om uw karakter door te laten). De collision (de plekken waar de actors en de karakters kunnen botsen, overlappen) wordt reeds vastgelegd.

Situering van deze handleiding binnen Unreal Engine


Werken met levels

Nieuw level toevoegen

  • Start een nieuw Third Desktop/Console project van Maximum Quality With Starters Content en geef het een passende naam.

Een 3D-project, een spel, kan uit meerdere levels bestaan. Maar voorlopig gaan we levels toevoegen om iets specifieks uit te testen.

  • Ga naar het menu FileNew Level….

  • Kies het template voor het nieuwe level (bv. Default).

Een default level komt reeds met een aantal standaard actors.

  • Klik op Play om het level op te starten.
  • In een Third Person-project ziet u uw karakter in een lege level.

Level bewaren

  • Om het level op te slaan klikt u ofwel op de knop Save Current (of u klikt op Ctrl-S of op FileSave Current).

  • Vervolgens bepaalt u waar het bestand moet worden opgeslagen (bv. de folder Maps) en geeft u het level een naam (bv. Test). Merk op dat er reeds 3 mappen beschikbaar zijn waaronder de map Minimal_Default, de map die u zag bij het opstarten.
  • Klik op Save.

Opslaan als

  • Wilt u de map opslaan onder een andere naam, met behoudt van de huidige, klik dan op FileSave Current As….

Level openen

Om een bestaande level te openen:

  • Klik u op FileOpen Level…, vervolgens selecteert u het gewenste level en kiest u voor Open.
  • Of zoek het gewenste level in de Content Browser in de folder Maps en dubbelklik het om het te openen.


Geometry Brush Actors

Geometry Brush actors (ook aangeduid met BSP) zijn basisvormen (rechthoeken, cilinders, kegels, trappen,…) die, in afwachting van de vervangende en meer gedetailleerde Static Mesh actors gebruikt worden om de lay-out en de gameplay van het level vast te leggen tijdens de prototyping/Whiteboxing fase (de zogenaamde Blocking Out Levels).

WhiteBoxing/Blocking Out Levels Afgewerkte level

Geometry Brush actors toevoegen aan het level

U vindt de Geometry Brush actors in de Place-mode onder Geometry.

  • Selecteer de gewenste Geometry en sleep het in het level op de gewenste plaats.
  • Zo heb ik hieronder een Box Geometry toegevoegd aan het level.

Deze Box is 2 meter (200 cm) breed bij 2 meter (200 cm) diep en 2 meter hoog (200 cm). U kunt dit aflezen, en wijzigen, in het Details-panel bij de Brush Settings.

Een eenheid UU = 1 cm.

  • x = lengte (diepte)
  • y = breedte
  • z = hoogte

Let op, bij deze getallen moeten we ook nog de schaling vermenigvuldigen.

  • Kopieer de Box (door in de Verplaatsingsmode de Alt-toetst in te drukken tijdens het verplaatsen (slepen)).
  • Schaal de Box naar 2.0 in de Z-as.

Merk op, het schalen is in beide richtingen van de Z-as gebeurt, dit in tegenstelling tot het schalen van een Static Mesh waar de schaling effectief in de Z-richting (naar boven dus) zou gebeurt zijn. Dit komt omdat het centrum van de widget (dat witte bolletje) zich bij een Brush niet aan de voet bevindt (zoals bij een Static Mesh) maar in het midden van de Brush. Het gevolg is dat een deel van onze tweede geschaalde Box zich “onder de vloer” bevindt. U moet de Box dus ook nog 100 (hoogte was 200, door een schaling van 2 is er dus 200 bijgekomen waarvan de helft naar beneden, vandaar de 100) naar boven verplaatsen op de Z-as.

  • Wijzig de Z-locatie naar 220 (de originele 120 (middelpunt van de originele box ) + 100 (helft van de schaling met 2 die onder de vloer verdwenen was)).

Als u nu even naar de Details kijkt dan ziet u dat de initiële waarden van 200, ondanks de schaling, niet gewijzigd zijn. Conclusie, u moet deze waarden dus steeds vermenigvuldigen met de schaling.

Texture uitlijning wijzigen na schaling

De Texture is de “bekleding”. Deze bekleding gebeurt met een materiaal (zie later).

Onze net toegevoegde geometrische brushes hebben nog geen texture en hebben in de plaats die grid van vierkantjes.

Als u nu let op onze tweede geschaalde box dat ziet u dat deze vierkantjes in de Z-richting uitgetrokken zijn (omdat we deze in de Z-richting geschaald hebben). Op zich is dit geen probleem, maar het is ook niet mooi, laten we dit dus wijzigen.

  • Selecteer een wand door erop te klikken.
  • Merk op dat u meer details krijgt, o.a. Surface properties. U ziet dat hier de Scale V op 2 staat. In een UV coördinaten stelsel is de U = horizontaal en de V = verticaal.

Op het ogenblik hebben we echter nog maar één vlak geselecteerd, eventuele wijzigingen zullen dus enkel op dit vlak (de geselecteerde wand) van toepassing zijn.

  • Klik op GeometrySelectSelect Matching Brush om de volledige brush te selecteren.

  • Wijzig onder Surface propertiesScale V de 2 naar 1 en klik op Apply.

Karakterafmetingen

De officiële standaardafmetingen voor een karakter in Unreal Engine zijn:

  • x = 60 cm/uu
  • y = 60 cm/uu
  • z = 180 cm/uu

Laten we dit eens bekijken

  • Plaats een nieuwe box met deze afmetingen.

  • Klik op Play om het level op te starten en de afmetingen te bekijken.

Uitsnijdingen

  • Voeg een nieuwe default level toe.
  • We maken een muur aan. Voeg een Geometrische Box (vanuit Place-mode) toe en geef hem de waarden:
    • x = 20
    • y = 1000
    • z = 220.
  • Plaats deze muur zodat hij mooi op de vloer past.
  • Voeg een tweede Geometrische Box toe maar vink nu, onderaan, Subtract aan.

  • We gebruiken deze box als deur en geven het waarden zodat een karakter er door kan en het diep genoeg is om door de muur te kunnen:
    • x = 40
    • y = 100
    • z = 200
  • Verplaats deze tweede box door de muur. Doordat de deur in Subtractieve mode staat wordt deze van de muur “afgetrokken”.

Tips

  • De volgorde is van belang, de brush die u Subtract moet als laatste aan het level worden toegevoegd.
  • Bent u tijdens het toevoegen vergeten Subtract aan te duiden dan kan dit nog steeds nadien in DetailsBrush SettingsBrush Type.

  • Een brush in subtractieve mode is feitelijk onzichtbaar in de Viewport, u kunt deze het best selecteren in de World Outline. Hoewel ik het hierboven niet gedaan heb is een gepaste naam geven aan te raden zodat u de vorm gemakkelijk terugvindt.
  • Wanneer u beide brushes op dezelfde hoogte zet (location Z = 120) zie je tijdens het spelen een kleine storing. Daarom heb ik de tweede brush, de deur, iets lager, op z = 119, geplaatst (zie afbeelding hierboven).
  • In bovenstaande schermafdruk heeft de deur nog steeds de naam Box Brush2. Dit is een weinig zeggende naam, laten we de deur de passende naam Deur geven.

Holle ruimte (kamer) maken

  • Voeg een nieuwe default level toe.
  • We maken een kamer aan. Voeg een Geometrische Box toe, geef het de naam Kamer en geef hem de waarden:
    • x = 500
    • y = 940
    • z = 400 (zodat we ons hoofd niet stoten als we in de kamer omhoog springen)
  • Plaats deze kamer zodat hij mooi binnen de vloer past. De X-location = 30, Y-location = 0, Z-location = 210 (in mijn voorbeeld).
  • Om de kamer, een holle ruimte, te maken vinkt u nu de optie Hollow aan. De dikte van de muur (Wall Thickness) kan je op 10 laten staan.

  • Voeg een tweede Geometrische Box toe maar vink nu, onderaan, Subtract aan.

  • We gebruiken deze box als deur en geven het waarden zodat een karakter er door kan en het diep genoeg is om door de muur te kunnen:
    • x = 40
    • y = 100
    • z = 200
  • Verplaats deze tweede box door de muur van de kamer. Doordat de deur in Subtractieve mode staat wordt deze van de muur “afgetrokken”.

  • Om de belichting, schaduwen in de kamer, goed aan te maken klikt u eerst op BuildBuild Lighting only (of klik gewoon op Build voor een volledige “build”).

  • Klik op Play om het level op te starten.

Eigen vormen maken

Unreal Engine komt met een aantal basis geometrische vormen (Box, Cone, Cilinder, Curverd stair, linear stair, spiral stair en sphere). Maak vaak zal u een meer specifieke vorm wensen.

Stel, u wenst een dak weer te geven op de kamer (die we hierboven aangemaakt hebben). Ok, u kunt er gewoon een Box op leggen en dit als dak beschouwen, of als u er een sprookjeskasteel van wilt maken kunt u er misschien een Cone op plaatsen. Maar u wilt het toch iets correcter doen en er op zijn minst iets op plaatsen dat lijkt op een dak en de vorm heeft van een dak, dit kan immers belangrijk zijn voor collision.

Er is geen dakvorm voor handen dus gaan we zelf zo’n vorm moeten ontwerpen.

  • We werken verder met het level dat de kamer bevat (zie hierboven).
  • We maken een dak aan. Voeg een Geometrische Box toe, geef het de naam Dak en geef hem de waarden:
    • x = 540
    • y = 1000
    • z = 260
  • Plaats dit zodat het mooi boven op de vloer past (plaats eerst het dak boven de kamer en druk op de End-toets om het dak op de kamer te laten “vallen”. De X-location = 30, Y-location = 0, Z-location = 540 (in mijn voorbeeld).

We moeten nu de Box-vorm van het dak aanpassen zodat het meer op een dak gaat gelijken.

  • Ga hiervoor naar Geomety Editing.

Om een dak te maken gaan we vanuit het midden van het dak de vorm moeten naar omlaag laten lopen, zodat we een helling creëren die vanuit het centrum start.

  • Om onze Box in twee te delen (zodat we een middelste bovenrand van het dak kunnen verkrijgen) selecteert u één van de lange bovenzijden en klikt u op Split. Dit selecteren van zo’n zijde vraagt grote nauwkeurigheid en kan misschien gemakkelijker in een Ortograpic View.

Merk op dat de box een bijkomende, middelste “zijde” gekregen heeft.

  • Selecteer de bovenste zijrand van de Box. We maken gebruik van de Widget om deze vorm aan te passen.
  • We gaan naar beneden slepen dus we selecteren de Z-as (de blauwe pijl die bij selectie geel wordt.

  • Sleep de bovenste zijrand van de Box naar omlaag.

  • Laat los eens u op de gewenste plek bent.

  • Herhaal dit proces voor de andere zijde.

Ons dak staat erop.

Wie meer wil weten over de verschillende mogelijkheden en opties voor het bewerken van geometrische brushes raad ik aan onderstaande video’s te bekijken.

Een samenvatting vindt u op de officiële wiki en in onderstaande video.


Prototyping/WhiteBoxing

De Whitebox-fase wordt gebruikt voor:

  • Het bepalen van lay-out van het level.
  • Prototyping.
  • Gameplaytesting van het level.
  • Schaal en proporties.

Dit gebeurt allemaal zonder in detail te gaan, met basisvormen, eventueel met wat kleuraccent maar meer niet. Het accent ligt meer op de vraag “Deze lay-out, werkt die, zijn er geen problemen (zijn alle deuren breed genoeg, kan ik overal op en door?), is het proportioneel correct en is de gameplay leuk?”.

Het nut en belang van deze fase wordt nog eens onderlijnd in onderstaande video.

Onderstaande video toont een paar aanpassingen die u kunt uitvoeren wanneer u start vanuit een Default Level.

Onderstaande video overloopt nog eens de voor- en nadelen van BSP brushes.


Praktische voorbeelden


Quixel Megascans

Onderstaande video toont het belang van de Concept-fase (de Fase 0 die nog voor de Prototyping komt).

In de Concept-fase vertrekt u van referentiemateriaal en zet u uw eigen ideeën op papier.


Project Level Creation – Whiteboxing

In ons doorlopend project beginnen we ook met Whiteboxing.

Geometry Layout

Eerst bouwen we de algemene lay-out (geometrie).

Adding Windows and doors

We gaan nu de geometrie “uitsnijden” met deuren en vensters.


In Game

In In Game toont een video hoe de besproken techniek in games gebruikt wordt.

Hieronder ziet u hoe WhiteBoxing de eerste stap is bij het bouwen van een ruimteschip in Star Citizen.


Quickshots

Quickshots (of Quicktips) zijn korte, op zichzelf staande video’s, rond een specifiek onderwerp. Meestal aansluitend bij wat net besproken is (en soms al een stapje vooruitlopend).

Quickly Add Mannequin Model to Projects for Scale Reference

How to Disable Auto Exposure (Eye Adaptation) From Your Scene

Modify and Save BSP Brush Pivot Points


Behandelde Basiscompetenties uit de module ICT Programmeren – Specifieke ontwikkelomgeving: eenvoudige functionaliteiten

  • IC BC017 – kan ICT veilig en duurzaam gebruiken
  • IC BC023 – kan ICT aanwenden om problemen op te lossen
  • IC BC247 – kan de bouwstenen van een specifieke ontwikkelomgeving gebruiken
  • IC BC248 – kan bouwstenen voor een specifieke ontwikkelomgeving maken
  • IC BC250 – kan bij het programmeren in functie van een specifieke ontwikkelomgeving, een juiste logica volgen
  • IC BC344 – kan oplossingen voor eenvoudige probleemstellingen bedenken

Geef een reactie

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

  • Abonneer je op deze website d.m.v. e-mail

    Voer je e-mailadres in om je in te schrijven op deze website en e-mailmeldingen te ontvangen van nieuwe berichten.