公式チュートリアルの「Multi-user capabilities tutorials」を試す その３

本日は HoloLens2 の公式チュートリアルの実施枠です。
デバイス間でのシェアリングを Photon を用いて実現するチュートリアル「Mult-user capabilities tutorials」を試します。

以下の公式ページの和訳と実施キャプチャを元に記事を書き起こします。
docs.microsoft.com

前回記事の続きです。
bluebirdofoz.hatenablog.com

5. Azure SpatialAnchorsを共有エクスペリエンスに統合する

この章では、Azure Spatial Anchors（ASA）を共有体験に統合する方法を学習します。
ASA を使用すると、複数のデバイスが物理的な世界を共通に参照できます。
このため、ユーザーは実際の物理的な場所でお互いを確認し、同じ場所で共有体験を確認できます。

目的

この章では以下の技術を学びます。

・共有エクスペリエンスに ASA を統合する方法
・ローカル共有体験のコンテキストでASAがどのように機能するか

シーンの準備

[Hierarchy]ウィンドウで、[SharedPlayground]オブジェクトを展開し、次に[TableAnchor]オブジェクトを展開します。

プロジェクトウィンドウで、Assets/MRTK.Tutorials.MultiUserCapabilities/Prefabs を開きます。
[TableAnchor]オブジェクトの子オブジェクトとして、[Buttons]プレハブをドラッグしてシーンに追加します。

シーンを操作するためのボタンの構成

Azure Spatial Anchors を使用して、共有体験で空間配置を実現する方法の基本を示す一連のボタンイベントを構成します。

[Hierarchy]ウィンドウで、[Button]オブジェクトを展開します。
[StartAzureSession]という名前の最初の子ボタンオブジェクトを選択します。

[Inspector]ウィンドウで、Interactable (Script) コンポーネントを見つけ、以下のように OnClick() イベントを構成します。

・[None (Object)]フィールドに[TableAnchor]オブジェクトを割り当てます
・[No Function]ドロップダウンから[AnchorModuleScript -> StartAzureSession()]関数を選択します

[Hierarchy]ウィンドウで、[CreateAzureAnchor]という名前の2番目の子ボタンオブジェクトを選択します。
[Inspector]ウィンドウで、Interactable（Script）コンポーネントを見つけて OnClick() イベントを以下のように構成します。

・[None (Object)]フィールドに[TableAnchor]オブジェクトを割り当てます。
・[No Function]ドロップダウンから[AnchorModuleScript -> CreateAzureAnchor()]関数を選択します
・表示される[None (Game Object)]フィールドに[TableAnchor]オブジェクトを割り当てます

[Hierarchy]ウィンドウで、[ShareAzureAnchor]という名前の3番目の子ボタンオブジェクトを選択します。
[Inspector]ウィンドウで、Interactable（Script）コンポーネントを見つけて OnClick() イベントを以下のように構成します。

・[None (Object)]フィールドに[TableAnchor]オブジェクトを割り当てます
・[No Function]ドロップダウンから[SharingModuleScript -> ShareAzureAnchor()]関数を選択します

[Hierarchy]ウィンドウで、[GetAzureAnchor]という名前の4番目の子ボタンオブジェクトを選択します。
[Inspector]ウィンドウで、Interactable（Script）コンポーネントを見つけて OnClick() イベントを以下のように構成します。

・[None (Object)]フィールドに[TableAnchor]オブジェクトを割り当てます
・[No Function]ドロップダウンから[SharingModuleScript -> GetAzureAnchor()]関数を選択します

シーンをAzureリソースに接続する

[Hierarchy]ウィンドウで、[SharedPlayground]オブジェクトを展開して[TableAnchor]オブジェクトを選択します。

[Inspector]ウィンドウで、Spatial Anchor Manager（Script）コンポーネントを開きます。
Azure Spatial Anchors アカウントの資格情報を使用して[Credentials]セクションを以下のように構成します。

・[Spatial Anchors Account ID]フィールドに、Azure Spatial Anchors アカウントのアカウントIDを貼り付けます
・[Spatial Anchors Account Key]フィールドに、Azure Spatia lAnchors アカウントから主キーまたはセカンダリキーを貼り付けます。

ヒント

シーンに空間アンカーアカウントIDとキーを設定する代わりに、プロジェクト全体に設定することもできます。
これは ASA を使用する複数のシーンがある場合に役立ちます。
これを利用するにはプロジェクトウィンドウで、Assets/AzureSpatialAnchors.SDK/Resources を開きます。
[SpatialAnchorConfig]の[Inspector]ウィンドウを開き、設定を行います。

[Hierarchy]ウィンドウで[TableAnchor]オブジェクトを選択します。
[Inspector]ウィンドウで Anchor Module (Script) コンポーネントを見つけて、以下のように構成します。

・[Public Sharing Pin]フィールドで、Pin がプロジェクトに固有になるように値を変更します

[TableAnchor]のオブジェクトを選択したまま、[Inspetor]ウィンドウから以下のように構成します。

・Spatial Anchor Manager（Script）コンポーネントの横にあるチェックボックスをオンにして有効にします。
・Anchor Module Script (Script) コンポーネントの横にあるチェックボックスをオンにして、有効にします
・Sharing Module Script (Script) コンポーネントの横にあるチェックボックスをオンにして、有効にします

・空間配置を試す

Unity プロジェクトをビルドして2つのデバイスにデプロイする場合、Azure Anchor ID を共有することで、デバイス間の空間的な配置を実現できます。
テストするには、次の手順に従います。

1

デバイス1側でアプリを起動します
Rover Explorer がインスタンス化され、テーブルに配置されます。

2

デバイス2側でアプリを起動します。
デバイス1と同じルームに入室できていれば[Debug Window]に「Total players in room: 2」と表示されます。
ただし Rover Explorer は同じ場所に表示されず、ユーザーのアバターも現実のユーザー位置に表示されません。

3

