HoloLens (1ère génération) et Azure 312 : Intégration des bots

Dans ce cours, vous allez apprendre à créer et déployer un bot à l’aide du Microsoft Bot Framework V4 et à communiquer avec lui via une application Windows Mixed Reality.

Le Microsoft Bot Framework V4 est un ensemble d’API conçues pour fournir aux développeurs les outils nécessaires pour créer une application de bot extensible et évolutive. Pour plus d’informations, visitez la page Microsoft Bot Framework ou le référentiel Git V4.

Après avoir terminé ce cours, vous avez créé une application Windows Mixed Reality, qui est en mesure de :

1. Utilisez un mouvement d’appui pour démarrer le bot à l’écoute de la voix des utilisateurs.
2. Lorsque l’utilisateur a dit quelque chose, le bot tente de fournir une réponse.
3. Affichez les bots qui répondent sous forme de texte, positionnés près du bot, dans la scène Unity.

Dans votre application, c’est à vous de choisir la façon dont vous intégrez les résultats à votre conception. Ce cours est conçu pour vous apprendre à intégrer un service Azure à votre projet Unity. Il vous revient d’utiliser les connaissances que vous avez acquises dans ce cours pour améliorer votre application de réalité mixte.

Prise en charge des appareils

Conditions préalables

Nous vous recommandons d’utiliser le matériel et les logiciels suivants pour ce cours :

• Un PC de développement, compatible avec Windows Mixed Reality pour le développement de casque immersif (VR)
• Windows 10 Fall Creators Update (ou version ultérieure) avec le mode développeur activé
• Le dernier KIT de développement logiciel (SDK) Windows 10
• Unity 2017.4
• Visual Studio 2017
• Un casque Windows Mixed Reality immersif (VR) ou un Microsoft HoloLens avec le mode développeur activé
• Accès à Internet pour Azure et pour Azure récupération de bot. Pour plus d’informations, suivez ce lien.

Avant de commencer

1. Pour éviter les problèmes de génération liés aux chemins d’accès de dossiers longs avec ce projet, créez le projet de didacticiel dans un dossier racine ou proche de la racine.
2. Configurez et testez votre HoloLens. Si vous avez besoin d’aide pour configurer votre HoloLens, consultez l’article configuration d’HoloLens.
3. Il est judicieux d’effectuer l’étalonnage et le réglage des capteurs au début du développement d’une nouvelle application HoloLens (parfois, cela peut aider à effectuer ces tâches pour chaque utilisateur).

Pour obtenir de l’aide sur l’étalonnage, suivez ce lien vers l’article Étalonnage HoloLens.

Pour obtenir de l’aide sur le réglage des capteurs, suivez ce lien vers l’article Paramétrage du capteur HoloLens.

Chapitre 1 : Créer l’application bot

La première étape consiste à créer votre bot en tant qu’application web locale ASP.Net Core. Une fois que vous l’avez terminé et testé, publiez-le sur le portail Azure.

1. Ouvrez Visual Studio. Créez un projet, sélectionnez Application web ASP NET Core comme type de projet (recherchez-le sous-section .NET Core) et appelez-le MyBot. Cliquez sur OK.

2. Dans la fenêtre qui s’affiche, sélectionnez Vide. Vérifiez également que la cible est définie sur ASP NET Core 2.0 et que l’authentification est définie sur Aucune authentification. Cliquez sur OK.

   

3. La solution s’ouvre. Cliquez avec le bouton droit sur Solution Mybot dans le Explorateur de solutions, puis cliquez sur Gérer les packages NuGet pour la solution.

   

4. Sous l’onglet Parcourir , recherchez Microsoft.Bot.Builder.Integration.AspNet.Core (vérifiez que la préversion Inclure est cochée). Sélectionnez la version du package 4.0.1-preview, puis cochez les cases du projet. Cliquez ensuite sur Installer. Les bibliothèques sont installées pour Bot Framework v4. Fermez la page NuGet.

   

5. Cliquez avec le bouton droit sur votre projet, MyBot, dans le Explorateur de solutions, puis cliquez sur Ajouter une|classe.

   

6. Nommez la classe MyBot et cliquez sur Ajouter.

   

7. Répétez le point précédent pour créer une autre classe nommée ConversationContext.

8. Cliquez avec le bouton droit sur wwwroot dans le Explorateur de solutions, puis cliquez sur Ajouter un|nouvel élément. Sélectionnez Page HTML (recherchez-la sous-section Web). Nommez le fichier default.html. Cliquez sur Ajouter.

   

9. La liste des classes/objets dans le Explorateur de solutions doit ressembler à l’image :

   

10. Double-cliquez sur la classe ConversationContext . Cette classe est chargée de conserver les variables utilisées par le bot pour gérer le contexte de la conversation. Ces valeurs de contexte de conversation sont conservées dans un instance de cette classe, car toute instance de la classe MyBot est actualisée chaque fois qu’une activité est reçue. Ajoutez le code suivant à la classe :

    namespace MyBot
    {
        public static class ConversationContext
        {
            internal static string userName;
    
            internal static string userMsg;
        }
    }
    

11. Double-cliquez sur la classe MyBot . Cette classe héberge les gestionnaires appelés par toute activité entrante du client. Dans cette classe, vous ajoutez le code utilisé pour générer la conversation entre le bot et le client. Comme mentionné précédemment, une instance de cette classe est initialisée chaque fois qu’une activité est reçue. Ajoutez le code suivant à cette classe :

    using Microsoft.Bot;
    using Microsoft.Bot.Builder;
    using Microsoft.Bot.Schema;
    using System.Threading.Tasks;
    
    namespace MyBot
    {
        public class MyBot : IBot
        {       
            public async Task OnTurn(ITurnContext context)
            {
                ConversationContext.userMsg = context.Activity.Text;
    
                if (context.Activity.Type is ActivityTypes.Message)
                {
                    if (string.IsNullOrEmpty(ConversationContext.userName))
                    {
                        ConversationContext.userName = ConversationContext.userMsg;
                        await context.SendActivity($"Hello {ConversationContext.userName}. Looks like today it is going to rain. \nLuckily I have umbrellas and waterproof jackets to sell!");
                    }
                    else
                    {
                        if (ConversationContext.userMsg.Contains("how much"))
                        {
                            if (ConversationContext.userMsg.Contains("umbrella")) await context.SendActivity($"Umbrellas are $13.");
                            else if (ConversationContext.userMsg.Contains("jacket")) await context.SendActivity($"Waterproof jackets are $30.");
                            else await context.SendActivity($"Umbrellas are $13. \nWaterproof jackets are $30.");
                        }
                        else if (ConversationContext.userMsg.Contains("color") || ConversationContext.userMsg.Contains("colour"))
                        {
                            await context.SendActivity($"Umbrellas are black. \nWaterproof jackets are yellow.");
                        }
                        else
                        {
                            await context.SendActivity($"Sorry {ConversationContext.userName}. I did not understand the question");
                        }
                    }
                }
                else
                {
    
                    ConversationContext.userMsg = string.Empty;
                    ConversationContext.userName = string.Empty;
                    await context.SendActivity($"Welcome! \nI am the Weather Shop Bot \nWhat is your name?");
                }
    
            }
        }
    }
    

