Azure Spatial Anchors クイックスタート をやった

Azure Sptial Anchors クイックスタートをやりました。
※ 描画がうまくいきませんでした。
対処法ご存知の方いらっしゃればご共有いただけると助かります。

開発環境

  • HoloLens2
  • Windows 10 pc
  • Unity 2019.4.1f1

クイックスタート

Azureポータルにアクセス
image.png
リソースの作成をクリック
Spatial Anchors で検索 > クリック
image.png
作成
image.png
各項目を埋めて作成をクリック
image.png
作成が完了すると下の画面になるのでリソースに移動をクリック
image.png
アカウントドメインとアカウントIDをコピーしてメモ
https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_1264045_74076e26-2b03-9eb0-fed9-ef2f2a16d006.png
アクセスキーに移動し主キーをコピーしてメモ
image.png
azure-spatial-anchors-sampleを開いてver2.8.1をダウンロード
image.png

ダウンロードが完了したら解凍して Unity Hubを起動
リストに追加をクリック azure-spatial-anchors-samples-2.8.1 > Unity を選択
image.png

azure-spatial-anchors-samples-2.8.1 を起動
File > BuildSettings を開く
image.png
Universal Windows Platform を選択
TargetDevice を HoloLens に変更
SwitchPlatform をクリック
完了したら BuildSettings を閉じる
image.png
Project > Assets > Resources > spatialAnchorConfig
Inspector から先ほどメモした AzureSpatialAnchors アカウント情報を入力
image.png

動作確認

File > BuildSettings を開いて
Buildをクリック > 適切なフォルダーを選択してビルド
image.png

Configure Azure Spatial Anchors Session
Start Azure Spatial Anchors Session
Tap a surface to add the Local Anchor.
Save Local Anchor to cloud
Saving local Anchor to cloud...
Stop Azure Spatial Anchors Session
Create Azure Spatial Anchors Session for query
Start Azure Spatial Anchors Session for query
Look for Anchor
Looking for Anchor...
Delete Anchor
Stop Azure Spatial Anchors Session for query
Restart demo

上の順番にデモが進んでいきます。


【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4

全部で4記事です。
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4

前回
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3

サウンドにリバーブ効果を追加

AudioMixerウィンドウを開く
Groups > Master の上で右クリック Add child group を選択
image.png

追加したグループの Addをクリック > SFX Reverb を選択
image.png
image.png
Inspector から SFX Reverb の設定を変更
DryLevel を最小
Room を 最大
image.png
Quad に RoomEffectSendLevelコンポーネントを追加
Hierarchy > Quad > AddComponent("RoomEffectSendLevel")
image.png
RoomEffectsendLevelプロパティを 約-30Dbに変更
image.png

Project からSpatializeOnOff を開いてコメントアウトを解除
image.png

Hierarchy > Quad を選択して Inspector > SpatializeOnOff を開く
RoomEffectGroup 、 MasterGroupプロパティに AudioMixer をセット
image.png

動作確認

File > Build Settings > Build
適切なフォルダを選択してビルド
image.png

音にリバーブ効果が追加されているか確認しましょう。
お疲れさまでした。


【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3

全部で4記事です。
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4

前回
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2

ボタンに立体音響の切り替え機能を追加

Project で右クリック Create > C#Script
名前を SpatializeOnOff に変更
image.png
下のコードを貼り付け、保存

[crayon-6178f75fcd977292503356/]

Quad に SpatializeOnOffコンポーネントを追加
Hierarchy > Quad > AddComponent("SpatializeOnOff")
image.png
SpatializeOnOff の Button Text Object に "PressableButtonHoloLens2" をセット
image.png
Hierarchy > PressableButtonHoloLens2 > Intractable を開く
Events OnClick() の+アイコンをクリックしてイベントを追加
追加したイベントのオブジェクトに Quad をセット
関数に SpatializeOnOff > SwapSpatialization() をセット
image.png

動作確認

File > Build Settings > Build
適切なフォルダを選択してビルド
image.png

続き
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4


【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2

全部で4記事です。
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4

前回
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1

ビデオを追加

