Upgrade to Pro — share decks privately, control downloads, hide ads and more …

PhotonでOculusAvatarを動かす方法

 PhotonでOculusAvatarを動かす方法

1abc6d5a9efeae182b35d95836ba70e5?s=128

Keizo Nagamine

July 17, 2019
Tweet

Transcript

  1. Photonで OculusAvatarを 動かす方法 @KzoNag XRミーティング 福岡 2019年7月17日 #XRMTG #福岡XR部

  2. 自己紹介 ながみね @KzoNag Jollystics Inc. / 福岡XR部 Unityを触っていることが多い XR/インタラクティブ/モバイル 5

  3. 発端 6 前にGoで試した OculusAvatarをマルチ プレイできるサンプルを Questでも試したかった

  4. Questでは動かせないことが発覚! 中で利用してるP2P通信などの機能はアプリIDを発行しないと使えない しかしデベロッパーサイトでのアプリ作成でPlatformをQuestにできない Questアプリの企画審査に通過する必要がある!? だがしかし 7

  5. そこで 8 https://developer.oculus.com/documentation/avatarsdk/latest/concepts/avatars-sdk-intro/ https://www.photonengine.com/ja-JP/PUN

  6. ドキュメントがあります https://doc.photonengine.com/ja-jp/pun/current/demos-and-tutorials/oculusavatarsdk 9

  7. 今日の話の目的 ドキュメントはOculus AvatarとPhotonを知ってることが前提 コピペしたら動いたけど中身の理解のハードルはやや高そう いろいろ触ってチョット分かってきたので共有します 10

  8. Oculus Avatar Oculusが提供するアバターの仕組み Rift(S)/Go/Quest + SteamVRなどでも動かせる AvatarSDKで自作アプリに導入できる 11 https://developer.oculus.com/documentation/avatarsdk/latest/concepts/avatars-sdk-intro/

  9. Oculus Avatar SDK Asset StoreでOculus Integrationを入れたらAvatarSDKも入る (以前は各種SDKの個別版も配布してたけど今は全部入りだけっぽい?) 12

  10. LocalAvatar (シンプルなサンプル) 一人称視点と三人称視点の2つのアバターオブジェクト LocalAvatarはプレハブになっているのですぐに使える 13 Little_LocalAvatar LocalAvatar

  11. LocalAvatarとRemoteAvatar 16 LocalAvatar HMDとコントローラーの情報 をもとにアバターを制御 RemoteAvatar シリアライズされたアバター データをもとにアバターを制御

  12. LocalAvatarとRemoteAvatar 17 LocalAvatar RemoteAvatar アバター データ HMDとコントローラーの情報 をもとにアバターを制御 シリアライズされたアバター データをもとにアバターを制御

  13. RemoteLoopback (シンプルなサンプル②) LocalAvatarから取得したアバターデータを RemoteAvatarに流し込むサンプル 18 RemoteAvatar LocalAvatar

  14. LocalAvatar → アバターデータ 19 void Start() { LocalAvatar.RecordPackets = true;

    LocalAvatar.PacketRecorded += OnLocalAvatarPacketRecorded; } void OnLocalAvatarPacketRecorded(object sender, OvrAvatar.PacketEventArgs args) { using (MemoryStream outputStream = new MemoryStream()) { BinaryWriter writer = new BinaryWriter(outputStream); ... byte[] avatarData = outputStream.ToArray(); SendPacketData(avatarData); } }
  15. アバターデータ → RemoteAvatar 20 void ReceivePacketData(byte[] data) { using (MemoryStream

    inputStream = new MemoryStream(data)) { BinaryReader reader = new BinaryReader(inputStream); int sequence = reader.ReadInt32(); OvrAvatarPacket avatarPacket; ... LoopbackAvatar.GetComponent<OvrAvatarRemoteDriver>().QueuePacket(sequence, avatarPacket); } }
  16. マルチプレイの構成 21 アバター データ アバター データ アバター データ アバター データ

    PlayerA PlayerB LocalAvatar LocalAvatar RemoteAvatar RemoteAvatar ネットワーク経由のデータの 送受信をどうするか
  17. PlatformSDKのP2P通信を利用してアバターデータを送受信 ルーム制御やボイスチャットなどOculusRooms的な機能が実現されてる SocialStarter(しっかりしたサンプル) 22 XR部のメンバーに手伝ってもらって アバターが動くことを確認した

  18. Photon マルチプレイゲームに必要なネットワーク機能を提供するサービス 無料プランあり Unity向けパッケージ : Photon Unity Networking (PUN) 25

    https://www.photonengine.com/ja-JP/PUN
  19. ネットワークオブジェクト 26 PhotonView 同期するコンポーネントを監視する役割 同じViewIDを持つ相手と同期する オブジェクトの所有権などの情報も持つ Photon***View 同期するコンポーネント TransformやRigidbodyなどは用意されている 自作することも可能

  20. ネットワークオブジェクトの生成 27 Client1 Client2 Instantiateを実行して オブジェクト生成 Client1に合わせて オブジェクト生成 ViewID=1 ViewID=1

    PhotonNetwork.Instantiate(prefabName, position, rotation); Cube Cube
  21. ネットワークオブジェクトの同期 28 Client1 Client2 プレイヤー操作で 移動 Client1に 同期して移動 ViewID=1 ViewID=1

  22. IPunObserbable 29 PhotonViewの監視対象となるインターフェイス public class PhotonAvatarView : MonoBehaviour, IPunObservable {

    public void OnPhotonSerializeView(PhotonStream stream, PhotonMessageInfo info) { if(stream.IsWriting) { byte[] data = null; stream.SendNext(data); } if(stream.IsReading) { byte[] data = (byte[])stream.ReceiveNext(); } } } ここでLocalAvatarのアバターデータを送信 受信したアバターデータを RemoteAvatarに流し 込む
  23. 異なるプレハブ間の同期 30 ViewID=1 ViewID=1 LocalAvatar RemoteAvatar PhotonAvatarView PhotonAvatarView Client1 Client2

    こういう状態にしたい
  24. 異なるプレハブ間の同期(手順) 31 ViewID=0 LocalAvatar PhotonAvatarView Client1 Client2 ①通常のInstantiateでオブジェクト生成

  25. 異なるプレハブ間の同期(手順) 32 ViewID=1 LocalAvatar PhotonAvatarView Client1 ②手動でViewIDを割り当て

  26. 異なるプレハブ間の同期(手順) 33 LocalAvatar PhotonAvatarView Client1 Client2 ③ViewIDを指定して生成イベント発行 ViewID=1 ViewID=1で 生成して

  27. 異なるプレハブ間の同期(手順) 34 ViewID=1 LocalAvatar RemoteAvatar PhotonAvatarView PhotonAvatarView Client1 Client2 ④指定されたViewIDでオブジェクト生成

    ViewID=1
  28. そんなこんなでできたもの 36 https://twitter.com/KzoNag/status/1149360901205610497?s=20

  29. Have a nice avatar life!

  30. CREDITS Special thanks to all the people who made and

    released these awesome resources for free: ▪ Presentation template by SlidesCarnival ▪ Photographs by Unsplash 38