デバイス間の空間配置の共有を行うため、デバイス1側で[Start Azure Session]ボタンを押します。
成功すると[Debug Window]に「Azure session started successfully」と表示されます。

4

デバイス1側で[Create Azure Anchor]ボタンを押します。
プロジェクトは TableAnchor オブジェクトの場所にアンカーを作成します。
成功すると[Debug Window]に「Current Azure anchor ID updated to .....」と表示されます。

5

デバイス1側で[Share Azure Anchor]ボタンを押します。
アンカー情報を Azure リソースに格納し、アンカーIDを他のユーザーとリアルタイムで共有します。
成功すると[Debug Window]に「Azure Anchor ID shared by user: .....」と表示されます。

6

デバイス2側で[Start Azure Session]ボタンを押します。
成功すると[Debug Window]に「Azure session started successfully」と表示されます。

7

デバイス2側で[Get Azure Anchor]ボタンを押します。
Azure リソースに接続して共有アンカーIDのアンカー情報を取得します。
成功すると[Debug Window]に「Loading for Zzure anchor... please wait...」と表示されます。

8

デバイス1で作成したアンカー空間が検出されると TableAnchor オブジェクトがその場所に移動します。
成功すると[Debug Window]に「Local anchor position successfully set to Azure anchor position」と表示されます。
空間配置が共通化されたため、Rover Explorer の位置やアバターと現実のユーザーの位置が一致するようになります。

注意

Azure SpatialAnchors は Unity では実行できません。
よって、Azure Spatial Anchors の機能をテストするには少なくとも2つのデバイスにデプロイする必要があります。

2020/10/12特記

2020/10/12現在、以下のページから取得した AzureSpatialAnchors.unitypackage の SDK を利用した場合、[Create Azure Anchor]実行時に CloudSpatialException が発生し、正常に動作しませんでした。
docs.microsoft.com

本記事では、事前に動作した「Create a Unity HoloLens app that uses Azure Spatial Anchors」チュートリアル側の SDK を利用する事で回避しました。
bluebirdofoz.hatenablog.com

以下のフォルダのファイルを書き換える事で差し替えることができます。
・「Create a Unity HoloLens app that uses Azure Spatial Anchors」側のSDK（取得元）

Packages/AzureSpatialAnchorsSDKCore/Runtime/Scripts：スクリプトフォルダ
Assets/AzureSpatialAnchors.SDK/Resources：リソースフォルダ

・「Multi-user capabilities tutorials」側のSDK（書き換え先）

Assets/AzureSpatialAnchors.SDK/Scripts：スクリプトフォルダ
Assets/AzureSpatialAnchors.SDK/Resources：リソースフォルダ

公式チュートリアルの「Multi-user capabilities tutorials」を試す その２

本日は HoloLens2 の公式チュートリアルの実施枠です。
デバイス間でのシェアリングを Photon を用いて実現するチュートリアル「Mult-user capabilities tutorials」を試します。

以下の公式ページの和訳と実施キャプチャを元に記事を書き起こします。
docs.microsoft.com

前回記事の続きです。
bluebirdofoz.hatenablog.com

3.複数のユーザーを接続する

この章では、共有体験の一部として複数のユーザーを接続する方法を学習します。
複数のデバイスでアプリを実行し、各ユーザーに他のユーザーのアバターがリアルタイムで移動するのを確認できるようになります。

目的

この章では以下の技術を学びます。

・共有体験で複数のユーザーを接続する方法

シーンの準備

最初にチュートリアルのプレハブをいくつか追加して、シーンを準備します。

プロジェクトウィンドウで、Assets/MRTK.Tutorials.MultiUserCapabilities/Prefabs を開きます。
以下のプレハブを Hierarchy にドラッグしてシーンに配置します。
・NetworkLobby.prefab
・SharedPlayground.prefab

プロジェクトウィンドウで、Assets/MRTK.Tutorials.AzureSpatialAnchors/Prefabs を開きます。
以下のプレハブを[Hierarchy]にドラッグしてシーンに配置します。
・DebugWindowy.prefab

ユーザープレハブの作成

共有体験でユーザーを表すために使用されるプレハブを作成します。

1.ユーザーを作成して構成します

[Hierarchy]ウィンドウで、空の領域を右クリックし、[Create Empty]を選択して空のオブジェクトをシーンに追加ます。
オブジェクトに[PhotonUser]という名前を付けて、次のように構成します。

・Transform Position が X = 0、Y = 0、Z = 0 に設定されていることを確認します。

[Hierarchy]ウィンドウで[PhotonUser]オブジェクトを選択し、[Inspector]ウィンドウを開きます。
[Add Component]ボタンを使用して、[Photon User (Script)]コンポーネントを[PhotonUser]オブジェクトに追加します。

再び、[Add Component]ボタンを使用して、[Generic Net Sync (Script)]コンポーネントを[PhotonUser]オブジェクトに追加します。
以下の設定を行います。

・[User]チェックボックスをオンにします

再び、[Add Component]ボタンを使用して、[Photon View (Script)]コンポーネントを[PhotonUser]オブジェクトに追加します。
以下の設定を行います。

・[Observed Components]フィールドに、[Generic Net Sync (Script)]コンポーネントを割り当てます

2.アバターを作成します

プロジェクトウィンドウで、Assets/MRTK/SDK/StandardAssets/Materials フォルダに移動して、MRTK マテリアルを見つけます。

[Hierarchy]ウィンドウで、[PhotonUser]オブジェクトを右クリックし、[3D Object -> Sphere]を選択します。
[PhotonUser]オブジェクトの子として[Sphere]オブジェクトが作成されるので、次のように構成します。

・Transform Position が X = 0、Y = 0、Z = 0 に設定されていることを確認します。
・Transform Scale を適切なサイズに変更します（例：X = 0.15、Y = 0.15、Z = 0.15）
・MeshRenderer> Materials> Element 0 フィールドに[MRTK_Standard_White]マテリアルを割り当てます