公式チュートリアルのビデオをダウンロード
Assets > Import new Asset から ダウンロードしたビデオをインポート
image.png
image.png
Project から ビデオを選択
Inspector で Transcodeにチェックを入れる
Codec > H264
Bitrate Mode > Low
Spatial Quality > Medium Spatial Quality
image.png
Hierarchy で 右クリック > Video > Video Player を選択
image.ng
Hierarchy で 右クリック > 3D Object > Quad を選択
image.png
Quad の Transform を変更
Position X:0 Y:0 Z:2
Rotation X:0 Y:0 Z:0
Scale X:1.28 Y:0.72 Z:1
image.png
Project で 右クリック > Create > Render Texture
image.png
作成したRender Texture の設定を変更
Size > 1280×720
Depth Buffer > At least 16 bits depth
image.png
Project の RenderTexture をドラッグして Hierarchy の Quad にドロップ
Hierarchy の Quad を選択
Inspector から Shader を Mixed Reality Toolkit/Standard に変更
image.png
hierarchy の Video Player を選択
Inspector から Video Player の設定を変更
Video Clip にダウンロードしたビデオを設定
Loopにチェックを入れる
Target Texture に RenderTexture を設定
image.png
Hierarchy の Quad を選択
Inspector から AddComponent > Audio Source
image.png
Outut に 作成したAudioMixer を設定
Spatialize にチェックを入れる
Spatial Blend を1に変更
image.png
hierarchy の Video Player を選択
Inspector から Video Player の設定を変更
Audio Output Mode > Audio Source
Audio Source > Quad
image.png

動作確認

File > Build Settings > Build
適切なフォルダを選択してビルド
image.png

ビデオをMR空間で再生できます。
音が立体になっているか確認しましょう
続き
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3


【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1

MRTK 立体オーディオのチュートリアルをスクショ付きでやりました。

全部で4記事です。
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その1
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その3
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その4

開発環境

  • HoloLens2
  • Windows 10 pc
  • Unity 2019.4.1f1

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

プロジェクトを作成

image.png

MicrosoftMixedRealityFeatureToolを起動

image.png
持っていない人は下記リンクからダウンロード
https://docs.microsoft.com/ja-jp/windows/mixed-reality/develop/unity/welcome-to-mr-feature-tool

先ほど作成したプロジェクトパスを指定

image.png

Mixed Reality Toolkit Foundation をインポート

Mixed Reality Toolkit Foundation を選択した後 GetFeatures をクリック
image.png
Importをクリック
image.png
Approveをクリック
image.png
その後Unityでインポートが終わると下の画面が表示されるのでApplyをクリック
image.png
※以後この画面が表示されたらApplyをクリックしてください。

設定変更

左上から File > Build Settings を選択
BuildSettings で Universal Windows Platformを選択し、Switch Platformを クリック
プラットフォームの切り替えが完了したら左下のPlayer Settingsをクリック
image.png
Player > Publishing Settings > package name を適切な任意の名前に変更
image.png
下にスクロールして XR Settings > Virtual Reality Supported にチェックを入れる
Virtual Reality SDKs の + アイコンをクリック
Depth Format を 16bitに変更
image.png
TextMeshProをインポート
image.png

シーンの作成

新しいシーンを作成
image.png
Mixed Reality Toolkit > Add To Scene and Configure... をクリック
image.png
Hierarchy の MixedRealityToolkit を選択
image.png
Inspector から "DefaultHoloLens2ConfigurationProfile" のクローンを作成
image.png
Spatial Awarenessを選択
"MixedRealitySpatialAwarenessSystemProfile"と"MixedRealitySpatialAwarenessMeshObserverProfile"のクローンを作成
DisplaySettings > DisplayOption を Occlusionに変更
image.png

Microsoft Spatializerの追加

SpatialAudio.Spatializerをダウンロードしてインポート
Edit > Project Settings をクリック
image.png
Audio > Spatializer Plugin > Microsoft Spatializer を選択
image.png

ボタンを追加

Project > "PressableButtonHoloLens2" を検索
image.png
"PressableButtonHoloLens2.prefab" を Hierarchy に追加
image.png
PressableButtonHoloLens2 の Transform Position を x:0 y:-0.4 z:2 に変更
image.png
Window > Audio > Audio Mixer を選択
image.png
"+" をクリックして新しいオーディオミキサーを作成
image.png
image.png
Hierarchy から PressableButtonHoloLens2 を選択
Inspector > Audio source > Output で先ほど作成したオーディオミキサーをセット
image.png
Spatialize にチェックを入れる
Spatial Blend を1に変更
image.png

動作確認

File > Build Settings > Build
適切なフォルダを選択してビルド
image.png

正面のボタンを押したときの効果音が立体であることを確認
続き
【MRTK】HoloLens2 空間オーディオのチュートリアルのやり方 その2


VScodeのAzureFunctions拡張機能を使って、サーバレスでPython関数を実行してみた

はじめに

