2. Inizializzazione del progetto e prima applicazione2. Initializing your project and first application

PanoramicaOverview

In questa prima esercitazione inizierai a creare una nuova applicazione Unreal per HoloLens 2.In this first tutorial, you'll get started with a new Unreal application for HoloLens 2. Eseguirai varie operazioni, come aggiungere il plug-in HoloLens, creare e illuminare un livello e popolarlo con una scacchiera e un pezzo degli scacchi.This is going to include adding the HoloLens plugin, creating and lighting a level, and populating it with a game board and chess piece. Non dovrai modellare nulla da zero perché userai asset predefiniti per il pezzo degli scacchi 3D e i materiali degli oggetti.You'll be using pre-made assets for the 3D chess piece and object materials, so don't worry about modeling anything from scratch. Al termine di questa esercitazione avrai un'area di disegno vuota pronta da configurare per la realtà mista.By the end of this tutorial you'll have a blank canvas that's ready for mixed reality.

Prima di proseguire, assicurati di disporre di tutti i prerequisiti indicati nella Guida introduttiva.Before continuing, make sure you have all the prerequisites from the Getting Started page.

ObiettiviObjectives

  • Configurazione di un progetto Unreal per lo sviluppo con HoloLensConfiguring an Unreal project for HoloLens development
  • Importazione di asset e configurazione di una scenaImporting assets and setting up a scene
  • Creazione di attori ed eventi a livello di script con progettiCreating Actors and script-level events with blueprints

Creazione di un nuovo progetto UnrealCreating a new Unreal project

Prima di tutto, è necessario un progetto su cui lavorare.The first thing you need is a project to work with. Se è la prima volta che crei un'app Unreal per HoloLens, dovrai scaricare i file di supporto dal launcher Epic.If this is your first time creating an Unreal app for HoloLens, you'll need to download supporting files from the Epic Launcher.

  1. Avvia Unreal EngineLaunch Unreal Engine

  2. Seleziona Games (Giochi) in New Project Categories (Categorie nuovo progetto) e fai clic su Next (Avanti).Select Games in New Project Categories and click Next.

Selezionare il modello di progetto Games (Giochi)

  1. Seleziona il modello Blank (Vuoto) e fai clic su Next (Avanti).Select the Blank Template and click Next.

Selezionare il modello vuoto

  1. Impostare C++ , Scalable 3D or 2D, Mobile/Tablet (3D o 2D scalabile, Cellulare/Tablet) e No Starter Content (Nessun contenuto iniziale) come Project Settings (Impostazioni progetto) e quindi scegliere un percorso di salvataggio e fare clic su Create Project (Crea progetto).Set C++, Scalable 3D or 2D, Mobile/Tablet, and No Starter Content as your Project Settings, then choose a save location and click Create Project.

Nota

Devi selezionare un progetto C++ anziché un progetto Blueprint per compilare il plug-in UX Tools, che verrà configurato più avanti nella sezione 4.You must select a C++ project rather than a Blueprint project in order to build the UX Tools plugin, which you'll be setting up later on in section 4.

Impostazioni iniziali del progetto

Il progetto dovrebbe aprirsi automaticamente nell'editor Unreal e a quel punto puoi passare alla sezione successiva.The project should open up automatically in the Unreal editor, which means you're ready for the next section.

Abilitazione dei plug-in necessariEnabling required plugins

Prima di iniziare ad aggiungere oggetti alla scena, è necessario abilitare due plug-in.Before you start adding objects to the scene you'll need to enable two plugins.

  1. Apri Edit > Plugins (Modifica > Plug-in) e seleziona Augmented Reality (Realtà aumentata) nell'elenco di opzioni predefinite.Open Edit > Plugins and select Augmented Reality from the built-in options list.
    • Scorri verso il basso fino a HoloLens e seleziona Enabled (Abilitato).Scroll down to HoloLens and check Enabled.

Abilitazione dei plug-in HoloLens

  1. Seleziona Virtual Reality (Realtà virtuale) nell'elenco di opzioni predefinite.Select Virtual Reality from the built-in options list.
    • Scorri verso il basso fino a Microsoft Windows Mixed Reality, seleziona Enabled (Abilitato) e riavvia l'editor.Scroll down to Microsoft Windows Mixed Reality, check Enabled, and restart your editor.

Abilitazione del plug-in Windows Mixed Reality

Nota

Per lo sviluppo di HoloLens 2 sono necessari entrambi i plug-in.Both plugins are required for HoloLens 2 development.