3.プレハブを作成します

プロジェクトウィンドウで、Assets/MRTK.Tutorials.MultiUserCapabilities/Resources フォルダに移動します。

[PhotonUser]オブジェクトを[Hierarchy]ウィンドウから[Resources]フォルダーにドラッグます。
これで[PhotonUser]オブジェクトがプレハブになります。

[Hierarchy]ウィンドウで[PhotonUser]オブジェクトを右クリックし、[Delete]を選択してシーンから削除します。

ユーザープレハブをインスタンス化するためのPUNの構成

プロジェクトウィンドウで、Assets/MRTK.Tutorials.MultiUserCapabilities/Resources フォルダーを開きます。

[Hierarchy]ウィンドウに[NetworkLobby]オブジェクトを展開し、子オブジェクトの[NetworkRoom]オブジェクトを選択します。
[Inspector]ウィンドウで、[Photon Room (Script)]コンポーネントを見つけて、次のように構成します。

・[Photon User Prefab]のフィールドに、Resources フォルダから先ほど作成した PhotonUser プレハブを割り当てます

複数のユーザーで体験を試す

Unity プロジェクトをビルドして HoloLens にデプロイします。
Unity に戻って、アプリが HoloLens で実行されているときにゲームモードに入ると、アバターの Sphere が2つ表示されます。
頭（HoloLens）を動かすと、HoloLens 側のアバターが移動するのが確認できます。

注意

アプリはPhotonに接続する必要があります。
コンピューターとデバイスがインターネットに接続されていることを確認してください。

ビルド時のエラー

2020/10/12現在、PUN 2 バージョン 2.22 時、筆者環境では UWP ビルドで以下のような大量の CS0246 エラーが発生しました。

UWP ビルド時に以下の dll が参照できていないことが原因でした。
・Assets/Photon/PhotonLibs/Photon3Unity3D.dll

WSAPlayer の Exclude Platforms チェックを外すことでエラーが解消されました。

4.オブジェクトの動きを複数のユーザーと共有する

この章ではオブジェクトの動きを共有して、共有体験の全ての参加者が互いの相互作用を表示できる方法を学習します。

目的

この章では以下の技術を学びます。

・オブジェクトの動きを共有するプロジェクトの構成方法
・基本的なマルチユーザーコラボレーションアプリの構築方法

シーンの準備

チュートリアルのプレハブを追加してシーンを準備します。

プロジェクトウィンドウで Assets/MRTK.Tutorials.MultiUserCapabilities/Prefabs フォルダを開きます。
[TableAnchor]プレハブを[Hierarchy]ウィンドウの[SharedPlayground]オブジェクトにドラッグして、子オブジェクトとしてシーンに追加します。

オブジェクトをインスタンス化するためのPUNの構成

ローバー探索体験を使用するようにプロジェクトを構成し、インスタンス化する場所を定義します。

プロジェクトウィンドウで Assets/MRTK.Tutorials.MultiUserCapabilities/Resources フォルダを開きます。

[Hierarchy]ウィンドウで[NetworkLobby]オブジェクトを展開し、子オブジェクトの[NetworkRoom]を選択します。
次に、[Inspector]ウィンドウで Photon Room (Script) コンポーネントを開いて、次のように構成します。

・[Rover Explorer Prefab]フィールドに Resources フォルダから RoverExplorer_Complete_Variant プレハブを割り当てます。

[NetworkRoom]オブジェクトを選択したまま、[Hierarchy]ウィンドウで[TableAnchor]オブジェクトを展開します。
[Inspector]ウィンドウで Photon Room (Script) コンポーネントをを開いて、次のように構成します。

・[Rover Explorer Location]フィールドに[TableAnchor]オブジェクトの[Table]子オブジェクトを割り当てます。

共有オブジェクトの動きを体験してみます

Unity プロジェクトをビルドして HoloLens にデプロイします。
Unity に戻って、アプリが HoloLens で実行されているときにゲームモードに入ります。
HoloLens 側でオブジェクトを移動すると、Unity 側でもオブジェクトが移動するのがわかります。

次は Azure Spatial Anchors を使って現実空間に置ける座標の共有を行います。
bluebirdofoz.hatenablog.com

公式チュートリアルの「Multi-user capabilities tutorials」を試す その１

本日は HoloLens2 の公式チュートリアルの実施枠です。
デバイス間でのシェアリングを Photon を用いて実現するチュートリアル「Mult-user capabilities tutorials」を試します。

以下の公式ページの和訳と実施キャプチャを元に記事を書き起こします。
docs.microsoft.com

1.はじめに

概要

このチュートリアルでは Photon Unity Networking（PUN）を使用してマルチユーザー体験を構築する基本を学びます。
PUNは共有体験を作成するために利用できるいくつかのネットワーキングオプションの1つです。

このシリーズのチュートリアルは以下の項目で構成されます。

・PhotonUnityネットワークの設定
・複数のユーザーを接続する
・オブジェクトの動きを複数のユーザーと共有する
・Azure SpatialAnchorsを共有エクスペリエンスに統合する

目的

本チュートリアルでは以下の技術を学びます。

・PUN アプリを作成して Unity プロジェクトを接続する方法
・共有体験で複数のユーザーを接続する方法
・オブジェクトの動きを他のユーザーと共有する方法
・複数のデバイス間で空間的な配置の共有を実現する方法

前提条件

本チュートリアルを実施するための前提条件は以下の通りです。

・Windows10コンピューター
・Visual Studio 2019
・Windows 10 SDK10.0.18362.0以降
・開発モードの HoloLens2 デバイス
・Unity 2019.3.15
- UWP プラットフォームビルドサポート
・Unity と MRTK に関する基本的な知識
・AzureSpatialAnchors アカウントの作成経験
・Create a Spatial Anchors resource セクションの履修済み
docs.microsoft.com

