Conceptos básicos de HoloLens (1.ª generación) 101E: proyecto completo con emulador

Importante

Los tutoriales de Mixed Reality Academy se diseñaron con HoloLens (1.ª generación), Unity 2017 y Mixed Reality cascos envolventes en mente. Por lo tanto, creemos que es importante conservar estos tutoriales para los desarrolladores que sigan buscando instrucciones sobre el desarrollo para esos dispositivos. Estos tutoriales no se actualizarán con los conjuntos de herramientas o interacciones más recientes que se usan para HoloLens 2 y es posible que no sean compatibles con las versiones más recientes de Unity. Se mantendrán para que sigan funcionando en los dispositivos compatibles. Se ha publicado una nueva serie de tutoriales para HoloLens 2.

Este tutorial le guiará a través de un proyecto completo, integrado en Unity, que muestra las características principales de Windows Mixed Reality en HoloLens, incluidos la mirada, los gestos, la entrada de voz, el sonido espacial y la asignación espacial. El tutorial tardará aproximadamente 1 hora en completarse.

Compatibilidad con dispositivos

Curso	HoloLens	Cascos envolventes
Aspectos básicos de realidad mixta (101E): Proyecto completo con emulador	✔️

Antes de empezar

Requisitos previos

• Un equipo con Windows 10 configurado con las herramientas correctas instaladas.

Archivos de proyecto

• Descargue los archivos necesarios para el proyecto. Requiere Unity 2017.2 o posterior.
  • Si todavía necesita compatibilidad con Unity 5.6, use esta versión.
  • Si todavía necesita compatibilidad con Unity 5.5, use esta versión.
  • Si todavía necesita compatibilidad con Unity 5.4, use esta versión.
• Desenarchive los archivos en el escritorio u otra ubicación fácil de llegar. Mantenga el nombre de la carpeta como Origami.

Nota

Si desea examinar el código fuente antes de descargarlo, está disponible en GitHub.

Capítulo 1: mundo "Holo"

En este capítulo, configuraremos nuestro primer proyecto de Unity y recorreremos el proceso de compilación e implementación.

Objetivos

• Configure Unity para el desarrollo holográfico.
• Cree un holograma.
• Vea un holograma que ha hecho.

Instrucciones

• Inicie Unity.
• Seleccione Open (Abrir).
• Escriba la ubicación como la carpeta Origami que desarchivó anteriormente.
• Seleccione Origami y haga clic en Seleccionar carpeta.
• Guarde la nueva escena: Guardar / escena como archivo.
• Asigne un nombre a la escena Origami y presione el botón Guardar .

Configurar la cámara principal

• En Hierarchy Panel (Panel de jerarquía), seleccione Main Camera (Cámara principal).
• En el Inspector , establezca su posición de transformación en 0,0,0.
• Busque la propiedad Clear Flags y cambie la lista desplegable de Skybox a Color sólido.
• Haga clic en el campo Background (Fondo) para abrir un selector de colores.
• Establezca R, G, B, and A (R, G, B y A) en 0.

Configuración de la escena

• En el Panel jerarquía, haga clic en Crear y crear vacío.
• Haga clic con el botón derecho en el nuevo GameObject y seleccione Cambiar nombre. Cambie el nombre de GameObject a OrigamiCollection.
• Desde la carpeta Hologramas en el Panel del proyecto:
  • Arrastre Stage a la jerarquía para que sea un elemento secundario de OrigamiCollection.
  • Arrastre Sphere1 a la jerarquía para que sea un elemento secundario de OrigamiCollection.
  • Arrastre Sphere2 a la jerarquía para que sea un elemento secundario de OrigamiCollection.
• Haga clic con el botón derecho en el objeto Directional Light en el Panel de jerarquía y seleccione Eliminar.
• En la carpeta Holograms , arrastre Lights a la raíz del Panel de jerarquía.
• En Hierarchy (Jerarquía), seleccione origamiCollection.
• En inspector, establezca la posición de transformación en 0, -0,5, 2,0.
• Presione el botón Reproducir en Unity para obtener una vista previa de los hologramas.
• Debería ver los objetos Origami en la ventana de vista previa.
• Presione Reproducir una segunda vez para detener el modo de vista previa.