Terminata questa configurazione, puoi iniziare a creare altri livelli.With that done your empty level is ready for company.

Creazione di un livelloCreating a level

L'attività successiva consiste nel creare una semplice configurazione di gioco con un punto iniziale e un cubo per riferimento e scala.Your next task is to create a simple player setup with a starting point and a cube for reference and scale.

  1. Seleziona File > New Level (File > Nuovo livello) e scegli Empty Level (Livello vuoto).Select File > New Level and choose Empty Level. In questa fase, la scena predefinita nel riquadro di visualizzazione dovrebbe essere vuota.The default scene in the viewport should now be empty.

  2. Seleziona Basic (Base) nella scheda Modes (Modalità) e trascina PlayerStart nella scena.Select Basic from the Modes tab and drag PlayerStart into the scene.

    • Imposta Location (Posizione) su X = 0, Y = 0 e Z = 0 nella scheda Details (Dettagli). L'utente viene posizionato al centro della scena all'avvio dell'app.Set Location to X = 0, Y = 0, and Z = 0 in the Details tab. This sets the user at the center of the scene when the app starts up.

Riquadro di visualizzazione con PlayerStart

  1. Trascina un oggetto Cube (Cubo) dalla scheda Basic (Base) nella scena.Drag a Cube from the Basic tab into the scene.
    • Imposta Location (Posizione) su X = 50, Y = 0 e Z = 0.Set Location to X = 50, Y = 0, and Z = 0. Il cubo viene posizionato a 50 cm di distanza dal giocatore al momento dell'avvio.This positions the cube 50 cm away from the player at start time.
    • Imposta Scale (Scala) su X = 0.2, Y = 0.2 e Z = 0.2 per ridurre le dimensioni del cubo.Change Scale to X = 0.2, Y = 0.2, and Z = 0.2 to shrink the cube down.

Il cubo non sarà visibile finché non aggiungerai una luce alla scena, che è l'ultima attività da eseguire prima di testare la scena.You won’t be able to see the cube unless you add a light to your scene, which is your last task before testing the scene.

  1. Passa alla scheda Lights (Luci) nel pannello Modes (Modalità) e trascina un oggetto Directional Light (Luce direzionale) nella scena.Switch to the Lights tab in the Modes panel and drag a Directional Light into the scene. Posiziona la luce al di sopra di PlayerStart perché sia visibile.Position the light above PlayerStart so you can see it.

Riquadro di visualizzazione con aggiunta di luce

  1. Passa a File > Save Current (File > Salva corrente), assegna il nome Main (Principale) al livello e fai clic su Save (Salva).Go to File > Save Current, name your level Main, and click Save.

Una volta impostata la scena, seleziona Play (Riproduci) sulla barra degli strumenti per vedere il cubo in azione.With the scene set, press Play in the toolbar to see your cube in action! Quando avrai terminato di ammirare il tuo lavoro, premi ESC per arrestare l'applicazione.When you're finished admiring your work, press Esc to stop the application.

Un cubo nel riquadro di visualizzazione

Ora che la scena è configurata, puoi iniziare ad aggiungere la scacchiera e il pezzo per completare l'ambiente dell'applicazione.Now that the scene is setup, you can start adding in the chess board and piece to round out the application environment.

Importazione di assetImporting assets

Al momento la scena è un po' spoglia, ma puoi arricchirla importando asset predefiniti nel progetto.The scene is looking a bit empty at the moment, but you'll fix that by importing the ready-made assets into the project.

  1. Scaricare e decomprimere la cartella di asset GitHub con 7-zip.Download and unzip the GitHub assets folder using 7-zip.

  2. Fai clic su Add New > New Folder (Aggiungi nuovo > Nuova cartella) in Content Browser (Browser contenuto) e assegna il nome ChessAssets alla cartella.Click Add New > New Folder from the Content Browser and name it ChessAssets.

    • Fai doppio clic sulla nuova cartella, in cui importerai gli asset 3D.Double-click the new folder - this is where you'll import the 3D assets.

Visualizzare o nascondere il pannello delle origini

  1. Fai clic su Import (Importa) in Content Browser (Browser contenuto), seleziona tutti gli elementi nella cartella di asset decompressa e scegli Open (Apri).Click Import from the Content Browser, select all the items in the unzipped assets folder and click Open.

    • Questa cartella contiene le mesh degli oggetti 3D per la scacchiera e i pezzi in formato FBX e le mappe di texture in formato TGA che userai per i materiali.This folder contains the 3D object meshes for the chess board and pieces in FBX format and texture maps in TGA format that you'll use to for materials.
  2. Quando viene visualizzata la finestra FBX Import Options (Opzioni di importazione FBX), espandi la sezione Material (Materiale) e modifica Material Import Method (Metodo importazione materiale) in Do Not Create Material (Non creare materiale).When the FBX Import Options window pops up, expand the Material section and change Material Import Method to Do Not Create Material.

    • Fai clic su Import All (Importa tutto).Click Import All.