本ブログの Create a Spatial Anchors resource セクションの記事は以下です。
bluebirdofoz.hatenablog.com

Android にもデプロイする場合
・ARCore 対応の Android デバイス
・Unity 2019.3.15
- Android プラットフォームビルドサポート

iOS にもデプロイする場合
・MacOS コンピュータ
・Xcode(最新バージョン)
・ARKit 対応の iOS デバイス
・Unity 2019.3.15
- iOS プラットフォームビルドサポート

このチュートリアルシリーズで推奨される MixedReality Toolkit のバージョンは MRTK2.4.0 です。
github.com

このチュートリアルシリーズで推奨されるUnityバージョンはUnity2019.3.15です。
本記事では Unity 2019.4.11 のバージョンを利用しています。

2. PhotonUnityネットワークの設定

概要

この章では Photon Unity Networking（PUN）を使用して共有体験を作成する準備をします。
PUN アプリを作成するほか、PUN アセットを Unity プロジェクトにインポートし、Unity プロジェクトを PUN アプリに接続する方法を学習します。

目的

この章では以下の技術を学びます。

・PUN アプリを作成する方法
・PUN アセットを見つけてインポートする方法
・Unity プロジェクトを PUN アプリに接続する方法

Unityプロジェクトの作成と準備

新しいUnityプロジェクトを作成し、MRTK開発の準備をします。

プロジェクトを作成するには、以下のチュートリアルのデバイスへのデプロイを除いた一連の手順を行います。
docs.microsoft.com

1.適切な名前（例：MRTKチュートリアル）の Unityプロジェクトを作成します。

2.Mixed RealityToolkit をインポートします。

3.Unity プロジェクトの構成を実行します。

4.ビルドプラットフォームを UWP に切り替えます。

5.TextMeshPro リソースをインポートします。

6.シーンの作成を実行します。

7.シーンに適切な名前（MultiUserCapabilitiesなど）を付けます。

次に、以下のチュートリアルに従って次の手順を実行します。
docs.microsoft.com

1.MRTK の構成プロファイルを DefaultHoloLens2ConfigurationProfile に変更します。

2.空間認識メッシュ表示オプションを"Occlusion"に変更します。

追加機能の有効化

[Edit > Project Settings...]を開き、[Player > Publishing Settings]で以下の Capabillities の有効化を確認します。
・InternetClient
・Microphone
・SpatialPerception
・GazeInput

次に以下の Capabillities を有効にします。
・InternetClientServer
・PrivateNetworkClientServer

組み込みのUnityパッケージのインストール

Unityメニューで、[Window -> Package Manager]を選択して[Package Manager]ウィンドウを開きます。
[AR Foundation]を検索して選択し、[Install]ボタンをクリックしてパッケージをインストールします。

注意

次のセクションでインポートする AzureSpatial Anchors SDK に必要なため、ARFoundation パッケージをインストールします。

チュートリアルアセットのインポート

次のUnityカスタムパッケージを以下の順序通りにインポートします。

1.AzureSpatialAnchors.unitypackage
2.MRTK.HoloLens2.Unity.Tutorials.Assets.GettingStarted.2.4.0.unitypackage
3.MRTK.HoloLens2.Unity.Tutorials.Assets.AzureSpatialAnchors.2.4.0.unitypackage
4.MRTK.HoloLens2.Unity.Tutorials.Assets.MultiUserCapabilities.2.4.0.unitypackage

docs.microsoft.com

チュートリアルアセットをインポートすると、プロジェクトウィンドウは以下のようになります。

注意

MultiUserCapabilities.2.4.0.unitypackage をインポートした後、コンソールにいくつかのCS0246エラーが表示されます。
これは PUN アセットをインポートする次のセクションで解決されます。

PUNアセットのインポート

Unityメニューで[Window -> AssetStore]を選択して[AssetStore]ウィンドウを開き、[PUN 2]を検索して選択します。

ダウンロードボタンをクリックして PUN 2 アセットパッケージをダウンロードします。

ダウンロードが完了したら、[Import]ボタンをクリックします。

[Unity Package Import]ウィンドウが開きます。
全てのアセットが選択されていることを確認してから[Import]ボタンをクリックしてアセットをインポートします。

インポートが完了すると、[PUN Settings]メニューがロードされた状態で[PunWizard]ウィンドウが表示されます。
この時点では、このウィンドウは無視して閉じます。

PUNアプリケーションの作成

この章では RUN アカウントにサインインして新しい PUN アプリを作成します。
dashboard.photonengine.com

使用する RUN アカウントが既にある場合は、Photon ダッシュボードに移動してサインインします。
アカウントがない場合は、アカウントの作成リンクをクリックし、指示に従って新しいアカウントを登録します。

サインインしたら、[新しくアプリを作成する]ボタンをクリックします。

[新しいアプリケーションの作成]ページで、以下の設定を入力します。

Photonの種別：Photon PUN を選択します。
アプリケーション名：適切な名前を入力します（例：MRTKチュートリアル）。
Description：適切な説明文を入力します（オプション）。
URL：フィールドを入力しないままにします。

入力を行ったら[作成する]ボタンをクリックして、新しいアプリを作成します。

Photon が作成プロセスを完了すると、新しい PUN アプリがダッシュボードに表示されます。

UnityプロジェクトをPUNアプリケーションに接続する

この章では Unity プロジェクトを前章で作成した PUN アプリに接続します。

Photon ダッシュボードで[アプリケーションID]フィールドをクリックしてアプリIDを表示し、クリップボードにコピーします。

Unity プロジェクトを開き、[Window > Photon Unity Networking > PUN Wizard]を選択します。
[PunWizard]ウィンドウが開くので、[Setup Project]ボタンをクリックして、[PUN Setup]メニューを開きます。

[App Id]または[Email]フィールドに先ほどコピーした RUN アプリのアプリIDを貼り付けます
[Setup Project]ボタンをクリックして、アプリIDを適用します。