Exportación del proyecto de Unity a Visual Studio

• En Unity, seleccione Configuración de compilación de archivos>.
• Seleccione Tienda Windows en la lista Plataforma y haga clic en Cambiar plataforma.
• Establezca SDK en Universal 10 y Tipo de compilación en D3D.
• Compruebe proyectos de C# de Unity.
• Haga clic en Agregar escenas abiertas para agregar la escena.
• Haga clic en Configuración del reproductor....
• En el Panel inspector, seleccione el logotipo de la Tienda Windows. A continuación, seleccione Configuración de publicación.
• En la sección Funcionalidades , seleccione las funcionalidades Micrófono y SpatialPerception .
• De nuevo en la ventana Configuración de compilación, haga clic en Compilar.
• Cree una nueva carpeta denominada "App".
• Haga clic en la carpeta de la aplicación.
• Presione Seleccionar carpeta.
• Cuando haya terminado Unity, aparecerá una ventana de Explorador de archivos.
• Abra la carpeta Aplicación .
• Abra la solución origami de Visual Studio.
• Con la barra de herramientas superior de Visual Studio, cambie el destino de Depurar a Release y de ARM a X86.
  • Haga clic en la flecha situada junto al botón Dispositivo y seleccione Emulador de HoloLens.
  • Haga clic en Depurar-> Iniciar sin depurar o presione Ctrl + F5.
  • Después de algún tiempo, el emulador comenzará con el proyecto Origami. Al iniciar el emulador por primera vez, el emulador puede tardar hasta 15 minutos en iniciarse. Una vez que se inicia, no lo cierre.

Capítulo 2: Mirada

En este capítulo, vamos a presentar las tres primeras formas de interactuar con los hologramas, la mirada.

Objetivos

• Visualice la mirada mediante un cursor bloqueado por el mundo.

Instrucciones

• Volver al proyecto de Unity y cierre la ventana Configuración de compilación si todavía está abierta.
• Seleccione la carpeta Holograms en el panel Proyecto.
• Arrastre el objeto Cursor al panel Hierarchy (Jerarquía ) en el nivel raíz.
• Haga doble clic en el objeto Cursor para echarle un vistazo más de cerca.
• Haga clic con el botón derecho en la carpeta Scripts del panel Proyecto.
• Haga clic en el submenú Crear .
• Seleccione Script de C#.
• Asigne al script el nombre WorldCursor. Nota: El nombre distingue mayúsculas de minúsculas. No es necesario agregar la extensión .cs.
• Seleccione el objeto Cursor en el panel Jerarquía.
• Arrastre y coloque el script WorldCursor en el panel Inspector.
• Haga doble clic en el script WorldCursor para abrirlo en Visual Studio.
• Copie y pegue este código en WorldCursor.cs y Guardar todo.

using UnityEngine;

public class WorldCursor : MonoBehaviour
{
    private MeshRenderer meshRenderer;

    // Use this for initialization
    void Start()
    {
        // Grab the mesh renderer that's on the same object as this script.
        meshRenderer = this.gameObject.GetComponentInChildren<MeshRenderer>();
    }

    // Update is called once per frame
    void Update()
    {
        // Do a raycast into the world based on the user's
        // head position and orientation.
        var headPosition = Camera.main.transform.position;
        var gazeDirection = Camera.main.transform.forward;

        RaycastHit hitInfo;

        if (Physics.Raycast(headPosition, gazeDirection, out hitInfo))
        {
            // If the raycast hit a hologram...
            // Display the cursor mesh.
            meshRenderer.enabled = true;

            // Move thecursor to the point where the raycast hit.
            this.transform.position = hitInfo.point;

            // Rotate the cursor to hug the surface of the hologram.
            this.transform.rotation = Quaternion.FromToRotation(Vector3.up, hitInfo.normal);
        }
        else
        {
            // If the raycast did not hit a hologram, hide the cursor mesh.
            meshRenderer.enabled = false;
        }
    }
}