12. Double-cliquez sur la classe Startup . Cette classe initialise le bot. Ajoutez le code suivant à la classe :

    using Microsoft.AspNetCore.Builder;
    using Microsoft.AspNetCore.Hosting;
    using Microsoft.Bot.Builder.BotFramework;
    using Microsoft.Bot.Builder.Integration.AspNet.Core;
    using Microsoft.Extensions.Configuration;
    using Microsoft.Extensions.DependencyInjection;
    
    namespace MyBot
    {
    public class Startup
        {
            public IConfiguration Configuration { get; }
    
            public Startup(IHostingEnvironment env)
            {
                var builder = new ConfigurationBuilder()
                    .SetBasePath(env.ContentRootPath)
                    .AddJsonFile("appsettings.json", optional: true, reloadOnChange: true)
                    .AddJsonFile($"appsettings.{env.EnvironmentName}.json", optional: true)
                    .AddEnvironmentVariables();
                Configuration = builder.Build();
            }
    
            // This method gets called by the runtime. Use this method to add services to the container.
            public void ConfigureServices(IServiceCollection services)
            {
                services.AddSingleton(_ => Configuration);
                services.AddBot<MyBot>(options =>
                {
                    options.CredentialProvider = new ConfigurationCredentialProvider(Configuration);
                });
            }
    
            // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
            public void Configure(IApplicationBuilder app, IHostingEnvironment env)
            {
                if (env.IsDevelopment())
                {
                    app.UseDeveloperExceptionPage();
                }
    
                app.UseDefaultFiles();
                app.UseStaticFiles();
                app.UseBotFramework();
            }
        }
    }
    

13. Ouvrez le fichier de classe Program et vérifiez que le code qu’il contient est identique à ce qui suit :

    using Microsoft.AspNetCore;
    using Microsoft.AspNetCore.Hosting;
    
    namespace MyBot
    {
        public class Program
        {
            public static void Main(string[] args)
            {
                BuildWebHost(args).Run();
            }
    
            public static IWebHost BuildWebHost(string[] args) =>
                WebHost.CreateDefaultBuilder(args)
                    .UseStartup<Startup>()
                    .Build();
        }
    }
    

14. N’oubliez pas d’enregistrer vos modifications. Pour ce faire, accédez à Fichier>Enregistrer tout, à partir de la barre d’outils en haut de Visual Studio.

Chapitre 2 : Créer le Azure Bot Service

Maintenant que vous avez créé le code pour votre bot, vous devez le publier sur un instance du service Bot d’application web, sur le portail Azure. Ce chapitre vous montre comment créer et configurer le Bot Service sur Azure, puis y publier votre code.

