Mixed Reality Academy チュートリアルは、HoloLens (第1世代) と Mixed Reality イマーシブヘッドセットを念頭に置いて設計されています。The Mixed Reality Academy tutorials were designed with HoloLens (1st gen) and Mixed Reality Immersive Headsets in mind. そのため、これらのデバイスの開発に関するガイダンスをまだ探している開発者には、これらのチュートリアルを残しておくことが重要です。As such, we feel it is important to leave these tutorials in place for developers who are still looking for guidance in developing for those devices. これらのチュートリアルは いない 最新のツールセットや相互作用が使用されている HoloLens 2 で更新されます。These tutorials will not be updated with the latest toolsets or interactions being used for HoloLens 2. サポートされているデバイスでの作業を続行するために管理されます。They will be maintained to continue working on the supported devices. 今後、HoloLens 2 向けの開発方法を示す新しい一連のチュートリアルが掲載されています。There will be a new series of tutorials that will be posted in the future that will demonstrate how to develop for HoloLens 2. この通知は、これらのチュートリアルが投稿されたときのリンクと共に更新されます。This notice will be updated with a link to those tutorials when they are posted.

MR と Azure 302:コンピュータービジョンMR and Azure 302: Computer vision

このコースでは、混合現実アプリケーションで Azure Computer Vision 機能を使用して、提供されたイメージ内のビジュアルコンテンツを認識する方法を学習します。In this course, you will learn how to recognize visual content within a provided image, using Azure Computer Vision capabilities in a mixed reality application.

認識結果は、説明的なタグとして表示されます。Recognition results will be displayed as descriptive tags. このサービスは、機械学習モデルをトレーニングすることなく使用できます。You can use this service without needing to train a machine learning model. 実装に機械学習モデルのトレーニングが必要な場合は、「 MR」と「Azure 302b」を参照してください。If your implementation requires training a machine learning model, see MR and Azure 302b.


Microsoft Computer Vision は、開発者がクラウドから高度なアルゴリズムを使用して、イメージの処理と分析 (戻り情報を含む) を提供するように設計された Api のセットです。The Microsoft Computer Vision is a set of APIs designed to provide developers with image processing and analysis (with return information), using advanced algorithms, all from the cloud. 開発者がイメージまたはイメージの URL をアップロードすると、Microsoft Computer Vision API アルゴリズムによって、ユーザーが選択した入力に基づいてビジュアルコンテンツが分析されます。これにより、イメージの種類と品質の特定、人間の顔の検出 (座標を返します)、タグ付け、またはイメージの分類を行います。Developers upload an image or image URL, and the Microsoft Computer Vision API algorithms analyze the visual content, based upon inputs chosen the user, which then can return information, including, identifying the type and quality of an image, detect human faces (returning their coordinates), and tagging, or categorizing images. 詳細については、 Azure Computer Vision API のページを参照してください。For more information, visit the Azure Computer Vision API page.

このコースを完了すると、mixed reality HoloLens アプリケーションが完成します。これにより、次のことができるようになります。Having completed this course, you will have a mixed reality HoloLens application, which will be able to do the following:

  1. Tap ジェスチャを使用すると、HoloLens のカメラによってイメージがキャプチャされます。Using the Tap gesture, the camera of the HoloLens will capture an image.
  2. イメージは、Azure Computer Vision API サービスに送信されます。The image will be sent to the Azure Computer Vision API Service.
  3. 認識されたオブジェクトは、Unity シーンに配置された単純な UI グループに一覧表示されます。The objects recognized will be listed in a simple UI group positioned in the Unity Scene.

アプリケーションでは、結果をデザインと統合する方法については、お客様のニーズに合わせてください。In your application, it is up to you as to how you will integrate the results with your design. このコースは、Azure サービスを Unity プロジェクトと統合する方法を説明することを目的としています。This course is designed to teach you how to integrate an Azure Service with your Unity project. このコースで得られた知識を使用して、mixed reality アプリケーションを強化することができます。It is your job to use the knowledge you gain from this course to enhance your mixed reality application.

デバイスのサポートDevice support

までCourse HoloLensHoloLens イマーシブ ヘッドセットImmersive headsets
MR と Azure 302:コンピュータービジョンMR and Azure 302: Computer vision ✔️✔️ ✔️✔️


このコースでは主に HoloLens に焦点を当てていますが、このコースで学習する内容を Windows Mixed Reality イマーシブ (VR) ヘッドセットにも適用できます。While this course primarily focuses on HoloLens, you can also apply what you learn in this course to Windows Mixed Reality immersive (VR) headsets. イマーシブ (VR) ヘッドセットにはアクセス可能なカメラがないため、外部カメラが PC に接続されている必要があります。Because immersive (VR) headsets do not have accessible cameras, you will need an external camera connected to your PC. コースを進めると、イマーシブ (VR) ヘッドセットをサポートするために必要な変更についての注意事項が表示されます。As you follow along with the course, you will see notes on any changes you might need to employ to support immersive (VR) headsets.



このチュートリアルは、Unity とC#の基本的な経験を持つ開発者向けに設計されています。This tutorial is designed for developers who have basic experience with Unity and C#. また、このドキュメントに記載されている前提条件と記述に記載されている手順は、作成時にテストおよび検証されたものを表します (2018 年5月)。Please also be aware that the prerequisites and written instructions within this document represent what has been tested and verified at the time of writing (May 2018). ツールのインストール」の記事に記載されているように、最新のソフトウェアを自由に使用できます。ただし、このコースの情報は、以下に記載されているものよりも新しいソフトウェアで見つかったものと完全に一致するとは限りません。You are free to use the latest software, as listed within the install the tools article, though it should not be assumed that the information in this course will perfectly match what you'll find in newer software than what's listed below.

このコースでは、次のハードウェアとソフトウェアをお勧めします。We recommend the following hardware and software for this course:

開始前の準備Before you start

  1. このプロジェクトのビルドで問題が発生しないように、このチュートリアルで説明されているプロジェクトをルートまたはほぼルートフォルダーに作成することを強くお勧めします (長いフォルダーパスはビルド時に問題を引き起こす可能性があります)。To avoid encountering issues building this project, it is strongly suggested that you create the project mentioned in this tutorial in a root or near-root folder (long folder paths can cause issues at build-time).
  2. HoloLens をセットアップしてテストします。Set up and test your HoloLens. HoloLens のセットアップをサポートする必要がある場合は、 hololens セットアップに関する記事にアクセスしてください。If you need support setting up your HoloLens, make sure to visit the HoloLens setup article.
  3. 新しい HoloLens アプリの開発を開始するときは、調整とセンサーのチューニングを実行することをお勧めします (ユーザーごとにこれらのタスクを実行するのに役立つ場合があります)。It is a good idea to perform Calibration and Sensor Tuning when beginning developing a new HoloLens App (sometimes it can help to perform those tasks for each user).

調整の詳細については、 「HoloLens の調整に関する記事へのリンク」を参照してください。For help on Calibration, please follow this link to the HoloLens Calibration article.

センサーチューニングの詳細については、 HoloLens センサーチューニングに関する記事へのリンクを参照してください。For help on Sensor Tuning, please follow this link to the HoloLens Sensor Tuning article.

章 1-Azure PortalChapter 1 – The Azure Portal

Azure でComputer Vision APIサービスを使用するには、アプリケーションで使用できるようにサービスのインスタンスを構成する必要があります。To use the Computer Vision API service in Azure, you will need to configure an instance of the service to be made available to your application.

  1. まず、 Azure Portalにログインします。First, log in to the Azure Portal.


    まだ Azure アカウントを持っていない場合は、アカウントを作成する必要があります。If you do not already have an Azure account, you will need to create one. このチュートリアルを教室またはラボの状況で行っている場合は、新しいアカウントの設定について、インストラクターまたはそのいずれかの対処を依頼してください。If you are following this tutorial in a classroom or lab situation, ask your instructor or one of the proctors for help setting up your new account.

  2. ログインしたら、左上隅にある [新規] をクリックし、 Computer Vision APIを検索して、 Enter キーを押します。Once you are logged in, click on New in the top left corner, and search for Computer Vision API, and click Enter.

    Azure での新しいリソースの作成


    新しいポータルで、 Newという単語がリソースの作成に置き換えられました。The word New may have been replaced with Create a resource, in newer portals.

  3. 新しいページには、 Computer Vision APIサービスの説明が表示されます。The new page will provide a description of the Computer Vision API service. このページの左下にある [作成] ボタンを選択して、このサービスとの関連付けを作成します。At the bottom left of this page, select the Create button, to create an association with this service.

    コンピュータービジョン api サービスについて

  4. 作成:Once you have clicked on Create:

    1. このサービスインスタンスに必要な名前を挿入します。Insert your desired Name for this service instance.

    2. サブスクリプションを選択します。Select a Subscription.

    3. 適切な価格レベルを選択します。これがComputer Vision APIサービスを初めて作成する場合は、free レベル (F0) を使用できます。Select the Pricing Tier appropriate for you, if this is the first time creating a Computer Vision API Service, a free tier (named F0) should be available to you.

    4. リソースグループを選択するか、新しいリソースグループを作成します。Choose a Resource Group or create a new one. リソースグループは、Azure 資産のコレクションの課金を監視、制御する方法を提供します。A resource group provides a way to monitor, control access, provision and manage billing for a collection of Azure assets. 1つのプロジェクトに関連付けられているすべての Azure サービス (たとえば、これらのラボなど) を共通のリソースグループに保持することをお勧めします。It is recommended to keep all the Azure services associated with a single project (e.g. such as these labs) under a common resource group).

      Azure リソースグループの詳細については、リソースグループに関する記事をご覧ください。If you wish to read more about Azure Resource Groups, please visit the resource group article.

    5. リソースグループの場所を決定します (新しいリソースグループを作成している場合)。Determine the Location for your resource group (if you are creating a new Resource Group). この場所は、アプリケーションを実行するリージョンに配置するのが理想的です。The location would ideally be in the region where the application would run. 一部の Azure 資産は、特定のリージョンでのみ利用できます。Some Azure assets are only available in certain regions.

    6. また、このサービスに適用されている使用条件を理解していることを確認する必要があります。You will also need to confirm that you have understood the Terms and Conditions applied to this Service.

    7. [作成] をクリックします。Click Create.


  5. [作成] をクリックした後、サービスが作成されるまで待機する必要があります。これには1分かかることがあります。Once you have clicked on Create, you will have to wait for the service to be created, this might take a minute.

  6. サービスインスタンスが作成されると、ポータルに通知が表示されます。A notification will appear in the portal once the Service instance is created.


  7. 通知をクリックして、新しいサービスインスタンスを探索します。Click on the notification to explore your new Service instance.

    [リソースへの移行] ボタンを選択します。

  8. 通知の [リソースへのジャンプ] ボタンをクリックして、新しいサービスインスタンスを探索します。Click the Go to resource button in the notification to explore your new Service instance. 新しい Computer Vision API サービスインスタンスが表示されます。You will be taken to your new Computer Vision API service instance.

    新しい Computer Vision API サービス

  9. このチュートリアルでは、アプリケーションがサービスの呼び出しを行う必要があります。サービスは、サービスのサブスクリプションキーを使用して実行されます。Within this tutorial, your application will need to make calls to your service, which is done through using your service’s Subscription Key.

  10. Computer Vision APIサービスの [クイックスタート] ページで、最初の手順に移動し、キーをつかんで、 [キー] をクリックします (これは、[サービス] ナビゲーションメニューにある青いハイパーリンクキーをクリックして行うこともできます。キーアイコンで示されます)。From the Quick start page, of your Computer Vision API service, navigate to the first step, Grab your keys, and click Keys (you can also achieve this by clicking the blue hyperlink Keys, located in the services navigation menu, denoted by the key icon). これにより、サービスキーが表示されます。This will reveal your service Keys.

  11. 表示されているキーの1つをコピーします。これは、プロジェクトの後半で必要になります。Take a copy of one of the displayed keys, as you will need this later in your project.

  12. [クイックスタート] ページに戻り、そこからエンドポイントを取得します。Go back to the Quick start page, and from there, fetch your endpoint. お客様の地域によっては異なる場合があることに注意してください (その場合は、後でコードを変更する必要があります)。Be aware yours may be different, depending on your region (which if it is, you will need to make a change to your code later). 後で使用するために、このエンドポイントのコピーを取得します。Take a copy of this endpoint for use later:

    新しい Computer Vision API サービス


    ここでは、さまざまなエンドポイントを確認できます。You can check what the various endpoints are HERE.