• Vuelva a generar la aplicación a partir de la configuración de compilación de archivos>.
• Vuelva a la solución de Visual Studio usada anteriormente para implementar en el emulador.
• Seleccione "Volver a cargar todo" cuando se le solicite.
• Haga clic en Depurar-> Iniciar sin depurar o presione Ctrl + F5.
• Usa el mando de Xbox para mirar alrededor de la escena. Observe cómo interactúa el cursor con la forma de los objetos.

Capítulo 3: Gestos

En este capítulo, agregaremos compatibilidad con gestos. Cuando el usuario selecciona una esfera de papel, vamos a hacer que la esfera caiga activando la gravedad mediante el motor físico de Unity.

Objetivos

• Controlar los hologramas con el gesto Seleccionar.

Instrucciones

Empezaremos creando un script que pueda detectar el gesto Seleccionar.

• En la carpeta Scripts , cree un script denominado GazeGestureManager.
• Arrastre el script GazeGestureManager al objeto OrigamiCollection en la jerarquía.
• Abra el script GazeGestureManager en Visual Studio y agregue el código siguiente:

using UnityEngine;
using UnityEngine.XR.WSA.Input;

public class GazeGestureManager : MonoBehaviour
{
    public static GazeGestureManager Instance { get; private set; }

    // Represents the hologram that is currently being gazed at.
    public GameObject FocusedObject { get; private set; }

    GestureRecognizer recognizer;

    // Use this for initialization
    void Start()
    {
        Instance = this;

        // Set up a GestureRecognizer to detect Select gestures.
        recognizer = new GestureRecognizer();
        recognizer.Tapped += (args) =>
        {
            // Send an OnSelect message to the focused object and its ancestors.
            if (FocusedObject != null)
            {
                FocusedObject.SendMessageUpwards("OnSelect", SendMessageOptions.DontRequireReceiver);
            }
        };
        recognizer.StartCapturingGestures();
    }

    // Update is called once per frame
    void Update()
    {
        // Figure out which hologram is focused this frame.
        GameObject oldFocusObject = FocusedObject;

        // Do a raycast into the world based on the user's
        // head position and orientation.
        var headPosition = Camera.main.transform.position;
        var gazeDirection = Camera.main.transform.forward;

        RaycastHit hitInfo;
        if (Physics.Raycast(headPosition, gazeDirection, out hitInfo))
        {
            // If the raycast hit a hologram, use that as the focused object.
            FocusedObject = hitInfo.collider.gameObject;
        }
        else
        {
            // If the raycast did not hit a hologram, clear the focused object.
            FocusedObject = null;
        }

        // If the focused object changed this frame,
        // start detecting fresh gestures again.
        if (FocusedObject != oldFocusObject)
        {
            recognizer.CancelGestures();
            recognizer.StartCapturingGestures();
        }
    }
}

• Cree otro script en la carpeta Scripts, esta vez denominado SphereCommands.
• Expanda el objeto OrigamiCollection en la vista Jerarquía.
• Arrastre el script SphereCommands al objeto Sphere1 en el panel Jerarquía.
• Arrastre el script SphereCommands al objeto Sphere2 en el panel Jerarquía.
• Abra el script en Visual Studio para su edición y reemplace el código predeterminado por este:

using UnityEngine;

public class SphereCommands : MonoBehaviour
{
    // Called by GazeGestureManager when the user performs a Select gesture
    void OnSelect()
    {
        // If the sphere has no Rigidbody component, add one to enable physics.
        if (!this.GetComponent<Rigidbody>())
        {
            var rigidbody = this.gameObject.AddComponent<Rigidbody>();
            rigidbody.collisionDetectionMode = CollisionDetectionMode.Continuous;
        }
    }
}