セットアッププロセスが完了すると、[PUN Setup]メニューに「Done！」というメッセージが表示されます。
プロジェクトウィンドウで PhotonServerSettings アセットを選択し、[Inspector]ウィンドウで内容を確認します。

これで PUN アプリを作成して Unity プロジェクトに接続することができました。
次のステップでは他のユーザーとの接続を許可して、複数のユーザーがお互いを見ることができるようにします。
bluebirdofoz.hatenablog.com

公式クイックスタートの「Create a Unity HoloLens app that uses Azure Spatial Anchors」を試す

本日は HoloLens2 の公式クイックスタートの実施枠です。
Azure Spatial Anchors 利用のクイックスタート「Create a Unity HoloLens app that uses Azure Spatial Anchors」を試します。

以下の公式ページの和訳と実施キャプチャを元に記事を書き起こします。
docs.microsoft.com

概要

このクイックスタートでは Azure SpatialAnchors を使用する UnityHoloLens アプリを作成します。
Azure Spatial Anchors はクロスプラットフォームの開発者サービスです。
オブジェクトを使用して複合現実体験を作成し、デバイス間でその場所を長期にわたって維持することができます。
本クイックスタートを終了すると Unity で構築された HoloLens アプリが作成され、Spatial Anchors を保存して呼び出すことができます。

本クイックスタートでは以下の手順を学びます。

・Spatial Anchors アカウントの作成方法
・Unity ビルドの設定手順
・Spatial Anchors アカウント識別子とアカウントキーの構成手順
・VisualStudio プロジェクトのエクスポート手順
・HoloLens デバイスへのアプリのデプロイと実行手順

Azureサブスクリプションをお持ちでない場合は、開始する前に無料のアカウントを作成してください。

azure.microsoft.com

以下は本ブログの過去記事です。
bluebirdofoz.hatenablog.com

前提条件

本クイックスタートを実施するための前提条件は以下の通りです。

・Windows10コンピューター
・Visual Studio 2019
・Windows 10 SDK10.0.18362.0以降
・Unity 2019.4 (LTS)
・開発モードの HoloLens2 デバイス
- Windows 10 October 2018 Update(RS5)の更新済み

Spatial Anchors リソースを作成する

Spatial Anchors リソースを使用するには Azure ポータルでアカウントを作成および設定する必要があります。

Azure ポータルに移動してログインします。
portal.azure.com

ログインしたらメニューから[リソースの作成]をクリックします。

検索欄から[Spatial Anchors]を検索して選択します。

Spatial Anchors のページが開きます。
[作成]を選択します。

各種設定項目の入力ページが開きます。以下の通り、入力して[作成]を選択します。

リソース名：任意の一意なリソース名
サブスクリプション：リソースをアタッチするサブスクリプション
リソースグループ：管理するリソースグループ
場所：リソースを配置する場所（地域）

リソースグループを未作成の場合は[新規作成]を選択してリソースグループを作成します。
リソースグループは、Webアプリケーション、データベース、ストレージの Azure のリソースをデプロイおよび管理する論理的なコンテナです。
例えば、後で1つの簡単な手順でリソースグループ全体を削除することが可能になります。

リソースが作成されると、以下のデプロイ完了のページが開きます。
[リソースに移動]をクリックします。

リソースのプロパティが表示ページが開きます。
[アカウントID]と[アカウントドメイン]が後で必要になるため、テキストエディタにコピーしておきます。

左側の[設定]下にある[アクセスキー]を選択して、アクセスキーのページを表示します。
[主キー]が後で必要になるため、こちらもテキストエディタにコピーしておきます。

これで Azure ポータルでの設定は完了です。

Unityサンプルプロジェクトをダウンロードして開く

以下のサンプルリポジトリをダウンロードします。
github.com

今回はページから直接[Download ZIP]で取得しました。

ダウンロードしたファイルを展開します。
Unity で Unity ディレクトリを指定してプロジェクトを開きます。

ビルドプラットフォームの切り替え

プロジェクトを開いたら最初にビルドプラットフォームを切り替えます。
[File -> Build Settings]を開きます。

[Build Settings]ダイアログが開くので[Platform]で[Universal Windows Platform]を選択します。
[Target Device]の項目が表示されるので[HoloLens]を選択し、[Switch Platform]で切り替えを実行します。

切り替えが完了したら[Build Settings]ダイアログを閉じます。

アカウント情報の設定

アプリケーションに Azure Spatial Anchors のアカウント情報を設定します。
Assets/AzureSpatialAnchors.SDK/Resources を開き、SpatialAnchorConfig の Inspector ビューを開きます。

各項目に先ほど Azure ポータルでコピーしたテキストを入力します。

Spatial Anchors Account Id     ：アカウントID
Spatial Anchors Account Key    ：アクセスキー
Spatial Anchors Account Domain ：アカウントドメイン

プロジェクトの各種設定

その他、プロジェクトの各種設定が正しく行われているか確認します。
[Edit -> Project Settings..]を開きます。

[Project Settings]ダイアログが開くので[Player]タブを開き、[Publishing Settings]パネルを開きます。
[Capabilities]内の[SpatialPerception]にチェックが入っていることを確認します。

次に[XR Settins]パネルを開きます。
[Virtual Reality Supported]のチェックと、[Virtual Reality SDKs]が設定されていることを確認します。

VisualStudioプロジェクトのエクスポート

Unity プロジェクトを VisualStudio プロジェクトにビルドします。
[File -> Build Settings]を開きます。

[Build Settings]ダイアログが開くので[Build]を実行します。

ビルドが完了すると、VisualStudio プロジェクトが指定のディレクトリに出力されます。。

HoloLens2へのデプロイ

出力された VisualStudio プロジェクトを開きます。
HoloLens2 へインストールする場合はターゲットを[Release][ARM64]に指定します。