Opzioni importazione FBX

Non serve fare altro per gli asset.That's all you need to do for the assets. Il prossimo set di attività consiste nel creare i blocchi predefiniti dell'applicazione con i progetti.Your next set of tasks is to create the building blocks of the application with blueprints.

Aggiunta di progettiAdding blueprints

  1. Fare clic su Add New > New Folder (Aggiungi nuovo > Nuova cartella) in Content Browser (Browser contenuto) e assegnare alla cartella il nome Blueprints (Progetti).Click Add New > New Folder in the Content Browser and name it Blueprints.

Nota

I progetti sono asset speciali che forniscono un'interfaccia basata su nodi per la creazione di nuovi tipi di attori ed eventi a livello di script.If you're new to blueprints, they're special assets that provide a node-based interface for creating new types of Actors and script level events.

  1. Fai doppio clic nella cartella Blueprints (Progetti), quindi fai clic con il pulsante destro del mouse e scegli Blueprint Class (Classe progetto).Double-click into the Blueprints folder, then right-click and select Blueprint Class.
    • Seleziona Actor (Attore) e assegna al nuovo progetto il nome Board (Tavola).Select Actor and name the blueprint Board.

Selezionare una classe padre per il progetto

Il nuovo progetto Board (Tavola) verrà incluso nella cartella Blueprints (Progetti) mostrata nello screenshot seguente.The new Board blueprint now shows up in the Blueprints folder as seen in the following screenshot.

Nuovo progetto Board (Tavola)

È tutto pronto per iniziare ad aggiungere materiali agli oggetti creati.You're all set to start adding materials to the created objects.

Uso dei materialiWorking with materials

Gli oggetti che hai creato sono grigi per impostazione predefinita e questo non li rende particolarmente gradevoli dal punto di vista estetico.The objects you've created are default grey, which isn't much fun to look at. L'ultima serie di attività di questa esercitazione consiste appunto nell'aggiungere materiali e mesh agli oggetti.Adding materials and meshes to your objects is the last set of tasks in this tutorial.

  1. Fai doppio clic su Board (Tavola) per aprire l'editor dei progetti.Double-click Board to open the blueprint editor.

  2. Fai clic su Add Component > Scene (Aggiungi componente > Scena) nel pannello Components (Componenti) e assegna il nome Root (Radice) alla scena.Click Add Component > Scene from the Components panel and name it Root. Nota che Root (Radice) viene visualizzato come elemento figlio di DefaultSceneRoot nello screenshot seguente:Notice that Root shows up as a child of DefaultSceneRoot in the screenshot below:

Sostituzione della radice nel progetto

  1. Trascina Root (Radice) su DefaultSceneRoot per sostituire la radice ed eliminare la sfera nel viewport.Click-and-drag Root onto DefaultSceneRoot to replace it and get rid of the sphere in the viewport.

Sostituzione della radice

  1. Fai clic su Add Component > Static Mesh (Aggiungi componente > Mesh statica) nel pannello Components (Componenti) e assegna il nome SM_Board (MS_Tavola) alla mesh statica.Click Add Component > Static Mesh from the Components panel and name it SM_Board. Verrà visualizzata come oggetto figlio in Root (Radice).It will appear as a child object under Root.

Aggiunta di una mesh statica

  1. Fai clic su SM_Board (MS_Tavola), scorri verso il basso fino alla sezione Static Mesh (Mesh statica) del pannello Details (Dettagli) e quindi seleziona ChessBoard (Scacchiera) nell'elenco a discesa.Click SM_Board, scroll down to the Static Mesh section of the Details panel, and select ChessBoard from the dropdown.

Mesh Tavola nel riquadro di visualizzazione

  1. Sempre nel pannello Details (Dettagli) espandi la sezione Materials (Materiali) e fai clic su Create New Asset > Material (Crea nuovo asset > Materiale) nell'elenco a discesa.Still in the Details panel, expand the Materials section and click Create New Asset > Material from the dropdown.
    • Assegna a questo materiale il nome M_ChessBoard (M_Scacchiera) e salvalo nella cartella ChessAssets.Name the material M_ChessBoard and save it to the ChessAssets folder.