• Exporte, compile e implemente la aplicación en el emulador de HoloLens.
• Mire alrededor de la escena y centre en una de las esferas.
• Presione el botón A en el mando de Xbox o presione la barra espaciadora para simular el gesto Seleccionar.

Capítulo 4: Voz

En este capítulo, agregaremos compatibilidad con dos comandos de voz: "Restablecer mundo" para devolver las esferas quitadas a su ubicación original y "Drop sphere" para hacer que la esfera caiga.

Objetivos

• Agregue comandos de voz que siempre escuchen en segundo plano.
• Cree un holograma que reaccione a un comando de voz.

Instrucciones

• En la carpeta Scripts , cree un script denominado SpeechManager.
• Arrastre el script SpeechManager al objeto OrigamiCollection en la jerarquía.
• Abra el script SpeechManager en Visual Studio.
• Copie y pegue este código en SpeechManager.cs y Guarde todo:

using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using UnityEngine.Windows.Speech;

public class SpeechManager : MonoBehaviour
{
    KeywordRecognizer keywordRecognizer = null;
    Dictionary<string, System.Action> keywords = new Dictionary<string, System.Action>();

    // Use this for initialization
    void Start()
    {
        keywords.Add("Reset world", () =>
        {
            // Call the OnReset method on every descendant object.
            this.BroadcastMessage("OnReset");
        });

        keywords.Add("Drop Sphere", () =>
        {
            var focusObject = GazeGestureManager.Instance.FocusedObject;
            if (focusObject != null)
            {
                // Call the OnDrop method on just the focused object.
                focusObject.SendMessage("OnDrop", SendMessageOptions.DontRequireReceiver);
            }
        });

        // Tell the KeywordRecognizer about our keywords.
        keywordRecognizer = new KeywordRecognizer(keywords.Keys.ToArray());

        // Register a callback for the KeywordRecognizer and start recognizing!
        keywordRecognizer.OnPhraseRecognized += KeywordRecognizer_OnPhraseRecognized;
        keywordRecognizer.Start();
    }

    private void KeywordRecognizer_OnPhraseRecognized(PhraseRecognizedEventArgs args)
    {
        System.Action keywordAction;
        if (keywords.TryGetValue(args.text, out keywordAction))
        {
            keywordAction.Invoke();
        }
    }
}

• Abra el script SphereCommands en Visual Studio.
• Actualice el script para leer de la siguiente manera:

using UnityEngine;

public class SphereCommands : MonoBehaviour
{
    Vector3 originalPosition;

    // Use this for initialization
    void Start()
    {
        // Grab the original local position of the sphere when the app starts.
        originalPosition = this.transform.localPosition;
    }

    // Called by GazeGestureManager when the user performs a Select gesture
    void OnSelect()
    {
        // If the sphere has no Rigidbody component, add one to enable physics.
        if (!this.GetComponent<Rigidbody>())
        {
            var rigidbody = this.gameObject.AddComponent<Rigidbody>();
            rigidbody.collisionDetectionMode = CollisionDetectionMode.Continuous;
        }
    }

    // Called by SpeechManager when the user says the "Reset world" command
    void OnReset()
    {
        // If the sphere has a Rigidbody component, remove it to disable physics.
        var rigidbody = this.GetComponent<Rigidbody>();
        if (rigidbody != null)
        {
            rigidbody.isKinematic = true;
            Destroy(rigidbody);
        }

        // Put the sphere back into its original local position.
        this.transform.localPosition = originalPosition;
    }

    // Called by SpeechManager when the user says the "Drop sphere" command
    void OnDrop()
    {
        // Just do the same logic as a Select gesture.
        OnSelect();
    }
}

• Exporte, compile e implemente la aplicación en el emulador de HoloLens.
• El emulador admitirá el micrófono del equipo y responderá a su voz: ajuste la vista para que el cursor esté en una de las esferas y diga "Drop Sphere".
• Diga "Restablecer mundo" para devolverlos a sus posiciones iniciales.

Capítulo 5: Sonido espacial