HTTPリクエストに応答するPython関数を、VSCodeを利用して作成します。
作成した関数をローカル環境でテストした後、Azure Functionsのサーバレス環境にデプロイして、HTTPリクエストができるかどうか試してみます。

概要

Azure Functionsとは、Microsoft Azureのサービスのひとつで、
Web APIをとても簡単に作れるフレームワークです。

こちらの記事がとても詳しく解説されています。

Azure Functionsでサーバーレスアーキテクチャが何かを理解する:
https://qiita.com/yuhattor/items/f7b2aec5211951dd7622
Azure公式ドキュメント:
https://azure.microsoft.com/ja-jp/services/functions/

ゴール

  • Azure Functions環境をセットアップ
  • Python関数作成
  • ローカル環境で関数を実行
  • Azureにデプロイ

こちらの4項目についてやっていきたいと思います!

1. Azure Functions環境をセットアップ

まず、以下の環境が必要になります。

  • Azureアカウントの作成

こちらから作成できます。

  • Azure Functions Core Tools のインストール

こちらを参考にして Azure Functions Core Tools をインストールします。

  • Pythonをインストールします。

※Azure Functions Core Tools で Python3.9 がプレビューになっているので今回は Python3.8.9 をインストールしています。

  • VSCodeをインストールします。
  • VSCodeにPython拡張機能と、Azure Functions拡張機能をインストールしてください。

上記セットアップが完了しましたら、さっそくPython関数を作成していきます!

2. Python関数作成

セットアップがすべて完了したなら、Python関数を作成していきます。

ディレクトリ作成

  • コマンドプロンプトを起動し、次のコマンドを実行してプロジェクトとローカルのGitリポジトリを作成します。
  • プロジェクト名を入力すると、そのプロジェクト名のフォルダの作成と初期化を実行します。 プロジェクト名がすでにある場合は、フォルダの中身を初期化します。
[crayon-6178f75fce3d0732347167/]
  • ランタイムを選択します。
[crayon-6178f75fce3d7798562228/]
  • 今回はPythonを選択します。 上/下方向キーを使用してPythonを選択し、Enter キーを押します。 終わったらVSCodeに移ります。

VSCodeで関数作成

  1. アクティビティバーのAzureアイコンをクリックし、FUNCTION から [Create New Project] を選択します。
  2. 今回作成する Python関数をどのディレクトリに格納する / 新規ディレクトリを作成するか選択します。今回はコマンドプロンプトから作成した MyFunctionProj のディレクトリを選択しました。
    image.png
  3. 今回利用する言語、Pythonを選択します。Python以外にもC#、Java、TypeScriptなどにも対応しているようです。
    image.png
  4. プロジェクトのテンプレートを選択します。今回はHTTPリクエストの応答をやりたいので HTTP Trigger を選択します。
    その他にも、 Azure Blob Storage Trigger、Azure Queue Storage Trigger などが選択できます。
    image.png
  5. 関数の名前を決めます。
    image.png
  6. この関数の権限を決めます。
    今回は Anonymous を選択します。
    すべてのユーザーが関数のエンドポイントを呼び出すことができるようになります。
    image.png
  7. 関数作成が終わると、左のメニューバーのAzureアイコンから
    作成した関数のフォルダが見られるようになります。
    (赤枠で囲った部分)
    image.png

3. ローカル環境で関数を実行

Azure へのサインイン

作成したPython関数を発行するにはAzureにサインインが必要になります。
Azureのアカウントにサインインすると、サイドバーにアカウントとサブスクリプションが表示されます。
image.png

Azureに作成したコードをデプロイ

Azure上に作成したPython関数をデプロイします。
下記画像の赤枠部分をクリックします。
image.png

  1. アカウントにサインインしていると、サブスクリプションが表示されます。
    今回使用するサブスクリプションを選択します。
    image.png
  2. デプロイ名を決めます。
    image.png
  3. 使用するランタイムを決めます。
    今回はPython3.8を使用します。
    image.png
  4. 作成したPython関数をデプロイするリージョンを決めます。
    基本的に一番近いリージョンを選択するので今回は東日本を選択します。
    image.png
  5. デプロイが完了するとサイドバーに表示されるようになります。
    image.png

関数の実行

作成した関数を F5 キーで呼び出し / 実行→デバック をクリックすると、
ターミナル画面に関数の実行が表示されます。
image.png

[crayon-6178f75fce3e0796900875/]

URLがターミナルに表示されます。
URLを開いて以下の画面が表示されたら成功です!
image.png

