Speaker Deck
Speaker Deck Pro
Sign in
Sign up
for free
PhotonでOculusAvatarを動かす方法
Keizo Nagamine
July 17, 2019
Technology
0
180
PhotonでOculusAvatarを動かす方法
Keizo Nagamine
July 17, 2019
Tweet
Share
More Decks by Keizo Nagamine
See All by Keizo Nagamine
kzonag
0
69
kzonag
0
120
kzonag
0
1.1k
kzonag
0
140
kzonag
0
67
kzonag
0
950
kzonag
0
710
kzonag
0
85
kzonag
0
160
Other Decks in Technology
See All in Technology
kurochan
0
530
noir_neo
0
120
unifa_dev
0
300
shimacos
2
280
line_developers
PRO
2
1.2k
shomaekawa
2
990
iqbocchi
0
520
oracle4engineer
1
210
greymd
0
600
clustervr
0
170
tsuyo
0
180
vkbaba
0
100
Featured
See All Featured
brad_frost
156
6.4k
destraynor
146
19k
eitanlees
111
9.9k
shlominoach
176
7.4k
smashingmag
229
18k
zenorocha
297
39k
tenderlove
52
3.4k
geoffreycrofte
18
770
jeffersonlam
328
15k
shpigford
165
19k
jacobian
255
20k
malarkey
192
8.5k
Transcript
Photonで OculusAvatarを 動かす方法 @KzoNag XRミーティング 福岡 2019年7月17日 #XRMTG #福岡XR部
自己紹介 ながみね @KzoNag Jollystics Inc. / 福岡XR部 Unityを触っていることが多い XR/インタラクティブ/モバイル 5
発端 6 前にGoで試した OculusAvatarをマルチ プレイできるサンプルを Questでも試したかった
Questでは動かせないことが発覚! 中で利用してるP2P通信などの機能はアプリIDを発行しないと使えない しかしデベロッパーサイトでのアプリ作成でPlatformをQuestにできない Questアプリの企画審査に通過する必要がある!? だがしかし 7
そこで 8 https://developer.oculus.com/documentation/avatarsdk/latest/concepts/avatars-sdk-intro/ https://www.photonengine.com/ja-JP/PUN
ドキュメントがあります https://doc.photonengine.com/ja-jp/pun/current/demos-and-tutorials/oculusavatarsdk 9
今日の話の目的 ドキュメントはOculus AvatarとPhotonを知ってることが前提 コピペしたら動いたけど中身の理解のハードルはやや高そう いろいろ触ってチョット分かってきたので共有します 10
Oculus Avatar Oculusが提供するアバターの仕組み Rift(S)/Go/Quest + SteamVRなどでも動かせる AvatarSDKで自作アプリに導入できる 11 https://developer.oculus.com/documentation/avatarsdk/latest/concepts/avatars-sdk-intro/
Oculus Avatar SDK Asset StoreでOculus Integrationを入れたらAvatarSDKも入る (以前は各種SDKの個別版も配布してたけど今は全部入りだけっぽい?) 12
LocalAvatar (シンプルなサンプル) 一人称視点と三人称視点の2つのアバターオブジェクト LocalAvatarはプレハブになっているのですぐに使える 13 Little_LocalAvatar LocalAvatar
LocalAvatarとRemoteAvatar 16 LocalAvatar HMDとコントローラーの情報 をもとにアバターを制御 RemoteAvatar シリアライズされたアバター データをもとにアバターを制御
LocalAvatarとRemoteAvatar 17 LocalAvatar RemoteAvatar アバター データ HMDとコントローラーの情報 をもとにアバターを制御 シリアライズされたアバター データをもとにアバターを制御
RemoteLoopback (シンプルなサンプル②) LocalAvatarから取得したアバターデータを RemoteAvatarに流し込むサンプル 18 RemoteAvatar LocalAvatar
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); } }
アバターデータ → 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); } }
マルチプレイの構成 21 アバター データ アバター データ アバター データ アバター データ
PlayerA PlayerB LocalAvatar LocalAvatar RemoteAvatar RemoteAvatar ネットワーク経由のデータの 送受信をどうするか
PlatformSDKのP2P通信を利用してアバターデータを送受信 ルーム制御やボイスチャットなどOculusRooms的な機能が実現されてる SocialStarter(しっかりしたサンプル) 22 XR部のメンバーに手伝ってもらって アバターが動くことを確認した
Photon マルチプレイゲームに必要なネットワーク機能を提供するサービス 無料プランあり Unity向けパッケージ : Photon Unity Networking (PUN) 25
https://www.photonengine.com/ja-JP/PUN
ネットワークオブジェクト 26 PhotonView 同期するコンポーネントを監視する役割 同じViewIDを持つ相手と同期する オブジェクトの所有権などの情報も持つ Photon***View 同期するコンポーネント TransformやRigidbodyなどは用意されている 自作することも可能
ネットワークオブジェクトの生成 27 Client1 Client2 Instantiateを実行して オブジェクト生成 Client1に合わせて オブジェクト生成 ViewID=1 ViewID=1
PhotonNetwork.Instantiate(prefabName, position, rotation); Cube Cube
ネットワークオブジェクトの同期 28 Client1 Client2 プレイヤー操作で 移動 Client1に 同期して移動 ViewID=1 ViewID=1
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に流し 込む
異なるプレハブ間の同期 30 ViewID=1 ViewID=1 LocalAvatar RemoteAvatar PhotonAvatarView PhotonAvatarView Client1 Client2
こういう状態にしたい
異なるプレハブ間の同期(手順) 31 ViewID=0 LocalAvatar PhotonAvatarView Client1 Client2 ①通常のInstantiateでオブジェクト生成
異なるプレハブ間の同期(手順) 32 ViewID=1 LocalAvatar PhotonAvatarView Client1 ②手動でViewIDを割り当て
異なるプレハブ間の同期(手順) 33 LocalAvatar PhotonAvatarView Client1 Client2 ③ViewIDを指定して生成イベント発行 ViewID=1 ViewID=1で 生成して
異なるプレハブ間の同期(手順) 34 ViewID=1 LocalAvatar RemoteAvatar PhotonAvatarView PhotonAvatarView Client1 Client2 ④指定されたViewIDでオブジェクト生成
ViewID=1
そんなこんなでできたもの 36 https://twitter.com/KzoNag/status/1149360901205610497?s=20
Have a nice avatar life!
CREDITS Special thanks to all the people who made and
released these awesome resources for free: ▪ Presentation template by SlidesCarnival ▪ Photographs by Unsplash 38