HoloLens2 をUSB接続している場合は、デプロイ先を[デバイス]、ネットワーク経由でデプロイする場合は[リモートコンピュータ]で指定して[デバッグ -> デバッグなしで開始]を実行します。

これで HoloLens2 にアプリケーションがデプロイされます。

HoloLens2での動作確認

アプリが起動すると、シーンの選択パネルが表示されます。
デフォルトで表示されている[BasicDemo]を選択した状態で[Go]をタップします。

すると Spatial Anchors の作成デモが開始します。

表示されるテキストに従って、タップを行うと Spatial Anchors が作成されます。

Spatial Anchors の作成に成功すると、Azure ポータルで Spatial Anchors が追加された事が確認できます。

リソースのクリーンアップ

本記事ではリソースグループの作成手順を紹介しました。
これらのリソースが不要になった場合は、リソースグループを削除できます。

Azure ポータルメニューまたはホームページから[リソースグループ]を選択します。

[リソースグループ]ページが開くので、削除したいリソースグループ（[myResourceGroup]など）を選択します。

リソースグループ（[myResourceGroup]など）のページで、リストされているリソースが削除対象であることを確認します。
[リソースグループの削除]を選択します。

テキストボックスにリソースグループ名（[myResourceGroup]など）を入力して確認して[削除]を選択します。

Blender2.8でカーブモディファイアを使って作成したアニメーションをUnityに持ち込む 後編（ボーンアニメーションへの変換と出力）

本日は Blender の技術調査枠です。
Blender2.8でカーブモディファイアを使って作成したアニメーションをUnityに持ち込む手順を記事にします。

前回記事の続きです。
bluebirdofoz.hatenablog.com

カーブモディファイアを使ったアニメーション

前回作成した Cylinder オブジェクトにカーブモディファイアを使ったアニメーションを設定します。
以下の記事と同様の手順でアニメーションを作成しました。
bluebirdofoz.hatenablog.com

以下のように Cylinder オブジェクトが円状のカーブオブジェクトに沿って動くアニメーションが作成できました。

ボーンアニメーションへの変換

作成したカーブモディファイアのアニメーションをボーンアニメーションに変換していきます。

ボーンの追従設定

最初に各ボーンがメッシュのアニメーションに追従して動くように設定を行います。
[アウトライナー]ウィンドウから Armature オブジェクトを選択して[ポーズモード]を開きます。

開始点のボーン

最初に開始点のボーンをメッシュオブジェクトの下部に追従するよう設定を行います。
開始点の Bone ボーンを選択して[ボーンコンストレイント]タブを開きます。

[ボーンコンストレイント追加]のプルダウンを開き、[位置コピー]のコンストレイントを選択します。

[位置コピー]のコンストレイントが追加されるので、[ターゲット]に[Cylinder]を、[頂点グループ]に[Bone]を設定します。
これで Cylinder オブジェクトの Bone 頂点グループの位置に Bone ボーンが追従するようになります。

次に再び[ボーンコンストレイント追加]のプルダウンを開き、[トラック]のコンストレイントを選択します。

[トラック]のコンストレイントが追加されるので、[ターゲット]に[Cylinder]を、[頂点グループ]に[Bone.008]を設定します。
これで Cylinder オブジェクトの Bone.008 頂点グループの方向に Bone ボーンの先端が追従するようになります。

中間のボーン

次の Bone.008 ボーンを選択して同じくコンストレイントを設定します。
[位置コピー]を設定するのは開始点のボーンのみなので、こちらは[トラック]のコンストレイントのみ設定します。

[トラック]のコンストレイントが追加されるので、[ターゲット]に[Cylinder]を、[頂点グループ]に[Bone.007]を設定します。
これで Cylinder オブジェクトの Bone.007 頂点グループの方向に Bone.008 ボーンの先端が追従するようになります。

Bone.008 と同じ手順を繰り返して、Bone.007 ～ Bone.002 までに追従先を指定した[トラック]を設定します。

終端のボーン

終端の Bone.001 のみ追従する先がないので、コンストレイントは設定しません。

この時点でアニメーションを再生して設定が正しく行われるか確認してみます。
メッシュの動きに合わせて各ボーンが追従すれば成功です。

ボーンアニメーションのベイク

このボーンの動きをアニメーションとしてキーフレームを挿入します。
[ポーズ -> アニメーション -> アクションをベイク]を実行することで、まとめてキーフレームを挿入することができます。

パネルが表示されるので以下の通り設定を行い、[OK]をクリックします。

開始フレーム：1 （キーフレームの挿入開始フレーム）
最終フレーム：250 （キーフレームの挿入最終フレーム）
フレームステップ：１ （キーフレームの挿入間隔）
選択ボーンのみ：False （Falseで全てのボーンにキーフレームを挿入）
ビジュアルキーイング：True （Trueでコンストレイント反映後の状態をキーフレームに挿入）
コンストレイントをクリア：True （Trueでキーフレーム挿入と同時にコンストレイント設定を削除）
親子関係をクリア：False （Trueでアーマチュアの親子関係をクリア）
現在のアクションを上書き：False （Trueで現在のアクションを上書き）
データをベイク：ポーズ （トランスフォームのベイク先、ポーズの場合はボーン）

これで全てのフレームにボーンの動きのキーフレームが挿入されます。

アニメーションを再生して正しく動作するか確認してみます。

カーブモディファイアを使ったアニメーションの削除

ボーンアニメーションの準備が整ったので、カーブモディファイアを使ったアニメーションはもう不要です。
[オブジェクトモード]に戻り、Cylinder オブジェクトの[モディファイア]タブを開き、カーブモディファイアを削除します。

Z軸移動のアニメーションも不要なので、こちらも削除します。
[アイテム]サイドバーから、[トランスフォーム]パネルの[位置]を右クリックして[キーフレームをクリア]を実行します。

これでカーブモディファイアの設定とZ軸移動を使ったアニメーションを削除できました。
アニメーションを再生して Cylinder オブジェクトが動かないことを確認します。