Azure上で作成したPython関数が登録されているかチェック

Azure portal上でコードが登録されているかチェックします。

Azure portalにログインし、関数アプリをクリック
登録されていると以下の画面が表示されます。
image.png

さいごに

今回VSCodeのAzure Functions拡張機能を使ってみて、簡単に関数が実行できました。
サーバの構築や保守管理なしでコードのビルド・デバッグ・デプロイができるのは楽ですね。
自動スケーリングや決まった時間にコードを処理するバッチ処理の機能なども備わっているので効率よく開発できるのが、プログラマー的に便利だなと思いました。

参考HP

Azure公式ドキュメント
https://docs.microsoft.com/ja-jp/azure/azure-functions/create-first-function-vs-code-python

https://docs.microsoft.com/ja-jp/azure/azure-functions/functions-run-local?tabs=windows%2Ccsharp%2Cbash#install-the-azure-functions-core-tools


Live Share Extension Packの始め方

はじめに

Live Share Extension Packは、VScodeで複数人で共同編集(コード編集・デバック)ができる拡張機能です。リモートワークでの使用はもちろん、エラーの修正を複数人でフィードバックしながら行う際にも有効です。

Live Share Extension Packに含まれる拡張機能は以下になります。

拡張機能 概要
Live Share 使用しているプログラミング言語や作成しているアプリの種類に関係なく、他のユーザーとリアルタイムで共同で編集・デバックを行うことができます
Live Share Audio 別のツールやサービスを使用せず、VScode内から直接音声通話をすることができます

料金は無料なので、VScodeをインストールした際には最初に入れておくのが良いかもしれません。

ゴール

今回はLive Share Extension Packを導入し、実際に使用するところまで行いたいと思います。

手順

手順はざっくり以下の3つです。

1.インストールする
2. 設定
3. 共同編集

1. インストールする

Live Share Extension Pack

上記のリンクをクリックすると以下の画面が表示されますので、インストールをクリック。

2021-04-23_13h46_40.png

VScode内に下記のアイコンが表示されれば正常に完了しています。

2021-04-23_13h55_57.png

2.設定

Live Share Extension Packを使用するには、アカウントの設定が必要になります。

先ほどのLive Share Extension Packアイコン(画面左)をクリック。
セッション詳細の項目が出てきます。

2021-04-23_14h05_36.png

共有(読み取り/書き込み)をクリックすると、画面上部に「Sign in するアカウントを選択してください」と表示されます。

2021-04-23_14h17_06.png

アカウントは、「Microsoftアカウント」または「GitHubアカウント」の2つから選べるのでお好きな方をお選びください。
(筆者はMicrosoftアカウントを使用します)

2021-04-23_14h23_35.png

アカウントの選択画面に移ります。(MicrosoftならMicrosoft、GitならGit)

2021-04-23_14h24_14.png

下記の画面が表示されればアカウントの設定は完了です。

2021-04-23_14h24_36.png

3. 共同編集

それでは、実際に共同編集を行ってみます。
まずは、編集を一緒にしたい方に招待を送る必要があります。

先ほどのLive Share Extension Packアイコン(画面左)をクリック。
セッション詳細の項目が出てきます。

2021-04-23_14h05_36.png

共有を選択すると今度は共有の招待URLが発行されます
※画面右下に下記が表示されていれば発行されています。

2021-04-23_14h32_27.png

後は発行されたURLをお相手に送れば完了です。

受け取り側はURLをクリックすると以下の画面に移ります。

MicrosoftTeams-image.png

「Live Share for VS codeを開く」をクリック。

MicrosoftTeams-image (1).png

共同編集可能なVScodeに移行しました!
こちらで全ての準備が完了です。

4.便利な機能

コメント

コメントは共有されたVScode内で行えるチャット機能です。
リアルタイムでチャットが可能なので、編集していても他のチャットサービスを使う必要がありませんね!!

2021-04-23_16h43_20.png

参加者をフォローする

共同編集に参加したゲストは、何もしなければホストがフォーカスしているウィンドウに自動的に切り替わり、ホストのカーソル位置や入力を許可できます。
特定の誰かをフォローしたい場合は、Live Share ビューの「Participants」からユーザーを選択し、〇アイコンをクリックするか、コンテキストメニュー(右クリックで表示)の「参加者をフォロー」をクリックしてください。

2021-04-23_16h51_50.png

参加者との音声通話

「Live Share Audio」を使用すると、メンバー同士で会話が可能です。

Live Share ビューの「Start audio call」を選択することで、音声通話の参加や開始が可能になります。

