Inizio Rapido

Benvenuto/a nel Wonderland Engine. Per favore, installa Wonderland Editor prima di proseguire con questo tutorial.

Crea un Progetto

Inserisci un nome a tuo piacere e crea il progetto tramite il “Project Wizard” che si avvia quando apri l’editor per la prima volta.

Scegli il template “VR”.

Ti verrà presentato un progetto base con la configurazione per il teletrasporto VR. Abbastanza noioso! Qui dovremmo aggiungere un asset.

In basso a sinistra trovi il “Asset Browser”. Mostra il contenuto della directory del progetto. Tutti gli asset del progetto devono essere posizionati in questa directory.

Esegui nel Browser

Per confezionare il progetto e visualizzarlo nel browser, clicca sulla freccia verde in alto alla finestra:

Ora, ogni volta che “confezioniamo” il progetto (cliccando sull’icona 🔨), il browser si ricaricherà automaticamente con i nostri cambiamenti.

Rimuovi Oggetti

Con il template VR, otteniamo alcune luci, oggetti e, cosa più importante: la configurazione del giocatore.

Non abbiamo bisogno di tutti gli oggetti. Eliminali selezionandoli con un clic sinistro del mouse e poi scegliendo “Elimina” con il tasto destro nel “Scene Outline”, oppure premendo il tasto “Canc”.

Elimina questi:

Cube
Sphere
Cone
Panel

Assicurati di tenere:

Player
Light
Light.000
3DCursorHitLeft / 3DCursorHitRight
TeleportIndicator

Modifica il Mesh di Navigazione

Il piano che abbiamo mantenuto ha un componente “collision” attaccato, che definisce la forma dell’oggetto per collisioni e ray casts.

In questo caso è usato per la navigazione del teletrasporto. Nel prossimo step, aggiungeremo una scena che ha già un pavimento, quindi rimuoveremo il mesh, ma conserveremo la collisione.

Clicca sul piano, quindi nei “Properties” clicca ⋮ (punti verticali) sul componente “mesh” e infine “Delete”:

Vedrai che le linee verdi per il componente collision sono mantenute, mentre il mesh per il rendering è scomparso. Nel browser, questa visualizzazione delle collisioni non appare di default.

Aggiungi un Asset

Crea una nuova cartella assets cliccando con il tasto destro sulla directory principale e selezionando “Nuova cartella”.

Scarica low_poly_winter_scene.zip ed estrai i file o trascinali nella nuova cartella del Asset Browser. Se usi WinRAR puoi anche trascinare e rilasciare i file direttamente da WinRAR.

Questa bellissima scena è stata creata da “EdwinRC” e può essere trovata su Sketchfab.

Per importare la scena, trascina e rilascia scene.gltf (non il scene.bin) nella “Scene View”. In alternativa, puoi trascinarla direttamente su un oggetto esistente nel “Scene Outline”.

Guarda Intorno

Per guardare intorno nella “Scene View”, tieni premuto il tasto destro del mouse mentre muovi il mouse. Usa i tasti W-A-S-D per muoverti avanti, sinistra, indietro e destra mantenendo premuto il tasto destro del mouse. Per aumentare la velocità, scroll sopra, mentre mantieni premuto il tasto destro del mouse.

Puoi anche tenere premuto il bottone centrale del mouse (tieni Alt su MacOS) per orbitare attorno alla scena.

Posiziona le Luci

Le luci ora sembrano fuori posto per questa nuova scena.

Per spostarle in un punto utile, seleziona una nel “Scene Outline” e usa le maniglie del “translation gizmo” per trascinare la luce nella scena 3D.

Se non hai le frecce per la traduzione, puoi cambiare tipo di gizmo usando i seguenti tasti:

G (“Grab”): gizmo di posizione
R (“Rotate”): gizmo di rotazione
S (“Scale”): gizmo di scala

Tocca due volte G per alternare la traduzione in spazio locale o globale.

Puoi anche usare la barra degli strumenti in alto nella Scene View:

Proprietà dei Componenti

L’oggetto “Light” emette luce perché ha un componente “light” attaccato. Puoi rendere la luce più luminosa riducendo la proprietà “intensity” del componente light:

Riepilogo

Anche se questa scena ha solo pochi oggetti, Wonderland Engine è ottimo nel rendering di molti diversi mesh. Vedi l’ Esempio di Ottimizzazione della Scena.

Puoi continuare aggiungendo comportamenti personalizzati con i tuoi componenti JavaScript.

Oppure potresti voler aggiungere il supporto per controller VR.