Creare un nuovo materiale

  1. Fai doppio clic sull'immagine del materiale M_ChessBoard (M_Scacchiera) per aprire l'editor dei materiali.Double-click the M_ChessBoard material imaged to open the Material Editor.

Aprire l'editor dei materiali

  1. Nell'editor dei materiali fai clic con il pulsante destro del mouse e cerca Texture Sample (Esempio di texture).In the Material Editor, right-click and search for Texture Sample.
    • Espandi la sezione Material Expression Texture Base (Espressione materiale - Base texture) nel pannello Details (Dettagli) e imposta Texture su ChessBoard_Albedo (Scacchiera_Albedo).Expand the Material Expression Texture Base section in the Details panel and set Texture to ChessBoard_Albedo.
    • Trascina il segnaposto di output RGB sul segnaposto Base Color (Colore di base) di M_ChessBoard (M_Scacchiera).Drag the RGB output pin to the Base Color pin of M_ChessBoard.

Impostare il colore di base

  1. Ripeti altre quattro volte il passaggio precedente per creare altri quattro nodi Texture Sample (Esempio di texture) con le impostazioni seguenti:Repeat the previous step four more times to create four more Texture Sample nodes with the following settings:
    • Imposta Texture su ChessBoard_AO (Scacchiera_OA) e collega RGB al segnaposto Ambient Occlusion (Occlusione ambiente).Set Texture to ChessBoard_AO and link the RGB to the Ambient Occlusion pin.
    • Imposta Texture su ChessBoard_Metal(Scacchiera_Metallo) e collega RGB al segnaposto Metallic (Metallico).Set Texture to ChessBoard_Metal and link the RGB to the Metallic pin.
    • Imposta Texture su ChessBoard_Normal (Scacchiera_Normale) e collega RGB al segnaposto Normal (Normale).Set Texture to ChessBoard_Normal and link the RGB to the Normal pin.
    • Imposta Texture su ChessBoard_Rough(Scacchiera_Ruvido) e collega RGB al segnaposto Roughness (Ruvidezza).Set Texture to ChessBoard_Rough and link the RGB to the Roughness pin.
    • Fare clic su Save.Click Save.

Associare le texture rimanenti

Prima di continuare, verifica che la configurazione del materiale corrisponda allo screenshot riportato sopra.Make sure the your material setup looks like the above screenshot before continuing.

Popolamento della scenaPopulating the scene

Se torni al progetto Board (Tavola), noterai che il materiale appena creato è stato applicato.If you go back to the Board blueprint, you'll see that the material you just created has been applied. A questo punto devi solo configurare la scena.All that's left is setting up the scene! Prima di tutto, modifica le proprietà seguenti per assicurarti che la scacchiera sia di dimensioni ragionevoli e disposta nella corretta angolazione quando viene inserita nella scena:First, change the following properties to make sure the board is a reasonable size and angled correctly when it's placed in the scene:

  1. Imposta Scale (Scala) su (0.05, 0.05, 0.05) e Z Rotation (Rotazione Z) su 90.Set Scale to (0.05, 0.05, 0.05) and Z Rotation to 90.
    • Fai clic su Compile (Compila) sulla barra degli strumenti in alto, quindi su Save (Salva) e torna alla finestra principale.Click Compile in the top toolbar, then Save and return to the Main window.

Scacchiera con materiale applicato

  1. Fai clic con il pulsante destro del mouse su Cube > Edit > Delete (Cubo > Modifica > Elimina) e trascina Board (Tavola) da Content Browser (Browser contenuto) nel viewport.Right-click Cube > Edit > Delete and drag Board from the Content Browser into the viewport.

    • Imposta Location (Posizione) su X = 80, Y = 0 e Z = 20.Set Location to X = 80, Y = 0, and Z = -20.
  2. Fai clic sul pulsante Play per visualizzare la nuova tavola nel livello.Click the Play button to view your new board in the level. Premi ESC per tornare all'editor.Press Esc to return to the editor.