2021-04-23_17h03_37.png

コラボレーションセッションの退席・終了

共同編集を終了したい場合は、Live Share ビューのセッション詳細の書きアイコンをクリックします。

2021-04-23_17h09_19.png

さいごに

実際に使ってみると便利な拡張機能というのが理解いただけるかと思います!

・作業を分担したいとき
・ペアプロをしたいとき
・編集しながらチャットでやり取りしたいとき

などなど活躍する場面は多いと考えられます。
ぜひ、ご活用ください。


【実機あり】MRTK ver2.6.1 の Example を一通り試してみた 2

はじめに

前回の続きです。
実機でないと確認できない部分をまとめました。

MRTK ver2.6.1 の Example 実機なしで確認できない部分を実機で行いました。

環境

  • Windows 10 Enterprise
  • Unity 2019.4.1f1
  • MRTK 2.6.1

Boundary

BoundaryVisualization

VR用の機能です。
プレイエリアの可視化ができるようです。

ハンドトラッキング

HandMenu

LeapMotionHandTracing

Leap Motion Controller が必要です。
持っていないので試せませんでした。

PulseShader

PulseShaderHandMesh

ハンドメッシュをパルスで確認できます。
FPSが下がって動画が取れなかったです。、、、

ReadingMode

Solvers

SurfaceMagnetismSpatialAwareness

SpatialAwareness

SpatialAwarenessMesh


【実機なしで出来る】MRTK ver2.6.1 の Example を一通り試してみた

はじめに

MRTK ver2.6.1 の Example の実機なしで出来る部分をまとめました。
続き
https://qiita.com/h_koya/items/b5924b030b15ce496f3e

環境

  • Windows 10 Enterprise
  • Unity 2019.4.1f1
  • MRTK 2.6.1

Audio

AudioLoFiEffect

AudioOcclusion

Dianostics

アイトラッキング

Target Selection

Navigation

TargetPositioning

Visualizer

Gltf

GLB-Loading

Gltf-Loading

上と同じ感じでGltfを表示できます。
StreamingAssets が必要です。

ハンドコーチ

ハンドトラッキング

HandInteraction

HandInteractionGestureEvent

HandInterasctionRecordArticulatedHandPose

HandInteractionTouchables

NearMenu

Input

Dictation

DisablePointers

InputActions

InputData

PointerResult

PrimaryPointer

SpeachInput

HandJointCharser

PulseShader

PulseShaderSpatialMesh

ScrollingObjectCollection

Solvers

DirectionalIndicator

FollowSolver

Solver

TapToPlace

StandardShader

Clipping

ClippingInstanced

HoverLight

MaterialGellery

Outline

StandardMaterialComparison

StandardMaterials

Utilities

InspectorFields

[InspectorField]属性の説明をしているシーンです。
この属性をつけるとインスペクターから値を編集できるようになります。
[SerializeField]を便利にした感じです。

MixedRealityCapability

プラットフォームとデータプロバイダーによって提供されている複合現実機能の状況が表示されます。


HoloLensマルチユーザーチュートリアルをやりました

はじめに

HoloLens2のマルチユーザー機能のチュートリアルをやりました。

実機がない環境だったのでAzure Spatial Anchorsは行っていません。

開発環境

  • Windows 10 Enterprise
  • Unity 2019.4.1f1
  • MRTK 2.5.3
  • PUN 2 Free 2.29

1章 はじめに

環境設定等を行います。
Azure Spatial Anchors は今回使用しないのでimportしませんでした。

2章 Photon Unity Networking の設定

ここではPhoton2を導入します。
チュートリアル通りに行うことで問題なく導入することができました。

3章 複数のユーザーの接続

この章では複数ユーザーの場所を同期します。
チュートリアル通りに行うことでユーザーの同期ができました。

HierarchyViewの説明

SharedPlayground

GenericNetworkManager.cs で ゲーム開始時にPhotonServerに接続する関数を呼び出しています。

NetworkLobby

PhotonLobby.cs にコールバック用の関数が定義されており、
接続成功時にランダムなRoomに入室するように設定されています。

NetworkRoom

PhotonRoom.cs ゲーム開始時にプレーヤーを表すGameObjectを作成し、入室時にそれを共有しています。

ドキュメント
https://doc-api.photonengine.com/ja-jp/pun/v2/index.html

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

この章ではユーザーに加えて初級チュートリアルで作ったプロジェクトの共有を行います。

5章 Azure Spatial Anchors の共有エクスペリエンスへの統合

保留