En este capítulo, agregaremos música a la aplicación y, a continuación, desencadenaremos efectos de sonido en determinadas acciones. Usaremos el sonido espacial para proporcionar sonidos a una ubicación específica en el espacio 3D.

Objetivos

• Escucha hologramas en tu mundo.

Instrucciones

• En unity, seleccione en el menú superior Editar > audio de configuración del > proyecto.
• Busque la configuración del complemento spatializador y seleccione Espacializador MS HRTF.
• Desde la carpeta Holograms , arrastre el objeto Ambiente al objeto OrigamiCollection en el Panel de jerarquía.
• Seleccione OrigamiCollection y busque el componente Origen de audio . Cambie estas propiedades:
  • Compruebe la propiedad Spatialize .
  • Comprueba la reproducción activa.
  • Cambie Spatial Blend a 3D arrastrando el control deslizante hasta la derecha.
  • Compruebe la propiedad Loop .
  • Expanda Configuración de sonido 3D y escriba 0.1 para Nivel de Sound.
  • Establezca Rolloff de volumen en Rolloff logarítmico.
  • Establezca Distancia máxima en 20.
• En la carpeta Scripts , cree un script denominado SphereSounds.
• Arrastre SphereSounds a los objetos Sphere1 y Sphere2 en la jerarquía.
• Abra SphereSounds en Visual Studio, actualice el código siguiente y Guarde todo.

using UnityEngine;

public class SphereSounds : MonoBehaviour
{
    AudioSource impactAudioSource = null;
    AudioSource rollingAudioSource = null;

    bool rolling = false;

    void Start()
    {
        // Add an AudioSource component and set up some defaults
        impactAudioSource = gameObject.AddComponent<AudioSource>();
        impactAudioSource.playOnAwake = false;
        impactAudioSource.spatialize = true;
        impactAudioSource.spatialBlend = 1.0f;
        impactAudioSource.dopplerLevel = 0.0f;
        impactAudioSource.rolloffMode = AudioRolloffMode.Logarithmic;
        impactAudioSource.maxDistance = 20f;

        rollingAudioSource = gameObject.AddComponent<AudioSource>();
        rollingAudioSource.playOnAwake = false;
        rollingAudioSource.spatialize = true;
        rollingAudioSource.spatialBlend = 1.0f;
        rollingAudioSource.dopplerLevel = 0.0f;
        rollingAudioSource.rolloffMode = AudioRolloffMode.Logarithmic;
        rollingAudioSource.maxDistance = 20f;
        rollingAudioSource.loop = true;

        // Load the Sphere sounds from the Resources folder
        impactAudioSource.clip = Resources.Load<AudioClip>("Impact");
        rollingAudioSource.clip = Resources.Load<AudioClip>("Rolling");
    }

    // Occurs when this object starts colliding with another object
    void OnCollisionEnter(Collision collision)
    {
        // Play an impact sound if the sphere impacts strongly enough.
        if (collision.relativeVelocity.magnitude >= 0.1f)
        {
            impactAudioSource.Play();
        }
    }

    // Occurs each frame that this object continues to collide with another object
    void OnCollisionStay(Collision collision)
    {
        Rigidbody rigid = gameObject.GetComponent<Rigidbody>();

        // Play a rolling sound if the sphere is rolling fast enough.
        if (!rolling && rigid.velocity.magnitude >= 0.01f)
        {
            rolling = true;
            rollingAudioSource.Play();
        }
        // Stop the rolling sound if rolling slows down.
        else if (rolling && rigid.velocity.magnitude < 0.01f)
        {
            rolling = false;
            rollingAudioSource.Stop();
        }
    }

    // Occurs when this object stops colliding with another object
    void OnCollisionExit(Collision collision)
    {
        // Stop the rolling sound if the object falls off and stops colliding.
        if (rolling)
        {
            rolling = false;
            impactAudioSource.Stop();
            rollingAudioSource.Stop();
        }
    }
}

• Guarde el script y vuelva a Unity.
• Exporte, compile e implemente la aplicación en el emulador de HoloLens.
• Usa auriculares para obtener el efecto completo y acercarse y más lejos del escenario para escuchar el cambio de sonidos.