A questo punto creerai un pezzo degli scacchi seguendo la stessa procedura usata per la scacchiera:Now you'll follow the same steps to create a chess piece as you did with the board:

  1. Passa alla cartella Blueprints (Progetti), fai clic con il pulsante destro del mouse e scegli Blueprint Class (Classe progetto) e Actor (Attore).Go to the Blueprints folder, right-click and select Blueprint Class and choose Actor. Assegna a questo attore il nome WhiteKing (Re bianco).Name the actor WhiteKing.

  2. Fai doppio clic su WhiteKing per aprirlo nell'editor progetti, fai clic su Add Component > Scene (Aggiungi componente > Scena) e assegna il nome Root (Radice) alla scena.Double click WhiteKing to open it in the Blueprint Editor, click Add Component > Scene and name it Root.

    • Trascina Root (Radice) su DefaultSceneRoot per sostituirla.Drag-and-drop Root onto DefaultSceneRoot to replace it.
  3. Fai clic su Add Component > Static Mesh (Aggiungi componente > Mesh statica) e assegna il nome SM_King (MS_Re) alla mesh.Click Add Component > Static Mesh and name it SM_King.

    • Nel pannello Details (Dettagli) imposta Static Mesh (Mesh statica) su Chess_King (Scacchi_Re) e Material (Materiale) su un nuovo materiale denominato M_ChessWhite (M_ScacchiBianco).Set Static Mesh to Chess_King and Material to a new Material called M_ChessWhite in the Details panel.
  4. Apri M_ChessWhite (M_ScacchiBianco) nell'editor dei materiali e associa i seguenti nodi Texture Sample (Esempio di texture) a quanto segue:Open M_ChessWhite in the Material editor and hook up the following Texture Sample nodes to the following:

    • Impostare Texture su ChessWhite_Albedo (ScacchiBianco_Albedo) e collegare RGB al segnaposto Base Color (Colore di base).Set Texture to ChessWhite_Albedo and link the RGB to the Base Color pin.
    • Imposta Texture su ChessWhite_AO (ScacchiBianco_OA) e collega RGB al segnaposto Ambient Occlusion (Occlusione ambiente).Set Texture to ChessWhite_AO and link the RGB to the Ambient Occlusion pin.
    • Imposta Texture su ChessWhite_Metal(ScacchiBianco_Metallo) e collega RGB al segnaposto Metallic (Metallico).Set Texture to ChessWhite_Metal and link the RGB to the Metallic pin.
    • Imposta Texture su ChessWhite_Normal (ScacchiBianco_Normale) e collega RGB al segnaposto Normal (Normale).Set Texture to ChessWhite_Normal and link the RGB to the Normal pin.
    • Imposta Texture su ChessWhite_Rough(ScacchiBianco_Ruvido) e collega RGB al segnaposto Roughness (Ruvidezza).Set Texture to ChessWhite_Rough and link the RGB to the Roughness pin.
    • Fare clic su Save.Click Save.

Prima di continuare, il materiale M_ChessKing (M_ScacchiRe) deve essere simile all'immagine seguente.Your M_ChessKing material should look like the following image before continuing.

Creare il materiale per il re degli scacchi

Hai quasi finito: ora basta aggiungere il nuovo pezzo degli scacchi alla scena:You're almost there, just need to add the new chess piece into the scene:

  1. Apri il progetto WhiteKing (ReBianco) e imposta Scale (Scala) su (0.05, 0.05, 0.05) e Z Rotation (Rotazione Z) su 90.Open the WhiteKing blueprint and change the Scale to (0.05, 0.05, 0.05) and Z Rotation to 90.

    • Compila e salva il progetto e quindi torna alla finestra principale.Compile and save your blueprint, then head back to the main window.
  2. Trascina WhiteKing (ReBianco) nel viewport, passa al pannello World Outliner (Delinatore mondo reale) e trascina WhiteKing (ReBianco) su Board (Tavola) per renderlo un oggetto figlio.Drag WhiteKing into the viewport, switch to the World Outliner panel drag WhiteKing onto Board to make it a child object.

Delineatore mondo reale

  1. Nel pannello Details (Dettagli) in Transform (Trasformazione) imposta Location (Posizione) di WhiteKing (ReBianco) su X = -26, Y = 4 e Z = 0.In the Details panel under Transform, set WhiteKing's Location to X = -26, Y = 4, and Z = 0.

Ecco fatto!That's a wrap! Fai clic su Play (Riproduci) per vedere in azione il livello popolato, quindi premi ESC quando vuoi uscire.Click Play to see your populated level in action, and press Esc when you're ready to exit. In questa esercitazione sono stati illustrati molti aspetti relativi alla creazione di un progetto semplice, ma il tuo progetto ora è pronto per passare alla parte successiva della serie, dedicata alla configurazione per la realtà mista.This tutorial covered a lot of ground creating a simple project, but your project is ready to move on to the next part of the series: setting up for mixed reality.

Sezione successiva: 3. Configurare il progetto per la realtà mistaNext Section: 3. Set up your project for mixed reality