カーブオブジェクトの BezierCircle オブジェクトについても不要なため、選択して[削除]しても問題ありません。

メッシュオブジェクトをボーンに追従させる

後は Cylinder オブジェクトをボーンに追従させるだけです。
[アウトライナー]ウィンドウから Cylinder オブジェクトを選択し、Ctrl キーを押したまま、Armature オブジェクトを選択して複数選択の状態にします。

複数選択の状態で、[オブジェクト -> ペアレント -> アーマチュア変形]を実行します。

これで Cylinder オブジェクトと Armature オブジェクトが親子関係で関連付けられます。
Cylinder オブジェクトにはボーンと同名の頂点グループを割り当てたため、各頂点が各ボーンに追従するようになります。

アニメーションを再生して Cylinder オブジェクトがボーンに追従して変形と移動をすれば成功です。
これでボーンアニメーションに変換できました。

Unityへの取り込み

作成したモデルとアニメーションを Unity に取り込みます。
作成したアニメーションモデルを[ファイル -> エクスポート -> FBX]で出力します。

出力時の[オブジェクトタイプ]には必ず[アーマチュア]と[メッシュ]を含めます。

作成した FBX ファイルをドラッグして Unity にインポートします。

FBX ファイルの内容を確認すると、アニメーションデータが含まれています。
[アクションをベイク]時に別アクションとしてアニメーションを作成したので2つのアニメーションが保存されています。

ボーンアニメーションの方を選択して再生すると、円の経路に沿った変形アニメーションが Unity 側でも再生できました。
これで Unity へのアニメーションの取り込みが成功しました。

Blender2.8でカーブモディファイアを使って作成したアニメーションをUnityに持ち込む 前編（アニメーション変換用モデルの作成）

本日は Blender の技術調査枠です。
Blender2.8でカーブモディファイアを使って作成したアニメーションをUnityに持ち込む手順を記事にします。

前回記事の続きです。
bluebirdofoz.hatenablog.com

カーブモディファイアのアニメーションをそのままUnityに取り込んだ場合

最初に、何の変換も行わずにカーブモディファイアのアニメーションを設定したモデルを Unity に取り込んでみます。
Unity にモデルを取り込むため、前回作成したアニメーションモデルを[ファイル -> エクスポート -> FBX]で出力します。

作成した FBX ファイルをドラッグして Unity にインポートします。

FBX ファイルの内容を確認すると、アニメーションデータが含まれています。
しかし、このデータを再生するとZ座標の情報が 0.0 m から 62.8 m まで上昇するだけのアニメーションが再生されます。

これはカーブモディファイアによる変形は Blender の機能であるためです。
Unity 側ではカーブモディファイアによる変形が起こらないため、キーフレームとして打ち込んだZ座標の移動アニメーションのみが再生されています。

Unityに取り込み可能なアニメーション

Unity に取り込み可能なアニメーションデータは、ボーンアニメーション(スケルタルアニメーション)またはシェイプキー(ブレンドシェイプ)によるアニメーションです。
docs.unity3d.com
docs.unity3d.com

Blender で作成したカーブモディファイアのアニメーションを Unity に取り込むには、Blender 内でこれらの種類のアニメーションに変換する必要があります。
今回の記事ではボーンアニメーションに変換することで、Unity に取り込む方法を説明します。

アニメーション変換のためのモデル作成

初めにアニメーションを行う3Dモデルと、アニメーションを制御するボーン構造を作成します。

メッシュオブジェクトの作成

今回は作業内容を分かりやすくするために円柱形のモデルを利用します。
[オブジェクトモード]で[追加 -> メッシュ -> 円柱]で Cylinder オブジェクトを追加します。

アニメーションが分かりやすいよう[調整パネル]で[深度]を 8.0 mにします。

アーマチュアによる変形が可能になるように[編集モード]で円柱の頂点数を増やします。
[ループカット]を実行し、[分割数]を[7]に設定しました。

この手順だと分割の間隔が丁度 1.0 mになるため、後々の編集がしやすくなります。

[選択 -> すべて]または[A]キーで全ての頂点を選択します。
この状態で[移動]を実行してZ軸方向に 4.0 m移動します。

これはメッシュオブジェクトの底辺とワールド原点を合わせるためです。
こうしておくと、後々の編集がしやすくなります。

アーマチュア(ボーン)の作成

次にメッシュの形状に合わせてアーマチュア(ボーン)を作成します。
[オブジェクトモード]で[追加 -> アーマチュア -> 単一ボーン]で Armature オブジェクトを追加します。

ボーンがメッシュに埋まっているため、追加した時点では[3Dビュー]上でボーンが見えません。
このままだと不便なので、[オブジェクトデータ]タブを開き、[ビューポート表示]パネルから[最前面]にチェックを入れます。
これでメッシュにボーンが埋まった状態でも、ボーンが[3Dビュー]に表示されるようになります。

更に[名前]にもチェックを入れておきます。
すると、各ボーンの名称が[3Dビュー]に表示されるようになり、メッシュとの対応を取る際に便利です。

メッシュの形状に合うように、アーマチュアを編集します。
[編集モード]に入り、Bone ボーンを選択した状態で[拡大縮小]でZ軸方向に 9.0 m拡大します。

底辺の位置を合わせます。
Bone ボーンを選択した状態でZ軸方向に 4.0 m移動します。

この時点で横から見ると、このような形になっています。

ボーンをメッシュのカット位置に合わせて分割します。
Bone ボーンを選択した状態で[アーマチュア -> 細分化]を実行します。

分割数を[8]に設定すると、以下のようにメッシュのカット位置とボーンのヘッダ位置が重なるように分割されます。

[3Dビューのシェーディング]を[ワイヤーフレーム]にすると、メッシュのカット位置の確認ができます。

要注意