第2章: Unity プロジェクトを設定するChapter 2 – Set up the Unity project

次に示すのは、mixed reality で開発するための一般的な設定です。そのため、他のプロジェクトに適したテンプレートです。The following is a typical set up for developing with mixed reality, and as such, is a good template for other projects.

  1. Unityを開き、 [新規] をクリックします。Open Unity and click New.

    新しい Unity プロジェクトを開始します。

  2. ここで、Unity プロジェクト名を指定する必要があります。You will now need to provide a Unity Project name. MR_ComputerVisionを挿入します。Insert MR_ComputerVision. プロジェクトの種類が3dに設定されていることを確認します。Make sure the project type is set to 3D. 場所を適切な場所に設定します (ルートディレクトリの方が適していることに注意してください)。Set the Location to somewhere appropriate for you (remember, closer to root directories is better). 次に、 [プロジェクトの作成] をクリックします。Then, click Create project.

    新しい Unity プロジェクトの詳細を指定します。

  3. 既定値を確認する必要が開いている Unity、 スクリプト エディター に設定されている Visual Studio します。With Unity open, it is worth checking the default Script Editor is set to Visual Studio. [> の設定の編集] に移動し、新しいウィンドウで [外部ツール] に移動します。Go to Edit > Preferences and then from the new window, navigate to External Tools. 変更 External Script EditorVisual Studio 2017 します。Change External Script Editor to Visual Studio 2017. [基本設定] ウィンドウを閉じます。Close the Preferences window.


  4. 次に、 [ファイル > ビルド設定] に移動し、 [ユニバーサル Windows プラットフォーム] を選択します。次に、 [プラットフォームの切り替え] ボタンをクリックして選択内容を適用します。Next, go to File > Build Settings and select Universal Windows Platform, then click on the Switch Platform button to apply your selection.

    [ビルドの設定] ウィンドウで、[プラットフォーム] を [UWP] に切り替えます。

  5. それでもファイル > ビルド設定を行い、次のことを確認します。While still in File > Build Settings and make sure that:

    1. ターゲットデバイスHoloLensに設定されていますTarget Device is set to HoloLens

      イマーシブヘッドセットの場合は、ターゲットデバイス任意のデバイスに設定します。For the immersive headsets, set Target Device to Any Device.

    2. ビルドの種類D3Dに設定されていますBuild Type is set to D3D

    3. SDKは最新のインストールに設定されていますSDK is set to Latest installed

    4. Visual Studio のバージョンが、インストールされている最新バージョンに設定されていますVisual Studio Version is set to Latest installed

    5. ビルドと実行ローカルコンピューターに設定されていますBuild and Run is set to Local Machine

    6. シーンを保存し、ビルドに追加します。Save the scene and add it to the build.

      1. これを行うには、[開いているシーンの追加] を選択します。Do this by selecting Add Open Scenes. 保存ウィンドウが表示されます。A save window will appear.

        [開いているシーンを追加] ボタンをクリックする

      2. この新しいフォルダーを作成し、今後のシーンに加えて、 [新しいフォルダー] ボタンを選択します。新しいフォルダーを作成するには、名前を「シーン」にします。Create a new folder for this, and any future, scene, then select the New folder button, to create a new folder, name it Scenes.


      3. 新しく作成した [シーン] フォルダーを開き、[ファイル名: テキスト] フィールドに「 MR_ComputerVisionScene」と入力し、 [保存] をクリックします。Open your newly created Scenes folder, and then in the File name: text field, type MR_ComputerVisionScene, then click Save.


        Unity プロジェクトに関連付けられている必要があるため、Unity のシーンをAssetsフォルダー内に保存する必要があります。Be aware, you must save your Unity scenes within the Assets folder, as they must be associated with the Unity Project. Unity プロジェクトを構成する一般的な方法は、シーンフォルダー (およびその他の同様のフォルダー) を作成することです。Creating the scenes folder (and other similar folders) is a typical way of structuring a Unity project.

    7. それ以外の設定は、[ビルド設定] の [既定] のままにしておきます。The remaining settings, in Build Settings, should be left as default for now.

  6. [ビルドの設定] ウィンドウで、 [プレーヤーの設定] ボタンをクリックします。これにより、インスペクターが配置されている領域の関連パネルが開きます。In the Build Settings window, click on the Player Settings button, this will open the related panel in the space where the Inspector is located.


  7. このパネルでは、いくつかの設定を確認する必要があります。In this panel, a few settings need to be verified:

    1. [その他の設定] タブで、次のようにします。In the Other Settings tab:

      1. スクリプトランタイムのバージョン安定している必要があります (.net 3.5 と同等)。Scripting Runtime Version should be Stable (.NET 3.5 Equivalent).

      2. バックエンド.netである必要がありますScripting Backend should be .NET

      3. API 互換性レベル.net 4.6である必要がありますAPI Compatibility Level should be .NET 4.6


    2. [発行の設定] タブの [機能] で、次の項目を確認します。Within the Publishing Settings tab, under Capabilities, check:

      1. InternetClientInternetClient

      2. カメラWebcam


    3. パネルの下にある [ XR settings (発行の設定] の下にあります) で、 [サポートされている仮想現実] をティックし、 Windows Mixed reality SDKが追加されていることを確認します。Further down the panel, in XR Settings (found below Publish Settings), tick Virtual Reality Supported, make sure the Windows Mixed Reality SDK is added.

      X R の設定を更新します。

  8. ビルド設定に戻る_Unity C#_ プロジェクトはグレーで表示されなくなりました。このの横にあるチェックボックスをオンにします。Back in Build Settings Unity C# Projects is no longer greyed out; tick the checkbox next to this.

  9. [ビルドの設定] ウィンドウを閉じます。Close the Build Settings window.

  10. シーンとプロジェクトを保存します ([ファイル] > [シーン/ファイルの保存] > [プロジェクトの保存])。Save your Scene and Project (FILE > SAVE SCENE / FILE > SAVE PROJECT).