1. Tout d’abord, connectez-vous au portail Azure (https://portal.azure.com).

   1. Si vous n’avez pas encore de compte Azure, vous devez en créer un. Si vous suivez ce tutoriel dans une situation de classe ou de laboratoire, demandez à votre instructeur ou à l’un des surveillants de vous aider à configurer votre nouveau compte.

2. Une fois connecté, cliquez sur Créer une ressource dans le coin supérieur gauche, recherchez Bot d’application web, puis cliquez sur Entrée.

   

3. La nouvelle page fournit une description du service Bot d’application web . En bas à gauche de cette page, sélectionnez le bouton Créer pour créer une association avec ce service.

   

4. Une fois que vous avez cliqué sur Créer :

   1. Insérez le nom souhaité pour cette instance de service.

   2. Sélectionnez un abonnement.

   3. Choisissez un groupe de ressources ou créez-en un. Un groupe de ressources permet de surveiller, de contrôler l’accès, de provisionner et de gérer la facturation d’une collection de ressources Azure. Il est recommandé de conserver tous les Azure Services associés à un seul projet (par exemple, ces cours) sous un groupe de ressources commun).

      Si vous souhaitez en savoir plus sur Azure groupes de ressources, suivez ce lien

   4. Déterminez l’emplacement de votre groupe de ressources (si vous créez un groupe de ressources). L’emplacement serait idéalement dans la région où l’application s’exécuterait. Certaines ressources Azure sont disponibles uniquement dans certaines régions.

   5. Sélectionnez le niveau tarifaire qui vous convient. Avec la première fois que vous créez un service Bot d’application web , un niveau gratuit (nommé F0) doit être disponible pour vous

   6. Le nom de l’application peut simplement être le même que le nom du bot.

   7. Laissez le modèle de bot sur De base (C#).

   8. Le plan/emplacement App Service doit être renseigné automatiquement pour votre compte.

   9. Définissez le stockage Azure que vous souhaitez utiliser pour héberger votre bot. Si vous n’en avez pas encore, vous pouvez le créer ici.

   10. Vous devez confirmer que vous avez bien compris les conditions générales appliquées à ce service.

   11. Cliquez sur Créer.

       

5. Une fois que vous avez cliqué sur Créer, attendez que le service soit créé, ce qui peut prendre une minute.

6. Une notification s’affiche dans le portail une fois le service instance créé.

   

7. Cliquez sur la notification pour explorer votre nouvelle instance de service.

   

8. Cliquez sur le bouton Accéder à la ressource dans la notification pour explorer votre nouveau service instance. vous êtes dirigé vers votre nouvelle instance de service Azure.

   

9. À ce stade, vous devez configurer une fonctionnalité appelée Direct Line pour permettre à votre application cliente de communiquer avec cette Bot Service. Cliquez sur Canaux, puis dans la section Ajouter un canal proposé, cliquez sur Configurer Direct Line canal.

   

10. Dans cette page, recherchez les clés secrètes qui permettent à votre application cliente de s’authentifier auprès du bot. Cliquez sur le bouton Afficher et prenez une copie de l’une des clés affichées, à utiliser ultérieurement dans votre projet.

    

Chapitre 3 : Publier le bot sur l’application web Azure Bot Service

Maintenant que votre service est prêt, vous devez publier le code de votre bot, que vous avez créé précédemment, sur votre Bot Service d’application web nouvellement créée.

1. Retour à votre solution Visual Studio que vous avez créée précédemment.

2. Cliquez avec le bouton droit sur votre projet MyBot, dans le Explorateur de solutions, puis cliquez sur Publier.

   

3. Dans la page Choisir une cible de publication, cliquez sur App Service, puis sélectionnez Existant, puis cliquez sur Créer un profil (vous devrez peut-être cliquer sur la flèche déroulante à côté du bouton Publier, s’il n’est pas visible).

   

4. Si vous n’êtes pas encore connecté à votre compte Microsoft, vous devez le faire ici.

5. Dans la page Publier , vous devez définir le même abonnement que celui que vous avez utilisé pour la création de Web App Bot Service. Ensuite, définissez l’affichage sur Groupe de ressources et, dans la structure de dossiers déroulante, sélectionnez le groupe de ressources que vous avez créé précédemment. Cliquez sur OK.

   

6. Cliquez maintenant sur le bouton Publier et attendez que le bot soit publié (cela peut prendre quelques minutes).

   

Chapitre 4 : Configurer le projet Unity

Les étapes suivantes sont une configuration classique pour le développement avec la réalité mixte. Par conséquent, il s’agit d’un bon modèle pour d’autres projets.

1. Ouvrez Unity , puis cliquez sur Nouveau.

   

2. Vous devez fournir un nom de projet Unity. Insérer un bot HoloLens. Vérifiez que le modèle de projet est défini sur 3D. Définissez l’Emplacement sur un emplacement qui vous convient (n’oubliez pas qu’il est préférable de se rapprocher des répertoires racines). Ensuite, cliquez sur Créer un projet.

   

3. Avec Unity ouvert, il est utile de vérifier que l’éditeur de script par défaut est défini sur Visual Studio. Accédez à Modifier les > préférences , puis, dans la nouvelle fenêtre, accédez à Outils externes. Remplacez Éditeur de script externe par Visual Studio 2017. Fermez la fenêtre Préférences .

   

4. Ensuite, accédez à > Paramètres de génération de fichiers et sélectionnez plateforme Windows universelle, puis cliquez sur le bouton Changer de plateforme pour appliquer votre sélection.

   

5. Toujours dans Paramètres de génération de fichier > et assurez-vous que :

   1. L’appareil cible est défini sur HoloLens

      Pour les casques immersifs, définissez Appareil cible sur N’importe quel appareil.

   2. Le type de build est défini sur D3D

   3. Le SDK est défini sur Dernière installation

   4. La version de Visual Studio est définie sur Dernière installation

   5. Générer et exécuter est défini sur Ordinateur local

   6. Enregistrez la scène et ajoutez-la à la build.

      1. Pour ce faire, sélectionnez Ajouter des scènes ouvertes. Une fenêtre d’enregistrement s’affiche.

         

      2. Créez un dossier pour cette scène et toute scène future, puis sélectionnez le bouton Nouveau dossier pour créer un dossier, nommez-le Scènes.

         

      3. Ouvrez le dossier Scenes que vous venez de créer, puis dans le champ de texte Nom de fichier : , tapez BotScene, puis cliquez sur Enregistrer.

         

   7. Les autres paramètres, dans Paramètres de build, doivent être conservés comme paramètres par défaut pour l’instant.

6. Dans la fenêtre Paramètres de build, cliquez sur le bouton Paramètres du lecteur. Le panneau associé s’ouvre dans l’espace où se trouve l’inspecteur.

   

7. Dans ce panneau, quelques paramètres doivent être vérifiés :

   1. Sous l’onglet Autres paramètres :

      1. La version du runtime de script doit être expérimentale (ÉQUIVALENT NET 4.6) ; cette modification nécessite un redémarrage de l’éditeur.

      2. Le serveur principal de script doit être .NET

      3. Le niveau de compatibilité de l’API doit être .NET 4.6

         

   2. Sous l’onglet Paramètres de publication, sous Fonctionnalités, case activée :

      • InternetClient

      • Microphone

        

   3. Plus bas dans le panneau, dans Paramètres XR (situés sous Paramètres de publication), cochez Réalité virtuelle prise en charge, vérifiez que le KIT de développement logiciel (SDK) Windows Mixed Reality est ajouté.

      

8. Retour dans Les paramètres de buildUnity C# Projects n’est plus grisé ; Cochez la case en regard de ceci.

9. Fermez la fenêtre Paramètres de build.

10. Enregistrez votre scène et votre projet (FILE > SAVE SCENE / FILE > SAVE PROJECT).

Chapitre 5 : Configuration de la caméra

1. Dans le panneau Hiérarchie, sélectionnez la caméra principale.

2. Une fois sélectionné, affichez tous les composants de la caméra principale dans le panneau Inspecteur.

   1. L’objet Camera doit être nommé Caméra principale (notez l’orthographe)
   2. La balise caméra principale doit être définie sur MainCamera (notez l’orthographe)
   3. Vérifiez que la position de transformation est définie sur 0, 0, 0
   4. Définissez Effacer les indicateurs sur Couleur unie.
   5. Définissez la couleur d’arrière-plan du composant Caméra sur Noir, Alpha 0 (Code hexadécimal : #000000000)

   

Chapitre 6 : Importer la bibliothèque Newtonsoft

Pour vous aider à désérialiser et sérialiser les objets reçus et envoyés au Bot Service vous devez télécharger la bibliothèque Newtonsoft. Vous trouverez une version compatible déjà organisée avec la structure de dossiers Unity correcte ici.

Pour importer la bibliothèque Newtonsoft dans votre projet, utilisez le package Unity fourni avec ce cours.

1. Ajoutez le .unitypackage à Unity à l’aide de l’option de menu Packagepersonnaliséd’importation>de> ressources.

   

2. Dans la zone Importer le package Unity qui s’affiche, vérifiez que tous les éléments sous (et y compris) Plug-ins sont sélectionnés.

   

3. Cliquez sur le bouton Importer pour ajouter les éléments à votre projet.

4. Accédez au dossier Newtonsoft sous Plug-ins dans la vue du projet, puis sélectionnez le plug-in Newtonsoft.

   

5. Avec le plug-in Newtonsoft sélectionné, vérifiez que n’importe quelle plateforme est décochée, vérifiez que WSAPlayer est également désactivé, puis cliquez sur Appliquer pour confirmer que les fichiers sont correctement configurés.

   

   Remarque

   Le marquage de ces plug-ins configure leur utilisation uniquement dans l’éditeur Unity. Il existe un ensemble différent d’entre eux dans le dossier WSA, qui sont utilisés après l’exportation du projet à partir d’Unity.

6. Ensuite, vous devez ouvrir le dossier WSA , dans le dossier Newtonsoft et rechercher une copie du fichier que vous avez configuré. Sélectionnez le fichier, puis dans l’inspecteur, vérifiez que

   • Toute plateforme est décochée
   • seulWSAPlayer est coché
   • L’option Ne pas traiter est cochée

   

Chapitre 7 : Créer le BotTag

1. Créez un objet Tag appelé BotTag. Sélectionnez l’appareil photo principal dans la scène. Cliquez sur le menu déroulant Étiquette dans le panneau Inspecteur. Cliquez sur Ajouter une balise.

   

2. Cliquez sur le + symbole. Nommez la nouvelle baliseBotTag, Enregistrer.

   

Chapitre 8 : Créer la classe BotObjects

Le premier script que vous devez créer est la classe BotObjects , qui est une classe vide créée afin qu’une série d’autres objets de classe puisse être stockée dans le même script et accessible par d’autres scripts de la scène.

La création de cette classe est un choix purement architectural. Ces objets peuvent être hébergés dans le script bot que vous créez plus tard dans ce cours.

Pour créer cette classe :

1. Cliquez avec le bouton droit dans le panneau Projet, puis sur Créer un > dossier. Nommez le dossier Scripts.

   

2. Double-cliquez sur le dossier Scripts pour l’ouvrir. Ensuite, dans ce dossier, cliquez avec le bouton droit, puis sélectionnez Créer un > script C#. Nommez le script BotObjects.

3. Double-cliquez sur le nouveau script BotObjects pour l’ouvrir avec Visual Studio.

4. Supprimez le contenu du script et remplacez-le par le code suivant :

   using System;
   using System.Collections;
   using System.Collections.Generic;
   using UnityEngine;
   
   public class BotObjects : MonoBehaviour{}
   
   /// <summary>
   /// Object received when first opening a conversation
   /// </summary>
   [Serializable]
   public class ConversationObject
   {
       public string ConversationId;
       public string token;
       public string expires_in;
       public string streamUrl;
       public string referenceGrammarId;
   }
   
   /// <summary>
   /// Object including all Activities
   /// </summary>
   [Serializable]
   public class ActivitiesRootObject
   {
       public List<Activity> activities { get; set; }
       public string watermark { get; set; }
   }
   [Serializable]
   public class Conversation
   {
       public string id { get; set; }
   }
   [Serializable]
   public class From
   {
       public string id { get; set; }
       public string name { get; set; }
   }
   [Serializable]
   public class Activity
   {
       public string type { get; set; }
       public string channelId { get; set; }
       public Conversation conversation { get; set; }
       public string id { get; set; }
       public From from { get; set; }
       public string text { get; set; }
       public string textFormat { get; set; }
       public DateTime timestamp { get; set; }
       public string serviceUrl { get; set; }
   }
   

5. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

Chapitre 9 : Créer la classe GazeInput

La classe suivante que vous allez créer est la classe GazeInput . Cette classe est responsable des opérations suivantes :

• Création d’un curseur qui représente le regard du joueur.
• Détection des objets frappés par le regard du joueur et conservation d’une référence aux objets détectés.

Pour créer cette classe :

1. Accédez au dossier Scripts que vous avez créé précédemment.

2. Cliquez avec le bouton droit dans le dossier Créer un > script C#. Appelez le script GazeInput.

3. Double-cliquez sur le nouveau script GazeInput pour l’ouvrir avec Visual Studio.

4. Insérez la ligne suivante en haut du nom de la classe :

   /// <summary>
   /// Class responsible for the User's gaze interactions
   /// </summary>
   [System.Serializable]
   public class GazeInput : MonoBehaviour
   

5. Ajoutez ensuite les variables suivantes dans la classe GazeInput , au-dessus de la méthode Start() :

       [Tooltip("Used to compare whether an object is to be interacted with.")]
       internal string InteractibleTag = "BotTag";
   
       /// <summary>
       /// Length of the gaze
       /// </summary>
       internal float GazeMaxDistance = 300;
   
       /// <summary>
       /// Object currently gazed
       /// </summary>
       internal GameObject FocusedObject { get; private set; }
   
       internal GameObject _oldFocusedObject { get; private set; }
   
       internal RaycastHit HitInfo { get; private set; }
   
       /// <summary>
       /// Cursor object visible in the scene
       /// </summary>
       internal GameObject Cursor { get; private set; }
   
       internal bool Hit { get; private set; }
   
       internal Vector3 Position { get; private set; }
   
       internal Vector3 Normal { get; private set; }
   
       private Vector3 _gazeOrigin;
   
       private Vector3 _gazeDirection;
   

6. Le code de la méthode Start() doit être ajouté et est appelé lorsque la classe initialise :

       /// <summary>
       /// Start method used upon initialization.
       /// </summary>
       internal virtual void Start()
       {
           FocusedObject = null;
           Cursor = CreateCursor();
       }
   

7. Implémentez une méthode qui instancie et configure le curseur du regard :

       /// <summary>
       /// Method to create a cursor object.
       /// </summary>
       internal GameObject CreateCursor()
       {
           GameObject newCursor = GameObject.CreatePrimitive(PrimitiveType.Sphere);
           newCursor.SetActive(false);
           // Remove the collider, so it does not block Raycast.
           Destroy(newCursor.GetComponent<SphereCollider>());
           newCursor.transform.localScale = new Vector3(0.05f, 0.05f, 0.05f);
           Material mat = new Material(Shader.Find("Diffuse"));
           newCursor.GetComponent<MeshRenderer>().material = mat;
           mat.color = Color.HSVToRGB(0.0223f, 0.7922f, 1.000f);
           newCursor.SetActive(true);
   
           return newCursor;
       }
   

8. Implémentez les méthodes qui configurent raycast à partir de la caméra principale et effectuez le suivi de l’objet ciblé actuel.

       /// <summary>
       /// Called every frame
       /// </summary>
       internal virtual void Update()
       {
           _gazeOrigin = Camera.main.transform.position;
   
           _gazeDirection = Camera.main.transform.forward;
   
           UpdateRaycast();
       }
   
   
       /// <summary>
       /// Reset the old focused object, stop the gaze timer, and send data if it
       /// is greater than one.
       /// </summary>
       private void ResetFocusedObject()
       {
           // Ensure the old focused object is not null.
           if (_oldFocusedObject != null)
           {
               if (_oldFocusedObject.CompareTag(InteractibleTag))
               {
                   // Provide the OnGazeExited event.
                   _oldFocusedObject.SendMessage("OnGazeExited", 
                       SendMessageOptions.DontRequireReceiver);
               }
           }
       }
   
   
       private void UpdateRaycast()
       {
           // Set the old focused gameobject.
           _oldFocusedObject = FocusedObject;
           RaycastHit hitInfo;
   
           // Initialize Raycasting.
           Hit = Physics.Raycast(_gazeOrigin,
               _gazeDirection,
               out hitInfo,
               GazeMaxDistance);
           HitInfo = hitInfo;
   
           // Check whether raycast has hit.
           if (Hit == true)
           {
               Position = hitInfo.point;
               Normal = hitInfo.normal;
   
               // Check whether the hit has a collider.
               if (hitInfo.collider != null)
               {
                   // Set the focused object with what the user just looked at.
                   FocusedObject = hitInfo.collider.gameObject;
               }
               else
               {
                   // Object looked on is not valid, set focused gameobject to null.
                   FocusedObject = null;
               }
           }
           else
           {
               // No object looked upon, set focused gameobject to null.
               FocusedObject = null;
   
               // Provide default position for cursor.
               Position = _gazeOrigin + (_gazeDirection * GazeMaxDistance);
   
               // Provide a default normal.
               Normal = _gazeDirection;
           }
   
           // Lerp the cursor to the given position, which helps to stabilize the gaze.
           Cursor.transform.position = Vector3.Lerp(Cursor.transform.position, Position, 0.6f);
   
           // Check whether the previous focused object is this same. If so, reset the focused object.
           if (FocusedObject != _oldFocusedObject)
           {
               ResetFocusedObject();
               if (FocusedObject != null)
               {
                   if (FocusedObject.CompareTag(InteractibleTag))
                   {
                       // Provide the OnGazeEntered event.
                       FocusedObject.SendMessage("OnGazeEntered",
                           SendMessageOptions.DontRequireReceiver);
                   }
               }
           }
       }
   

9. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

Chapitre 10 : Créer la classe Bot

Le script que vous allez créer maintenant s’appelle Bot et est la classe principale de votre application, il stocke :

• Informations d’identification de votre bot d’application web
• Méthode qui collecte les commandes vocales de l’utilisateur
• Méthode nécessaire pour lancer des conversations avec votre bot d’application web
• Méthode nécessaire pour envoyer des messages à votre bot d’application web

Pour envoyer des messages à l’Bot Service, la coroutine SendMessageToBot() génère une activité, qui est un objet reconnu par Bot Framework en tant que données envoyées par l’utilisateur.

Pour créer cette classe :

1. Double-cliquez sur le dossier Scripts pour l’ouvrir.

2. Cliquez avec le bouton droit dans le dossier Scripts , puis cliquez sur Créer un > script C#. Nommez le script Bot.

3. Double-cliquez sur le nouveau script pour l’ouvrir avec Visual Studio.

4. Mettez à jour les espaces de noms pour qu’ils soient identiques à ce qui suit, en haut de la classe Bot :

   using Newtonsoft.Json;
   using System.Collections;
   using System.Text;
   using UnityEngine;
   using UnityEngine.Networking;
   using UnityEngine.Windows.Speech;
   

5. Dans la classe Bot , ajoutez les variables suivantes :

       /// <summary>
       /// Static instance of this class
       /// </summary>
       public static Bot Instance;
   
       /// <summary>
       /// Material of the sphere representing the Bot in the scene
       /// </summary>
       internal Material botMaterial;
   
       /// <summary>
       /// Speech recognizer class reference, which will convert speech to text.
       /// </summary>
       private DictationRecognizer dictationRecognizer;
   
       /// <summary>
       /// Use this variable to identify the Bot Id
       /// Can be any value
       /// </summary>
       private string botId = "MRBotId";
   
       /// <summary>
       /// Use this variable to identify the Bot Name
       /// Can be any value
       /// </summary>
       private string botName = "MRBotName";
   
       /// <summary>
       /// The Bot Secret key found on the Web App Bot Service on the Azure Portal
       /// </summary>
       private string botSecret = "-- Add your Secret Key here --"; 
   
       /// <summary>
       /// Bot Endpoint, v4 Framework uses v3 endpoint at this point in time
       /// </summary>
       private string botEndpoint = "https://directline.botframework.com/v3/directline";
   
       /// <summary>
       /// The conversation object reference
       /// </summary>
       private ConversationObject conversation;
   
       /// <summary>
       /// Bot states to regulate the application flow
       /// </summary>
       internal enum BotState {ReadyToListen, Listening, Processing}
   
       /// <summary>
       /// Flag for the Bot state
       /// </summary>
       internal BotState botState;
   
       /// <summary>
       /// Flag for the conversation status
       /// </summary>
       internal bool conversationStarted = false;
   

   Remarque

   Veillez à insérer votre clé secrète bot dans la variable botSecret . Votre clé secrète de bot est abordée dans ce cours, au chapitre 2, étape 10.

6. Le code pour Awake() et Start() doit maintenant être ajouté.

       /// <summary>
       /// Called on Initialization
       /// </summary>
       void Awake()
       {
           Instance = this;
       }
   
       /// <summary>
       /// Called immediately after Awake method
       /// </summary>
       void Start()
       {
           botState = BotState.ReadyToListen;
       }
   

7. Ajoutez les deux gestionnaires appelés par les bibliothèques vocales lorsque la capture vocale commence et se termine. Le DictationRecognizer arrête automatiquement de capturer la voix de l’utilisateur lorsque celui-ci cesse de parler.

       /// <summary>
       /// Start microphone capture.
       /// </summary>
       public void StartCapturingAudio()
       {
           botState = BotState.Listening;
           botMaterial.color = Color.red;
   
           // Start dictation
           dictationRecognizer = new DictationRecognizer();
           dictationRecognizer.DictationResult += DictationRecognizer_DictationResult;
           dictationRecognizer.Start();
       }
   
   
       /// <summary>
       /// Stop microphone capture.
       /// </summary>
       public void StopCapturingAudio()
       {
           botState = BotState.Processing;
           dictationRecognizer.Stop();
       }
   
   

8. Le gestionnaire suivant collecte le résultat de l’entrée vocale de l’utilisateur et appelle la coroutine responsable de l’envoi du message à l’application web Bot Service.

       /// <summary>
       /// This handler is called every time the Dictation detects a pause in the speech. 
       /// </summary>
       private void DictationRecognizer_DictationResult(string text, ConfidenceLevel confidence)
       {
           // Update UI with dictation captured
           Debug.Log($"User just said: {text}");      
   
           // Send dictation to Bot
           StartCoroutine(SendMessageToBot(text, botId, botName, "message"));
           StopCapturingAudio();
       }     
   

9. La coroutine suivante est appelée pour commencer une conversation avec le bot. Une fois l’appel de conversation terminé, il appelle sendMessageToCoroutine() en transmettant une série de paramètres qui définit l’activité à envoyer au Bot Service sous la forme d’un message vide qui invite le Bot Service à lancer le dialogue.

       /// <summary>
       /// Request a conversation with the Bot Service
       /// </summary>
       internal IEnumerator StartConversation()
       {
           string conversationEndpoint = string.Format("{0}/conversations", botEndpoint);
   
           WWWForm webForm = new WWWForm();
   
           using (UnityWebRequest unityWebRequest = UnityWebRequest.Post(conversationEndpoint, webForm))
           {
               unityWebRequest.SetRequestHeader("Authorization", "Bearer " + botSecret);
               unityWebRequest.downloadHandler = new DownloadHandlerBuffer();
   
               yield return unityWebRequest.SendWebRequest();
               string jsonResponse = unityWebRequest.downloadHandler.text;
   
               conversation = new ConversationObject();
               conversation = JsonConvert.DeserializeObject<ConversationObject>(jsonResponse);
               Debug.Log($"Start Conversation - Id: {conversation.ConversationId}");
               conversationStarted = true; 
           }
   
           // The following call is necessary to create and inject an activity of type //"conversationUpdate" to request a first "introduction" from the Bot Service.
           StartCoroutine(SendMessageToBot("", botId, botName, "conversationUpdate"));
       }    
   

10. La coroutine suivante est appelée pour générer l’activité à envoyer au Bot Service.

        /// <summary>
        /// Send the user message to the Bot Service in form of activity
        /// and call for a response
        /// </summary>
        private IEnumerator SendMessageToBot(string message, string fromId, string fromName, string activityType)
        {
            Debug.Log($"SendMessageCoroutine: {conversation.ConversationId}, message: {message} from Id: {fromId} from name: {fromName}");
    
            // Create a new activity here
            Activity activity = new Activity();
            activity.from = new From();
            activity.conversation = new Conversation();
            activity.from.id = fromId;
            activity.from.name = fromName;
            activity.text = message;
            activity.type = activityType;
            activity.channelId = "DirectLineChannelId";
            activity.conversation.id = conversation.ConversationId;     
    
            // Serialize the activity
            string json = JsonConvert.SerializeObject(activity);
    
            string sendActivityEndpoint = string.Format("{0}/conversations/{1}/activities", botEndpoint, conversation.ConversationId);
    
            // Send the activity to the Bot
            using (UnityWebRequest www = new UnityWebRequest(sendActivityEndpoint, "POST"))
            {
                www.uploadHandler = new UploadHandlerRaw(Encoding.UTF8.GetBytes(json));
    
                www.downloadHandler = new DownloadHandlerBuffer();
                www.SetRequestHeader("Authorization", "Bearer " + botSecret);
                www.SetRequestHeader("Content-Type", "application/json");
    
                yield return www.SendWebRequest();
    
                // extrapolate the response Id used to keep track of the conversation
                string jsonResponse = www.downloadHandler.text;
                string cleanedJsonResponse = jsonResponse.Replace("\r\n", string.Empty);
                string responseConvId = cleanedJsonResponse.Substring(10, 30);
    
                // Request a response from the Bot Service
                StartCoroutine(GetResponseFromBot(activity));
            }
        }
    

11. La coroutine suivante est appelée pour demander une réponse après avoir envoyé une activité au Bot Service.

        /// <summary>
        /// Request a response from the Bot by using a previously sent activity
        /// </summary>
        private IEnumerator GetResponseFromBot(Activity activity)
        {
            string getActivityEndpoint = string.Format("{0}/conversations/{1}/activities", botEndpoint, conversation.ConversationId);
    
            using (UnityWebRequest unityWebRequest1 = UnityWebRequest.Get(getActivityEndpoint))
            {
                unityWebRequest1.downloadHandler = new DownloadHandlerBuffer();
                unityWebRequest1.SetRequestHeader("Authorization", "Bearer " + botSecret);
    
                yield return unityWebRequest1.SendWebRequest();
    
                string jsonResponse = unityWebRequest1.downloadHandler.text;
    
                ActivitiesRootObject root = new ActivitiesRootObject();
                root = JsonConvert.DeserializeObject<ActivitiesRootObject>(jsonResponse);
    
                foreach (var act in root.activities)
                {
                    Debug.Log($"Bot Response: {act.text}");
                    SetBotResponseText(act.text);
                }
    
                botState = BotState.ReadyToListen;
                botMaterial.color = Color.blue;
            }
        } 
    

12. La dernière méthode à ajouter à cette classe est nécessaire pour afficher le message dans la scène :

        /// <summary>
        /// Set the UI Response Text of the bot
        /// </summary>
        internal void SetBotResponseText(string responseString)
        {        
            SceneOrganiser.Instance.botResponseText.text =  responseString;
        }
    

    Remarque

    Vous pouvez voir une erreur dans la console de l’éditeur Unity, concernant l’absence de la classe SceneOrganiser . Ignorez ce message. Cette classe est créée plus loin dans le tutoriel.

13. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

Chapitre 11 : Créer la classe Interactions

La classe que vous allez créer est appelée Interactions. Cette classe est utilisée pour détecter l’entrée d’appui HoloLens de l’utilisateur.

Si l’utilisateur appuie en regardant l’objet Bot dans la scène et que le bot est prêt à écouter les entrées vocales, l’objet Bot passe en rouge et commence à écouter les entrées vocales.

Cette classe hérite de la classe GazeInput et peut donc référencer la méthode Start() et les variables de cette classe, indiquées par l’utilisation de base.

Pour créer cette classe :

1. Double-cliquez sur le dossier Scripts pour l’ouvrir.

2. Cliquez avec le bouton droit dans le dossier Scripts , puis cliquez sur Créer un > script C#. Nommez le script Interactions.

3. Double-cliquez sur le nouveau script pour l’ouvrir avec Visual Studio.

4. Mettez à jour les espaces de noms et l’héritage de classe pour qu’ils soient identiques à ce qui suit, en haut de la classe Interactions :

   using UnityEngine.XR.WSA.Input;
   
   public class Interactions : GazeInput
   {
   

5. Dans la classe Interactions, ajoutez la variable suivante :

       /// <summary>
       /// Allows input recognition with the HoloLens
       /// </summary>
       private GestureRecognizer _gestureRecognizer;
   

6. Ajoutez ensuite la méthode Start() :

       /// <summary>
       /// Called on initialization, after Awake
       /// </summary>
       internal override void Start()
       {
           base.Start();
   
           //Register the application to recognize HoloLens user inputs
           _gestureRecognizer = new GestureRecognizer();
           _gestureRecognizer.SetRecognizableGestures(GestureSettings.Tap);
           _gestureRecognizer.Tapped += GestureRecognizer_Tapped;
           _gestureRecognizer.StartCapturingGestures();
       }
   

7. Ajoutez le gestionnaire qui doit être déclenché lorsque l’utilisateur effectue le mouvement d’appui devant la caméra HoloLens

       /// <summary>
       /// Detects the User Tap Input
       /// </summary>
       private void GestureRecognizer_Tapped(TappedEventArgs obj)
       {
           // Ensure the bot is being gazed upon.
           if(base.FocusedObject != null)
           {
               // If the user is tapping on Bot and the Bot is ready to listen
               if (base.FocusedObject.name == "Bot" && Bot.Instance.botState == Bot.BotState.ReadyToListen)
               {
                   // If a conversation has not started yet, request one
                   if(Bot.Instance.conversationStarted)
                   {
                       Bot.Instance.SetBotResponseText("Listening...");
                       Bot.Instance.StartCapturingAudio();
                   }
                   else
                   {
                       Bot.Instance.SetBotResponseText("Requesting Conversation...");
                       StartCoroutine(Bot.Instance.StartConversation());
                   }                                  
               }
           }
       }
   

8. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

Chapitre 12 : Créer la classe SceneOrganiser

La dernière classe requise dans ce labo est appelée SceneOrganiser. Cette classe configure la scène par programmation, en ajoutant des composants et des scripts à la caméra principale et en créant les objets appropriés dans la scène.

Pour créer cette classe :

1. Double-cliquez sur le dossier Scripts pour l’ouvrir.

2. Cliquez avec le bouton droit dans le dossier Scripts , puis cliquez sur Créer un > script C#. Nommez le script SceneOrganiser.

3. Double-cliquez sur le nouveau script pour l’ouvrir avec Visual Studio.

4. Dans la classe SceneOrganiser, ajoutez les variables suivantes :

       /// <summary>
       /// Static instance of this class
       /// </summary>
       public static SceneOrganiser Instance;
   
       /// <summary>
       /// The 3D text representing the Bot response
       /// </summary>
       internal TextMesh botResponseText;
   

5. Ajoutez ensuite les méthodes Awake() et Start() :

       /// <summary>
       /// Called on Initialization
       /// </summary>
       private void Awake()
       {
           Instance = this;
       }
   
       /// <summary>
       /// Called immediately after Awake method
       /// </summary>
       void Start ()
       {
           // Add the GazeInput class to this object
           gameObject.AddComponent<GazeInput>();
   
           // Add the Interactions class to this object
           gameObject.AddComponent<Interactions>();
   
           // Create the Bot in the scene
           CreateBotInScene();
       }
   

6. Ajoutez la méthode suivante, chargée de créer l’objet Bot dans la scène et de configurer les paramètres et les composants :

       /// <summary>
       /// Create the Sign In button object in the scene
       /// and sets its properties
       /// </summary>
       private void CreateBotInScene()
       {
           GameObject botObjInScene = GameObject.CreatePrimitive(PrimitiveType.Sphere);
           botObjInScene.name = "Bot";
   
           // Add the Bot class to the Bot GameObject
           botObjInScene.AddComponent<Bot>();
   
           // Create the Bot UI
           botResponseText = CreateBotResponseText();
   
           // Set properties of Bot GameObject
           Bot.Instance.botMaterial = new Material(Shader.Find("Diffuse"));
           botObjInScene.GetComponent<Renderer>().material = Bot.Instance.botMaterial;
           Bot.Instance.botMaterial.color = Color.blue;
           botObjInScene.transform.position = new Vector3(0f, 2f, 10f);
           botObjInScene.tag = "BotTag";
       }
   

7. Ajoutez la méthode suivante, chargée de créer l’objet d’interface utilisateur dans la scène, représentant les réponses du bot :

       /// <summary>
       /// Spawns cursor for the Main Camera
       /// </summary>
       private TextMesh CreateBotResponseText()
       {
           // Create a sphere as new cursor
           GameObject textObject = new GameObject();
           textObject.transform.parent = Bot.Instance.transform;
           textObject.transform.localPosition = new Vector3(0,1,0);
   
           // Resize the new cursor
           textObject.transform.localScale = new Vector3(0.1f, 0.1f, 0.1f);
   
           // Creating the text of the Label
           TextMesh textMesh = textObject.AddComponent<TextMesh>();
           textMesh.anchor = TextAnchor.MiddleCenter;
           textMesh.alignment = TextAlignment.Center;
           textMesh.fontSize = 50;
           textMesh.text = "Hi there, tap on me and I will start listening.";
   
           return textMesh;
       }
   

8. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

9. Dans l’éditeur Unity, faites glisser le script SceneOrganiser du dossier Scripts vers la caméra principale. Le composant Organisateur de scène doit maintenant apparaître sur l’objet Caméra principale, comme illustré dans l’image.

   

Chapitre 13 – Avant la création

Pour effectuer un test approfondi de votre application, vous devez la charger sur votre HoloLens. Avant de le faire, assurez-vous que :

• Tous les paramètres mentionnés dans le chapitre 4 sont correctement définis.
• Le script SceneOrganiser est attaché à l’objet Main Camera .
• Dans la classe Bot , veillez à insérer votre clé secrète bot dans la variable botSecret .

Chapitre 14 : Générer et charger une version test sur HoloLens

Tout ce dont vous avez besoin pour la section Unity de ce projet étant terminé, il est temps de le générer à partir d’Unity.

1. Accédez à Paramètres de build, Paramètres de build de fichier > ....

2. Dans la fenêtre Paramètres de build, cliquez sur Générer.

   

3. Si ce n’est pas déjà fait, cochez Projets Unity C#.

4. Cliquez sur Générer. Unity lance une fenêtre Explorateur de fichiers, dans laquelle vous devez créer, puis sélectionner un dossier dans lequel générer l’application. Créez ce dossier maintenant et nommez-le Application. Ensuite, avec le dossier Application sélectionné, cliquez sur Sélectionner un dossier.

5. Unity commence à générer votre projet dans le dossier App .

6. Une fois la génération terminée (cela peut prendre un certain temps), Unity ouvre une fenêtre Explorateur de fichiers à l’emplacement de votre build (case activée votre barre des tâches, car elle peut ne pas toujours apparaître au-dessus de vos fenêtres, mais vous avertit de l’ajout d’une nouvelle fenêtre).

Chapitre 15 : Déployer sur HoloLens

Pour déployer sur HoloLens :

1. Vous avez besoin de l’adresse IP de votre HoloLens (pour le déploiement à distance) et de vous assurer que votre HoloLens est en mode développeur. Pour cela :

   1. Lorsque vous portez votre HoloLens, ouvrez les Paramètres.
   2. Accédez à Network & Internet > Wi-Fi > Advanced Options
   3. Notez l’adresse IPv4 .
   4. Ensuite, revenez à Paramètres, puis à Mettre à jour & Sécurité > pour les développeurs
   5. Définissez Mode développeur activé.

2. Accédez à votre nouvelle build Unity (le dossier App ) et ouvrez le fichier solution avec Visual Studio.

3. Dans Configuration de la solution , sélectionnez Déboguer.

4. Dans Plateforme de solution, sélectionnez x86, Ordinateur distant.

   

5. Accédez au menu Générer et cliquez sur Déployer la solution pour charger une version test de l’application sur votre HoloLens.

6. Votre application doit maintenant apparaître dans la liste des applications installées sur votre HoloLens, prête à être lancée !

   Remarque

   Pour effectuer un déploiement sur un casque immersif, définissez la plateforme de solution sur Ordinateur local et définissez la configuration sur Déboguer, avec x86 comme plateforme. Ensuite, déployez sur l’ordinateur local, à l’aide du menu Générer, en sélectionnant Déployer la solution.

Chapitre 16 : Utilisation de l’application sur HoloLens

• Une fois que vous avez lancé l’application, le bot apparaît sous la forme d’une sphère bleue devant vous.

• Utilisez le mouvement d’appui lorsque vous regardez la sphère pour lancer une conversation.

• Attendez que la conversation démarre (l’interface utilisateur affiche un message lorsqu’elle se produit). Une fois que vous avez reçu le message d’introduction du bot, appuyez à nouveau sur le bot afin qu’il devienne rouge et commence à écouter votre voix.

• Une fois que vous avez cessé de parler, votre application envoie votre message au bot et affiche une réponse dans l’interface utilisateur.

• Répétez le processus pour envoyer d’autres messages à votre bot (vous devez appuyer chaque fois que vous souhaitez envoyer un message).

Cette conversation montre comment le bot peut conserver des informations (votre nom), tout en fournissant des informations connues telles que des éléments stockés.

Quelques questions à poser au bot :

what do you sell? 

how much are umbrellas?

how much are raincoats?

Votre application Web App Bot (v4) terminée

Félicitations, vous avez créé une application de réalité mixte qui applique le bot d’application web Azure, Microsoft Bot Framework v4.

Exercices bonus

Exercice 1

La structure de conversation dans ce labo est de base. Utilisez Microsoft LUIS pour offrir à votre bot des fonctionnalités de compréhension du langage naturel.

Exercice 2

Cet exemple n’inclut pas la fin d’une conversation et le redémarrage d’une nouvelle conversation. Pour que la fonctionnalité bot soit complète, essayez d’implémenter la fermeture de la conversation.