今回は予め決められた手順を踏めば、メッシュのカット位置とボーンのヘッダ位置が重なるようにしました。
もし、自身で作成したモデルでアニメーションを綺麗に変換する場合には、メッシュオブジェクトの変形させたい頂点の節目にボーンのヘッダを細かく合わせて編集する必要があります。

頂点グループの作成

次に各ボーンが追従するメッシュ位置の目安となる「頂点グループ」をメッシュオブジェクトに設定していきます。

最初にボーンの名称と対応付く頂点グループをメッシュオブジェクトに作成します。
[アウトライナー]ウィンドウから Cylinder オブジェクトを選択し、Ctrl キーを押したまま、Armature オブジェクトを選択して複数選択の状態にします。

複数選択の状態で、[オブジェクト -> ペアレント -> アーマチュア変形 空のグループで]を実行します。

すると、Cylinder オブジェクトと Armature オブジェクトが親子関係で関連付けられます。
ここでは親子関係の設定は目的ではないので、そのまま[オブジェクト -> ペアレント -> 親子関係をクリア]を実行します。

すると親子関係は解除され、[アウトライナー]ウィンドウ上の状態は元に戻りますが、メッシュオブジェクトに追加された「頂点グループ」は残った状態となります。
これでメッシュオブジェクトに各ボーンの名称の頂点グループを追加できました。

頂点と頂点グループの関連付け

現在の状態は頂点グループを作成しただけで、どの頂点がどの頂点グループに属しているかを設定していません。
Cylinder オブジェクトの[編集モード]に入り、各頂点に頂点グループの重みづけを行います。

各ボーンに合わせて節目の頂点を全て選択して、これらの頂点に対応ボーンと同名の頂点グループを割り当てます。
[オブジェクトデータ]タブの[頂点グループ]パネルでボーンと同名の頂点グループの[割り当て]を行います。

頂点にどの頂点グループが割り当てられているかは[3Dビュー]の[アイテム]のサイドバーで確認できます。

同じ手順で全ての頂点にそれぞれの頂点グループを割り当てていきます。

全ての頂点に頂点グループを割り当てたら、モデル作成は完了です。
これでアニメーションの変換準備が整いました。

次はアニメーションの作成と変換を行います。
bluebirdofoz.hatenablog.com

Blender 2.8のカーブモディファイアを使ってカーブに沿って動くアニメーションを作成する

本日は Blender 2.8 の小ネタ枠です。
Blender 2.8のカーブモディファイアを使ってカーブに沿って動くアニメーションを作成する手順を記事にします。

アニメーションを行うメッシュオブジェクトを作成する

カーブオブジェクトに沿って変形するメッシュオブジェクトを作成します。
今回は Sphere オブジェクトを縦方向(Z軸方向)に延ばしたメッシュオブジェクトで試します。

[オブジェクトモード]で[追加 -> メッシュ -> UV球]で Sphere オブジェクトを追加します。

追加した Sphere モデルを[編集モード]の[拡大縮小]で以下のように変形しました。

アニメーションの経路となるカーブオブジェクトを作成する

次にアニメーションの経路となるカーブオブジェクトを作成します。
ここでは分かりやすいよう円の経路を回り続けるアニメーションで試します。

[オブジェクトモード]で[追加 -> カーブ -> 円]で BezierCircle オブジェクトを追加します。

動きが分かりやすくなるように[調整パネル]から円の半径を 10 mに設定して経路を大きくしました。

視点を上方からの視点にして経路を確認します。

メッシュオブジェクトにカーブモディファイアを設定する

[3Dビュー]または[アウトライナー]ウィンドウから最初に作成した Sphere オブジェクトを選択して[モディファイア]プロパティを開きます。

[モディファイアを追加]のプルダウンを開き、[カーブ]モディファイアを選択します。

カーブモディファイアが追加されます。
参照する[オブジェクト]に先ほど経路として作成した BezierCircle オブジェクトを指定します。

これで Sphere オブジェクトが BezierCircle オブジェクトに合わせて変形するようになります。

今回は伸ばした縦方向(Z軸方向)に沿った形で変形してほしいので[変形する軸]に[Z]軸を指定します。

メッシュオブジェクトの位置を移動させる

メッシュオブジェクトのZ軸の値がカーブオブジェクトでの変形位置に紐づいています。
このため、メッシュオブジェクトのZ軸座標の位置を変更すると、カーブオブジェクトにおける位置が変わります。

・Sphere オブジェクトの座標が Z軸:0.0m のとき

・Sphere オブジェクトの座標が Z軸:10.0m のとき

キーフレームを設定してアニメーションを作成する

メッシュオブジェクトを経路に沿って移動・変形させる準備は整いました。
後は時間遷移に合わせてZ軸位置のキーフレームを挿入して、アニメーションを作成します。

[タイムライン]の現在キーを[0]の位置に設定した状態で、Sphere オブジェクトの[位置:Z]を[0.0 m]の状態で右クリックして[キーフレームを挿入]でキーを設定します。

キーを操作して確認したところ、[位置:Z]が[62.8 m]のとき、凡そ綺麗にオブジェクトが一周します。
[タイムライン]の現在キーを[250]の位置に設定した状態で、Sphere オブジェクトの[位置:Z]を[62.8 m]に変更した状態で右クリックして[キーフレームを挿入]でキーを設定します。

アニメーションを綺麗にループさせたい場合は、最後のキーフレームの位置と[終了]のフレーム番号を合わせておきます。

アニメーションの確認

[再生]ボタンをクリックしてアニメーションを確認します。
カーブに沿ってオブジェクトが変形し、移動するアニメーションが作成できました。

後は通常の Blender の手順でアニメーションをレンダリングして動画に出力します。

因みに円でなくても、カーブオブジェクトであれば同様の手順で様々な変形が可能です。
記事の初めに添付したようなグネグネとしたカーブオブジェクトの経路による変形と移動も可能です。

カーブモディファイアについては以下の記事も参考にしてみてください。
bluebirdofoz.hatenablog.com