Capítulo 6: Asignación espacial

Ahora vamos a usar la asignación espacial para colocar el tablero de juego en un objeto real en el mundo real.

Objetivos

• Trae tu mundo real al mundo virtual.
• Coloque los hologramas donde más le importan.

Instrucciones

• Haga clic en la carpeta Holograms en el panel Proyecto.
• Arrastre el recurso De asignación espacial a la raíz de la jerarquía.
• Haga clic en el objeto Spatial Mapping (Asignación espacial ) en hierarchy (Jerarquía).
• En el panel Inspector, cambie las siguientes propiedades:
  • Active la casilla Dibujar mallas visuales .
  • Busque Dibujar material y haga clic en el círculo de la derecha. Escriba "wireframe" en el campo de búsqueda de la parte superior. Haga clic en el resultado y cierre la ventana.
• Exporte, compile e implemente la aplicación en el emulador de HoloLens.
• Cuando se ejecuta la aplicación, se representará una malla de una sala de estar del mundo real previamente escaneada en wireframe.
• ¡Mira cómo una esfera rodante caerá fuera del escenario y en el suelo!

Ahora te mostraremos cómo mover origamiCollection a una nueva ubicación:

• En la carpeta Scripts , cree un script denominado TapToPlaceParent.
• En Hierarchy (Jerarquía), expanda OrigamiCollection y seleccione el objeto Stage .
• Arrastre el script TapToPlaceParent al objeto Stage.
• Abra el script TapToPlaceParent en Visual Studio y actualícelo para que sea el siguiente:

using UnityEngine;

public class TapToPlaceParent : MonoBehaviour
{
    bool placing = false;

    // Called by GazeGestureManager when the user performs a Select gesture
    void OnSelect()
    {
        // On each Select gesture, toggle whether the user is in placing mode.
        placing = !placing;

        // If the user is in placing mode, display the spatial mapping mesh.
        if (placing)
        {
            SpatialMapping.Instance.DrawVisualMeshes = true;
        }
        // If the user is not in placing mode, hide the spatial mapping mesh.
        else
        {
            SpatialMapping.Instance.DrawVisualMeshes = false;
        }
    }

    // Update is called once per frame
    void Update()
    {
        // If the user is in placing mode,
        // update the placement to match the user's gaze.

        if (placing)
        {
            // Do a raycast into the world that will only hit the Spatial Mapping mesh.
            var headPosition = Camera.main.transform.position;
            var gazeDirection = Camera.main.transform.forward;

            RaycastHit hitInfo;
            if (Physics.Raycast(headPosition, gazeDirection, out hitInfo,
                30.0f, SpatialMapping.PhysicsRaycastMask))
            {
                // Move this object's parent object to
                // where the raycast hit the Spatial Mapping mesh.
                this.transform.parent.position = hitInfo.point;

                // Rotate this object's parent object to face the user.
                Quaternion toQuat = Camera.main.transform.localRotation;
                toQuat.x = 0;
                toQuat.z = 0;
                this.transform.parent.rotation = toQuat;
            }
        }
    }
}

• Exporte, compile e implemente la aplicación.
• Ahora deberías poder colocar el juego en una ubicación específica mirando en ella, usando el gesto Seleccionar (A o barra espaciadora) y luego pasando a una nueva ubicación y usando el gesto Seleccionar de nuevo.

Fin

¡Y eso es el final de este tutorial!

Ha aprendido:

• Cómo crear una aplicación holográfica en Unity.
• Cómo usar la mirada, el gesto, la voz, los sonidos y la asignación espacial.
• Compilación e implementación de una aplicación mediante Visual Studio.

Ya está listo para empezar a crear sus propias aplicaciones holográficas.

Consulte también

• MR Basics 101: proyecto completo con dispositivo
• Gaze
• Mirada-cabeza y confirmación
• Entrada de voz
• Sonido espacial
• Asignación espacial