第3章–メインカメラの設定Chapter 3 – Main Camera setup


このコースのUnity セットアップコンポーネントをスキップしてコードに直接進む場合は、 unitypackageをダウンロードし、カスタムパッケージとしてプロジェクトにインポートしてから、第5章から続行してください。If you wish to skip the Unity Set up component of this course, and continue straight into code, feel free to download this .unitypackage, import it into your project as a Custom Package, and then continue from Chapter 5.

  1. [階層] パネルで、メインカメラを選択します。In the Hierarchy Panel, select the Main Camera.

  2. 選択すると、メインカメラのすべてのコンポーネントが [インスペクター] パネルに表示されます。Once selected, you will be able to see all the components of the Main Camera in the Inspector Panel.

    1. カメラオブジェクトメインカメラという名前にする必要があります (スペルに注意してください)。The Camera object must be named Main Camera (note the spelling!)

    2. メインカメラのタグは、 maincameraに設定する必要があります (スペルに注意してください)。The Main Camera Tag must be set to MainCamera (note the spelling!)

    3. 変換位置0、0、0に設定されていることを確認します。Make sure the Transform Position is set to 0, 0, 0

    4. クリアフラグ純色に設定します (イマーシブヘッドセットの場合は無視します)。Set Clear Flags to Solid Color (ignore this for immersive headset).

    5. カメラコンポーネントの背景色を黒、アルファ 0 (16 進コード: #00000000) に設定します (イマーシブヘッドセットの場合は無視します)。Set the Background Color of the Camera Component to Black, Alpha 0 (Hex Code: #00000000) (ignore this for immersive headset).


  3. 次に、メインカメラに接続された単純な "Cursor" オブジェクトを作成する必要があります。これは、アプリケーションの実行時にイメージ分析出力を配置するのに役立ちます。Next, you will have to create a simple “Cursor” object attached to the Main Camera, which will help you position the image analysis output when the application is running. このカーソルによって、カメラフォーカスの中心点が決まります。This Cursor will determine the center point of the camera focus.

カーソルを作成するには、次のようにします。To create the Cursor:

  1. [階層] パネルで、メインカメラを右クリックします。In the Hierarchy Panel, right-click on the Main Camera. [3D オブジェクト] で、 [球] をクリックします。Under 3D Object, click on Sphere.

    Cursor オブジェクトを選択します。

  2. の名前をカーソルに変更します (カーソルオブジェクトをダブルクリックするか、オブジェクトが選択された状態で F2 キーを押します)。メインカメラの子として配置されていることを確認します。Rename the Sphere to Cursor (double click the Cursor object or press the ‘F2’ keyboard button with the object selected), and make sure it is located as child of the Main Camera.

  3. [階層] パネルで、カーソルを左クリックします。In the Hierarchy Panel, left click on the Cursor. カーソルを選択した状態で、[インスペクター] パネルで次の変数を調整します。With the Cursor selected, adjust the following variables in the Inspector Panel:

    1. 変換位置0、0、5に設定します。Set the Transform Position to 0, 0, 5

    2. スケール0.02、0.02、0.02に設定します。Set the Scale to 0.02, 0.02, 0.02


Chapter 4 –ラベルシステムのセットアップChapter 4 – Setup the Label system

HoloLens のカメラを使用してイメージをキャプチャすると、そのイメージが分析のためにAzure Computer Vision APIサービスインスタンスに送信されます。Once you have captured an image with the HoloLens’ camera, that image will be sent to your Azure Computer Vision API Service instance for analysis.

この分析の結果は、タグと呼ばれる認識されたオブジェクトの一覧になります。The results of that analysis will be a list of recognized objects called Tags.

これらのタグは、写真が撮影された場所に表示されるように、(ワールド空間の3D テキストとして) 使用します。You will use Labels (as a 3D text in world space) to display these Tags at the location the photo was taken.

次の手順では、 Labelオブジェクトを設定する方法について説明します。The following steps will show how to setup the Label object.

  1. [階層] パネル内の任意の場所を右クリックし (この時点では場所は関係ありません)、 [3D オブジェクト] の下に3d テキストを追加します。Right-click anywhere in the Hierarchy Panel (the location does not matter at this point), under 3D Object, add a 3D Text. Labeltextという名前を指定します。Name it LabelText.

    3D テキストオブジェクトを作成します。

  2. [階層] パネルで、 labeltextを左クリックします。In the Hierarchy Panel, left click on the LabelText. Labeltextを選択した状態で、[インスペクター] パネルで次の変数を調整します。With the LabelText selected, adjust the following variables in the Inspector Panel:

    1. 位置0、0、0に設定します。Set the Position to 0,0,0
    2. スケール0.01、0.01、0.01に設定します。Set the Scale to 0.01, 0.01, 0.01
    3. コンポーネントテキストメッシュで、次のようにします。In the component Text Mesh:
    4. テキスト内のすべてのテキストを "..." で置き換えます。Replace all the text within Text, with "..."
    5. アンカー中央中央に設定するSet the Anchor to Middle Center
    6. 配置中央に設定するSet the Alignment to Center
    7. タブサイズ4に設定します。Set the Tab Size to 4
    8. フォントサイズ50に設定します。Set the Font Size to 50
    9. #FFFFFFFFに設定しますSet the Color to #FFFFFFFF


  3. [プロジェクト] パネルの内の [階層] パネルから [アセット] フォルダーlabeltextをドラッグします。Drag the LabelText from the Hierarchy Panel, into the Asset Folder, within in the Project Panel. これにより、コードでインスタンス化できるようにLabeltextが事前 fab になります。This will make the LabelText a Prefab, so that it can be instantiated in code.

    LabelText オブジェクトの事前 fab を作成します。

  4. [階層] パネルからlabeltextを削除して、開いているシーンには表示されないようにする必要があります。You should delete the LabelText from the Hierarchy Panel, so that it will not be displayed in the opening scene. 現在は、Assets フォルダーから個々のインスタンスに対して呼び出す prefab であるため、シーン内に保持する必要はありません。As it is now a prefab, which you will call on for individual instances from your Assets folder, there is no need to keep it within the scene.

  5. 階層パネルの最終的なオブジェクト構造は、次の図に示すようになります。The final object structure in the Hierarchy Panel should be like the one shown in the image below:


第5章–生成されるのは、そのためのラベルクラスChapter 5 – Create the ResultsLabel class

作成する必要のある最初のスクリプトは、次の処理を行うための、次のような、べき条件のラベルクラスです。The first script you need to create is the ResultsLabel class, which is responsible for the following:

  • カメラの位置を基準にして、適切なワールド空間にラベルを作成します。Creating the Labels in the appropriate world space, relative to the position of the Camera.
  • イメージ Anaysis のタグを表示します。Displaying the Tags from the Image Anaysis.

このクラスを作成するには:To create this class:

  1. [プロジェクト] パネル内を右クリックし、 [> フォルダーの作成] をクリックします。Right-click in the Project Panel, then Create > Folder. フォルダーにスクリプトの名前を指定します。Name the folder Scripts.

    Scripts フォルダーを作成します。

  2. Scriptsフォルダー create を使用して、ダブルクリックして開きます。With the Scripts folder create, double click it to open. 次に、そのフォルダー内でを右クリックし、[作成] > [ C#スクリプト] の順に選択します。Then within that folder, right-click, and select Create > then C# Script. スクリプトのラベルに「」という名前を付けます。Name the script ResultsLabel.

  3. 新しいスクリプトラベルスクリプトをダブルクリックして、 Visual Studioで開きます。Double click on the new ResultsLabel script to open it with Visual Studio.

  4. クラス内で、次のコードを入力します。Inside the Class insert the following code in the ResultsLabel class:

        using System.Collections.Generic;
        using UnityEngine;
        public class ResultsLabel : MonoBehaviour
            public static ResultsLabel instance;
            public GameObject cursor;
            public Transform labelPrefab;
            public Transform lastLabelPlaced;
            public TextMesh lastLabelPlacedText;
            private void Awake()
                // allows this instance to behave like a singleton
                instance = this;
            /// <summary>
            /// Instantiate a Label in the appropriate location relative to the Main Camera.
            /// </summary>
            public void CreateLabel()
                lastLabelPlaced = Instantiate(labelPrefab, cursor.transform.position, transform.rotation);
                lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();
                // Change the text of the label to show that has been placed
                // The final text will be set at a later stage
                lastLabelPlacedText.text = "Analysing...";
            /// <summary>
            /// Set the Tags as Text of the last Label created. 
            /// </summary>
            public void SetTagsToLastLabel(Dictionary<string, float> tagsDictionary)
                lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();
                // At this point we go through all the tags received and set them as text of the label
                lastLabelPlacedText.text = "I see: \n";
                foreach (KeyValuePair<string, float> tag in tagsDictionary)
                    lastLabelPlacedText.text += tag.Key + ", Confidence: " + tag.Value.ToString("0.00 \n");
  5. Unityに戻る前に、変更内容をVisual Studioに保存してください。Be sure to save your changes in Visual Studio before returning to Unity.

  6. Unity エディターに戻り、スクリプト フォルダーの の履歴クラスをクリックして、階層 パネルメインカメラ オブジェクトにドラッグします。Back in the Unity Editor, click and drag the ResultsLabel class from the Scripts folder to the Main Camera object in the Hierarchy Panel.

  7. メインカメラをクリックし、[インスペクター] パネルを確認します。Click on the Main Camera and look at the Inspector Panel.

カメラにドラッグしたスクリプトから、次の2つのフィールドがあることがわかります。カーソルラベルの prefabYou will notice that from the script you just dragged into the Camera, there are two fields: Cursor and Label Prefab.

  1. 次の図に示すように、[階層] パネル から [ カーソル] というオブジェクトを [カーソル] という名前のスロットにドラッグします。Drag the object called Cursor from the Hierarchy Panel to the slot named Cursor, as shown in the image below.

  2. 次の図に示すように、[プロジェクト] パネルの [アセット] フォルダーからlabeltextという名前のオブジェクトをlabel prefabという名前のスロットにドラッグします。Drag the object called LabelText from the Assets Folder in the Project Panel to the slot named Label Prefab, as shown in the image below.

    Unity 内で参照ターゲットを設定します。

Chapter 6 – ImageCapture クラスを作成するChapter 6 – Create the ImageCapture class

次に作成するクラスは、 Imagecaptureクラスです。The next class you are going to create is the ImageCapture class. このクラスの役割は次のとおりです。This class is responsible for:

  • HoloLens カメラを使用してイメージをキャプチャし、アプリフォルダーに格納します。Capturing an Image using the HoloLens Camera and storing it in the App Folder.
  • ユーザーからタップジェスチャをキャプチャしています。Capturing Tap gestures from the user.

このクラスを作成するには:To create this class:

  1. 前に作成したScriptsフォルダーにアクセスします。Go to the Scripts folder you created previously.

  2. フォルダー内を右クリックし、 C# > スクリプトを作成します。Right-click inside the folder, Create > C# Script. スクリプトImagecaptureを呼び出します。Call the script ImageCapture.

  3. 新しいImagecaptureスクリプトをダブルクリックして、 Visual Studioで開きます。Double click on the new ImageCapture script to open it with Visual Studio.

  4. ファイルの先頭に次の名前空間を追加します。Add the following namespaces to the top of the file:

        using System.IO;
        using System.Linq;
        using UnityEngine;
        using UnityEngine.XR.WSA.Input;
        using UnityEngine.XR.WSA.WebCam;
  5. 次に、 Start () メソッドの上に、 imagecaptureクラス内に次の変数を追加します。Then add the following variables inside the ImageCapture class, above the Start() method:

        public static ImageCapture instance; 
        public int tapsCount;
        private PhotoCapture photoCaptureObject = null;
        private GestureRecognizer recognizer;
        private bool currentlyCapturing = false;

TapsCount変数には、ユーザーからキャプチャしたタップジェスチャの数が格納されます。The tapsCount variable will store the number of tap gestures captured from the user. この数値は、キャプチャしたイメージの名前付けに使用されます。This number is used in the naming of the images captured.

  1. 起動可能な () メソッドとStart () メソッドのコードを追加する必要があります。Code for Awake() and Start() methods now needs to be added. これらは、クラスの初期化時に呼び出されます。These will be called when the class initializes:

        private void Awake()
            // Allows this instance to behave like a singleton
            instance = this;
        void Start()
            // subscribing to the Hololens API gesture recognizer to track user gestures
            recognizer = new GestureRecognizer();
            recognizer.Tapped += TapHandler;
  2. Tap ジェスチャが発生したときに呼び出されるハンドラーを実装します。Implement a handler that will be called when a Tap gesture occurs.

        /// <summary>
        /// Respond to Tap Input.
        /// </summary>
        private void TapHandler(TappedEventArgs obj)
            // Only allow capturing, if not currently processing a request.
            if(currentlyCapturing == false)
                currentlyCapturing = true;
                // increment taps count, used to name images when saving
                // Create a label in world space using the ResultsLabel class
                // Begins the image capture and analysis procedure

TapHandler () メソッドは、ユーザーからキャプチャされたタップの数を増やし、現在のカーソル位置を使用して、新しいラベルを配置する場所を決定します。The TapHandler() method increments the number of taps captured from the user and uses the current Cursor position to determine where to position a new Label.

次に、このメソッドは、 Executeimagecapを Andanalysis () メソッドを呼び出して、このアプリケーションのコア機能を開始します。This method then calls the ExecuteImageCaptureAndAnalysis() method to begin the core functionality of this application.

  1. イメージをキャプチャして保存すると、次のハンドラーが呼び出されます。Once an Image has been captured and stored, the following handlers will be called. プロセスが成功した場合、結果は分析のために (まだ作成していない) VisionManagerに渡されます。If the process is successful, the result is passed to the VisionManager (which you are yet to create) for analysis.

        /// <summary>
        /// Register the full execution of the Photo Capture. If successful, it will begin 
        /// the Image Analysis process.
        /// </summary>
        void OnCapturedPhotoToDisk(PhotoCapture.PhotoCaptureResult result)
            // Call StopPhotoMode once the image has successfully captured
        void OnStoppedPhotoMode(PhotoCapture.PhotoCaptureResult result)
            // Dispose from the object in memory and request the image analysis 
            // to the VisionManager class
            photoCaptureObject = null;
  2. 次に、アプリケーションがイメージキャプチャプロセスを開始するために使用するメソッドを追加し、イメージを格納します。Then add the method that the application uses to start the Image capture process and store the image.

        /// <summary>    
        /// Begin process of Image Capturing and send To Azure     
        /// Computer Vision service.   
        /// </summary>    
        private void ExecuteImageCaptureAndAnalysis()  
            // Set the camera resolution to be the highest possible    
            Resolution cameraResolution = PhotoCapture.SupportedResolutions.OrderByDescending((res) => res.width * res.height).First();    
            Texture2D targetTexture = new Texture2D(cameraResolution.width, cameraResolution.height);
            // Begin capture process, set the image format    
            PhotoCapture.CreateAsync(false, delegate (PhotoCapture captureObject)    
                photoCaptureObject = captureObject;    
                CameraParameters camParameters = new CameraParameters();    
                camParameters.hologramOpacity = 0.0f;    
                camParameters.cameraResolutionWidth = targetTexture.width;    
                camParameters.cameraResolutionHeight = targetTexture.height;    
                camParameters.pixelFormat = CapturePixelFormat.BGRA32;
                // Capture the image from the camera and save it in the App internal folder    
                captureObject.StartPhotoModeAsync(camParameters, delegate (PhotoCapture.PhotoCaptureResult result)
                    string filename = string.Format(@"CapturedImage{0}.jpg", tapsCount);
                    string filePath = Path.Combine(Application.persistentDataPath, filename);
                    VisionManager.instance.imagePath = filePath;
                    photoCaptureObject.TakePhotoAsync(filePath, PhotoCaptureFileOutputFormat.JPG, OnCapturedPhotoToDisk);
                    currentlyCapturing = false;


この時点で、 Unity エディターのコンソールパネルにエラーが表示されます。At this point you will notice an error appearing in the Unity Editor Console Panel. これは、次の章で作成するVisionManagerクラスをコードが参照するためです。This is because the code references the VisionManager class which you will create in the next Chapter.

第7章-Azure への呼び出しとイメージ分析Chapter 7 – Call to Azure and Image Analysis

作成する必要がある最後のスクリプトは、 VisionManagerクラスです。The last script you need to create is the VisionManager class.

このクラスの役割は次のとおりです。This class is responsible for:

  • バイト配列としてキャプチャされた最新のイメージを読み込んでいます。Loading the latest image captured as an array of bytes.
  • 分析のために、バイト配列をAzure Computer Vision APIサービスインスタンスに送信しています。Sending the byte array to your Azure Computer Vision API Service instance for analysis.
  • JSON 文字列として応答を受信しています。Receiving the response as a JSON string.
  • 応答を逆シリアル化し、結果として得られるタグを結果のタグに渡します。Deserializing the response and passing the resulting Tags to the ResultsLabel class.

このクラスを作成するには:To create this class:

  1. [Scripts] フォルダーをダブルクリックして開きます。Double click on the Scripts folder, to open it.

  2. Scriptsフォルダー内を右クリックし、 [Create > C# Script] をクリックします。Right-click inside the Scripts folder, click Create > C# Script. スクリプトにVisionManagerという名前を指定します。Name the script VisionManager.

  3. 新しいスクリプトをダブルクリックして、Visual Studio で開きます。Double click on the new script to open it with Visual Studio.

  4. VisionManagerクラスの先頭にある次の名前空間を更新します。Update the namespaces to be the same as the following, at the top of the VisionManager class:

        using System;
        using System.Collections;
        using System.Collections.Generic;
        using System.IO;
        using UnityEngine;
        using UnityEngine.Networking;
  5. スクリプトの先頭にあるVisionManagerクラス( Start () メソッドの上) で、Azure からの逆シリアル化された JSON 応答を表す2つのクラスを作成する必要があります。At the top of your script, inside the VisionManager class (above the Start() method), you now need to create two Classes that will represent the deserialized JSON response from Azure:

        public class TagData
            public string name;
            public float confidence;
        public class AnalysedObject
            public TagData[] tags;
            public string requestId;
            public object metadata;


    Tagdataクラスと Analytics sedobjectクラスでは、Unity ライブラリを使用して逆シリアル化できるようにする前に、 [system.string] 属性を追加する必要があります。The TagData and AnalysedObject classes need to have the [System.Serializable] attribute added before the declaration to be able to be deserialized with the Unity libraries.

  6. VisionManager クラスでは、次の変数を追加する必要があります。In the VisionManager class, you should add the following variables:

        public static VisionManager instance;
        // you must insert your service key here!    
        private string authorizationKey = "- Insert your key here -";    
        private const string ocpApimSubscriptionKeyHeader = "Ocp-Apim-Subscription-Key";
        private string visionAnalysisEndpoint = "https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags";   // This is where you need to update your endpoint, if you set your location to something other than west-us.
        internal byte[] imageBytes;
        internal string imagePath;


    認証キーauthorizationkey変数に挿入されていることを確認します。Make sure you insert your Auth Key into the authorizationKey variable. 認証キーについては、このコースの第1章で説明しました。You will have noted your Auth Key at the beginning of this course, Chapter 1.


    VisionAnalysisEndpoint変数は、この例で指定したものとは異なる場合があります。The visionAnalysisEndpoint variable might differ from the one specified in this example. 米国西部は、米国西部リージョン用に作成されたサービスインスタンスを厳密に参照します。The west-us strictly refers to Service instances created for the West US region. これをエンドポイント URLで更新します。次に例をいくつか示します。Update this with your endpoint URL; here are some examples of what that might look like:

    • 西ヨーロッパ:https://westeurope.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=TagsWest Europe: https://westeurope.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
    • 東南アジア:https://southeastasia.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=TagsSoutheast Asia: https://southeastasia.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
    • オーストラリア東部:https://australiaeast.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=TagsAustralia East: https://australiaeast.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
  7. 起動するためのコードを追加する必要があります。Code for Awake now needs to be added.

        private void Awake()
            // allows this instance to behave like a singleton
            instance = this;
  8. 次に、コルーチン (その下に静的ストリームメソッドを含む) を追加します。これにより、 Imagecaptureクラスによってキャプチャされたイメージの分析結果が得られます。Next, add the coroutine (with the static stream method below it), which will obtain the results of the analysis of the image captured by the ImageCapture Class.

        /// <summary>
        /// Call the Computer Vision Service to submit the image.
        /// </summary>
        public IEnumerator AnalyseLastImageCaptured()
            WWWForm webForm = new WWWForm();
            using (UnityWebRequest unityWebRequest = UnityWebRequest.Post(visionAnalysisEndpoint, webForm))
                // gets a byte array out of the saved image
                imageBytes = GetImageAsByteArray(imagePath);
                unityWebRequest.SetRequestHeader("Content-Type", "application/octet-stream");
                unityWebRequest.SetRequestHeader(ocpApimSubscriptionKeyHeader, authorizationKey);
                // the download handler will help receiving the analysis from Azure
                unityWebRequest.downloadHandler = new DownloadHandlerBuffer();
                // the upload handler will help uploading the byte array with the request
                unityWebRequest.uploadHandler = new UploadHandlerRaw(imageBytes);
                unityWebRequest.uploadHandler.contentType = "application/octet-stream";
                yield return unityWebRequest.SendWebRequest();
                long responseCode = unityWebRequest.responseCode;     
                    string jsonResponse = null;
                    jsonResponse = unityWebRequest.downloadHandler.text;
                    // The response will be in Json format
                    // therefore it needs to be deserialized into the classes AnalysedObject and TagData
                    AnalysedObject analysedObject = new AnalysedObject();
                    analysedObject = JsonUtility.FromJson<AnalysedObject>(jsonResponse);
                    if (analysedObject.tags == null)
                        Debug.Log("analysedObject.tagData is null");
                        Dictionary<string, float> tagsDictionary = new Dictionary<string, float>();
                        foreach (TagData td in analysedObject.tags)
                            TagData tag = td as TagData;
                            tagsDictionary.Add(tag.name, tag.confidence);                            
                catch (Exception exception)
                    Debug.Log("Json exception.Message: " + exception.Message);
                yield return null;
        /// <summary>
        /// Returns the contents of the specified file as a byte array.
        /// </summary>
        private static byte[] GetImageAsByteArray(string imageFilePath)
            FileStream fileStream = new FileStream(imageFilePath, FileMode.Open, FileAccess.Read);
            BinaryReader binaryReader = new BinaryReader(fileStream);
            return binaryReader.ReadBytes((int)fileStream.Length);
  9. Unityに戻る前に、変更内容をVisual Studioに保存してください。Be sure to save your changes in Visual Studio before returning to Unity.

  10. Unity エディターに戻り、 [スクリプト] フォルダーのVisionManagerおよびimagecaptureクラスをクリックして、[階層] パネル[メインカメラ] オブジェクトにドラッグします。Back in the Unity Editor, click and drag the VisionManager and ImageCapture classes from the Scripts folder to the Main Camera object in the Hierarchy Panel.

章 8-ビルド前Chapter 8 – Before building

アプリケーションの徹底的なテストを実行するには、アプリケーションを HoloLens にサイドロードする必要があります。To perform a thorough test of your application you will need to sideload it onto your HoloLens. これを行う前に、次のことを確認してください。Before you do, ensure that:

  • 第2章で説明したすべての設定が正しく設定されています。All the settings mentioned in Chapter 2 are set correctly.
  • すべてのスクリプトがメインカメラオブジェクトにアタッチされます。All the scripts are attached to the Main Camera object.
  • メインカメラインスペクターパネルのすべてのフィールドが適切に割り当てられます。All the fields in the Main Camera Inspector Panel are assigned properly.
  • 認証キーauthorizationkey変数に挿入されていることを確認します。Make sure you insert your Auth Key into the authorizationKey variable.
  • VisionManagerスクリプトでエンドポイントも確認し 、地域に合わせて配置されていることを確認します (このドキュメントでは、既定で米国西部が使用されています)。Ensure that you have also checked your endpoint in your VisionManager script, and that it aligns to your region (this document uses west-us by default).

第9章– UWP ソリューションをビルドし、アプリケーションをサイドロードするChapter 9 – Build the UWP Solution and sideload the application

このプロジェクトの Unity セクションに必要なものはすべて完了したので、Unity から構築します。Everything needed for the Unity section of this project has now been completed, so it is time to build it from Unity.

  1. ビルド設定 - ファイル > ビルド設定に移動します...Navigate to Build Settings - File > Build Settings…

  2. [ビルドの設定] ウィンドウで、 [ビルド] をクリックします。From the Build Settings window, click Build.

    Unity からアプリをビルドする

  3. Unity C#プロジェクトをまだティックしていない場合は、ティックします。If not already, tick Unity C# Projects.

  4. [Build] をクリックします。Click Build. Unity はエクスプローラーウィンドウを起動します。このウィンドウでは、アプリを作成するフォルダーを作成して選択する必要があります。Unity will launch a File Explorer window, where you need to create and then select a folder to build the app into. ここでそのフォルダーを作成し、「 App」という名前を指定します。Create that folder now, and name it App. 次に、アプリフォルダーを選択し、 [フォルダーの選択] をクリックします。Then with the App folder selected, press Select Folder.

  5. Unity は、アプリフォルダーへのプロジェクトのビルドを開始します。Unity will begin building your project to the App folder.

  6. Unity のビルドが完了すると (時間がかかる場合があります)、ビルドの場所でファイルエクスプローラーウィンドウを開きます (ウィンドウの上に常に表示されるとは限りませんが、新しいウィンドウが追加されたことが通知されます)。Once Unity has finished building (it might take some time), it will open a File Explorer window at the location of your build (check your task bar, as it may not always appear above your windows, but will notify you of the addition of a new window).

第10章– HoloLens へのデプロイChapter 10 – Deploy to HoloLens

HoloLens に展開するには:To deploy on HoloLens:

  1. Hololens が開発者モードになっていることを確認するには、HOLOLENS の IP アドレス (リモートデプロイ用) が必要です。You will need the IP Address of your HoloLens (for Remote Deploy), and to ensure your HoloLens is in Developer Mode. これを行うには :To do this:

    1. HoloLens を装着した後、設定を開きます。Whilst wearing your HoloLens, open the Settings.
    2. [ネットワーク & インターネット > wi-fi > 詳細オプション] にアクセスGo to Network & Internet > Wi-Fi > Advanced Options
    3. IPv4アドレスをメモしておきます。Note the IPv4 address.
    4. 次に、 [設定] に戻り、開発者向けの & セキュリティ > を更新します。Next, navigate back to Settings, and then to Update & Security > For Developers
    5. 開発者モードをに設定します。Set Developer Mode On.
  2. 新しい Unity ビルド (アプリフォルダー) に移動し、 Visual Studioでソリューションファイルを開きます。Navigate to your new Unity build (the App folder) and open the solution file with Visual Studio.

  3. ソリューション構成で、 [デバッグ] を選択します。In the Solution Configuration select Debug.

  4. ソリューションプラットフォームで、[ x86リモートコンピューター] を選択します。In the Solution Platform, select x86, Remote Machine.

    Visual Studio からソリューションをデプロイします。

  5. [ビルド] メニューの [ソリューションの配置] をクリックして、アプリケーションを HoloLens にサイドロードします。Go to the Build menu and click on Deploy Solution, to sideload the application to your HoloLens.

  6. アプリが HoloLens にインストールされているアプリの一覧に表示され、起動できる状態になります。Your App should now appear in the list of installed apps on your HoloLens, ready to be launched!


イマーシブヘッドセットにデプロイするには 、ソリューションプラットフォームローカルコンピューターに設定し、プラットフォームとしてx86を使用して、構成を [デバッグ] に設定します。To deploy to immersive headset, set the Solution Platform to Local Machine, and set the Configuration to Debug, with x86 as the Platform. 次に、[ビルド] メニューの [ソリューションの配置] をクリックして、ローカルコンピューターに配置します。Then deploy to the local machine, using the Build menu, selecting Deploy Solution.

完成した Computer Vision API アプリケーションYour finished Computer Vision API application

これで、Azure Computer Vision API を利用して実際のオブジェクトを認識し、表示されている内容の信頼性を表示する、mixed reality アプリを構築しました。Congratulations, you built a mixed reality app that leverages the Azure Computer Vision API to recognize real world objects, and display confidence of what has been seen.


ボーナスの演習Bonus exercises

演習1Exercise 1

Tagsパラメーターを使用したのと同じように ( VisionManager内で使用されるエンドポイント内での説明に従って)、他の情報を検出するようにアプリを拡張します。他にアクセスできるパラメーターについては、こちらを参照してください。Just as you have used the Tags parameter (as evidenced within the endpoint used within the VisionManager), extend the app to detect other information; have a look at what other parameters you have access to HERE.

演習2Exercise 2

返された Azure データをより多くの会話で表示し、読みやすい方法で表示します (数値を非表示にするなど)。Display the returned Azure data, in a more conversational, and readable way, perhaps hiding the numbers. Bot はユーザーと話し合っているかもしれません。As though a bot might be speaking to the user.