Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ARKit+Vuforia+UNETでマルチプレイAR
Search
Keizo Nagamine
February 10, 2018
Programming
1
4.1k
ARKit+Vuforia+UNETでマルチプレイAR
FUKUOKA Engineers Day 2018の発表資料です
Keizo Nagamine
February 10, 2018
Tweet
Share
More Decks by Keizo Nagamine
See All by Keizo Nagamine
福岡XR部でのHubs活用事例報告っ!
kzonag
0
190
ついに届いたNreal! -サンプルランチャーを作ってみた-
kzonag
0
260
福岡XR部の紹介と最近のオンライン活動
kzonag
0
2.2k
ZoomとHubsの繋げ方
kzonag
0
680
VTuberになるために必要な要素技術
kzonag
0
130
リアルと重ねるVR
kzonag
0
2.6k
PhotonでOculusAvatarを動かす方法
kzonag
0
520
UnityでOculuQuest入門
kzonag
0
1.2k
XRのおさらいと最近ホットな話題
kzonag
0
120
Other Decks in Programming
See All in Programming
What's new in Spring Modulith?
olivergierke
1
130
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
180
The Flutter Journey of Building a Live Streaming App — With a Side of Performance Tuning
u503
1
100
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
540
CI_CD「健康診断」のススメ。現場でのボトルネック特定から、健康診断を通じた組織的な改善手法
teamlab
PRO
0
200
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
260
階層構造を表現するデータ構造とリファクタリング 〜1年で10倍成長したプロダクトの変化と課題〜
yuhisatoxxx
3
960
技術的負債の正体を知って向き合う / Facing Technical Debt
irof
0
130
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
480
iOSアプリの信頼性を向上させる取り組み/ios-app-improve-reliability
shino8rayu9
0
160
Things You Thought You Didn’t Need To Care About That Have a Big Impact On Your Job
hollycummins
0
210
デミカツ切り抜きで面倒くさいことはPythonにやらせよう
aokswork3
0
220
Featured
See All Featured
Making Projects Easy
brettharned
119
6.4k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Done Done
chrislema
185
16k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
A designer walks into a library…
pauljervisheath
209
24k
The World Runs on Bad Software
bkeepers
PRO
71
11k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Transcript
ARKit+Vuforia+UNET でマルチプレイAR
株式会社Jollystics所属 だいたいUnity ときどきXamarin(≒C#er) アプリ、インタラクティブ、XR 今年から「ゆにくえ福岡」という 初心者向けのUnity相談会を毎週やってます 最近やってるゲーム ディヴィニティ:オリジナル・シン エンハンスド・エディション 自己紹介
長峰慶三 @KzoNag
はじめに ▪ Unityで作ってます ▪ デモしたい!!
マルチプレイAR って何ですか?
AR Augumented Reality 拡張現実
Augmeted Reality, 拡張現実 現実環境をコンピュータで認識し、 情報を付与するなどして拡張する技術 現実環境の認識手法として、 ・マーカー認識 ・カメラ・センサーによる 自己位置推定・環境測定 ・GPSからの位置情報
などがある
マルチプレイ 複数人で遊ぶやつ
マルチプレイ コンピューターゲームにおいて、複数人 のプレイヤーが一緒にプレイすること 以下のようなパターンがある ・インターネット経由で別端末と通信 ・オフラインで別端末と通信 ・1端末で画面分割
マルチプレイAR 複数人が一緒に体験できるAR
マルチプレイAR 複数人が一緒に体験できるAR どのプレイヤーから見ても同じ時間 ・場所に同じ情報が付加される お互いの位置情報を共有している プレイヤーによるインタラクションが 他プレイヤーに反映される (例:イスを回転する) ※HoloLensのシェアリングの機能はコレ
Place your screenshot here Share World Demo 壁の文字からワールドにログイン ログインすると空間に存在するオブ ジェクトを視認可能に
複数のプレイヤーが同じワールドに ログイン プレイヤーはオブジェクトを発射す ることができる 発射されたオブジェクトはワールド 上に存在するため他プレイヤーも視 認可能
Vuforia ARKit UNET 3つの要素
Vuforia ARKit UNET 3つの要素
iOS11で導入されたフレームワーク 主にできること↓ ▪ 自己位置推定 ▪ 平面検出(水平,垂直)※垂直面はiOS11.3から ▪ 照明光推定 ▪ 前面カメラでの顔・表情の認識
※iPhoneXのみ Unityで使うプラグインが公開されている ARKit
ARKitによる自己位置推定 (Visual Inertial Odometry、VIO、視覚慣性オドメトリ) カメラとジャイロや加速度などのセンサーを組み 合わせて、デバイスの移動・回転をトラッキング 分かるのは開始地点からの相対位置 現実環境における絶対位置が分かるわけではない
ARKitによる自己位置推定 (Visual Inertial Odometry、VIO、視覚慣性オドメトリ) トラッキング開始 開始地点からの位置・姿勢 Pos(1,2,3) Rot(30, 10, 20)
移動
Vuforia ARKit UNET 3つの要素
Vuforia AR開発プラットフォーム iOS,Android,UWP(HoloLens) カメラ画像ベースのトラッキング 様々な認識ターゲット ▪ 平面画像 ▪ 直方体や円柱といった立体 ▪
CADなどの3Dデータ Unity2017.2からVuforiaが統合された Vuforia7からは平面検出もできるように
画像を検出すると画像との相対位置が分かる Vuforiaでの画像ターゲットによるトラッキング 画像からの位置・姿勢 Pos(1,2,3) Rot(30, 10, 20)
Vuforia ARKit UNET 3つの要素
UNET Unityに用意されたネットワークシステム 高レベルAPIと低レベルAPIがある 高レベルAPIはマルチプレイに必要とされる ほとんどの共通要件をカバーする(らしい)
UNETの高レベルAPIの特徴(あんまり分かってない) ▪ サーバー処理もUnityで実装 ▪ サーバー/クライアント方式 ▪ サーバー兼クライアントのホストにもなれる ▪ 汎用データシリアライズ ▪
ネットワークメッセージ送受信 ▪ クライアントからサーバーにコマンド送信 ▪ サーバーからクライアントにRPC ▪ サーバーからクライアントにイベント送信
サーバーとクライアントがいる サーバー クライアントA クライアントB クライアントC
サーバーを介して変数を同期する val = 5 val = 5 val = 5
val = 5
クライアントからサーバーに関数を実行させる(コマンド) SetPos(5)を 実行して
サーバーからクライアントに関数を実行させる(RPC) ShowResult() を実行して
クライアントの1つがサーバーを兼ねることも可能 クライアントA クライアントB クライアントC サーバー ホスト
やってること
None
各クライアントと専用のサーバーマシンを用意 (今回は同一LAN内で) クライアント クライアント サーバー
それぞれの位置・姿勢情報を クライアント間で同期 Pos(-1,2,3) Rot(30,10,5) Pos(2,1,5) Rot(20,15,0) ARKit + Vuforia
クライアントからサーバーにアクションを通知 画面をタップしたよ
サーバーからクライアントに オブジェクト生成を通知 オブジェクト生成 オブジェクト生成
オブジェクトの状態はサーバーが管理して 各クライアントと同期 Pos(-1,2,3) Rot(30,10,5) Pos(-1,2,3) Rot(30,10,5)
位置・姿勢の同期
ARKitの自己位置推定を使いたいけど・・・ Pos(-5,6,1) Rot(60,5,10) Pos(1,4,6) Rot(0,15,30) クライアントB クライアントA
固有の座標系での値なので Pos(-5,6,1) Rot(60,5,10) Pos(1,4,6) Rot(0,15,30) 座標系A 座標系B クライアントB クライアントA <座標系A>
<座標系B> この値をそのまま Aに送ると、、、
位置が合わない 座標系A クライアントB クライアントA Pos(1,4,6) Rot(0,15,30) クライアントB? <座標系A>
Vuforiaの画像ターゲットを配置 座標系A 座標系B
認識するとターゲットとの位置関係が分かる = ターゲットを基準とした共通の座標系 座標系A 座標系B Pos(-1,2,3) Rot(30,10,5) Pos(2,1,5) Rot(20,15,0) <座標系V>
<座標系V> 座標系V
各座標系でのターゲット位置を逆算できる = 座標変換が可能 座標系A 座標系B Pos(-4,4,-2) Rot(30,-5,5) <座標系A> Pos(-1,3,1) Rot(-20,0,30)
<座標系B> Pos(-1,2,3) Rot(30,10,5) Pos(2,1,5) Rot(20,15,0) <座標系V> <座標系V> 座標系V この値をAに送る
位置が合った! 座標系A Pos(-4,4,-2) Rot(30,-5,5) <座標系A> Pos(2,1,5) Rot(20,15,0) <座標系V> 座標系V <座標系A>
Pos(-2,5,3) Rot(50,10,5)
位置・姿勢の同期 ▪ 画像ターゲットで共通の座標系を用意 ▪ ARKitで自己位置を取得 ▪ 共通の座標系に変換 ▪ UNETで送信 ▪
受け取った座標を固有の座標系に変換 ▪ 実際はプレイヤーオブジェクトを 画像ターゲットの子にすることで簡素化
困ったところ ❖ ARKitとVuforiaを同時に有効にできない ➢ はじめにVuforiaで認識、認識したらVuforiaを 切ってARKitをオンにすることで対処 ➢ 切り替え時にカメラ画像がチラつくので演出で目立 たないように
DEMO
まとめ ▪ ARKitで自分の位置をトラッキング ▪ Vuforiaで座標系を合わせる ▪ UNETで情報を同期する でマルチプレイARができました!
次のステップ ▪ 精度の向上・内容を充実 ▫ ちょっとズレるのをなんとかしたい ▫ 撃ち合いとかゲームっぽくしたい ▪ マルチプラットフォーム ▫
AndroidやHoloLensも入れるはず ▫ なんならポジショントラッキングできなくても Vuforiaの画像が見えてれば入れるのでは ▪ いろんな情報を共有 ▫ HoloLensの環境マップとか ▫ 各種センサーを置いてサーバー側から送るとか
ありがとうございました! 休憩時間に体験できます!
CREDITS Special thanks to all the people who made and
released these awesome resources for free: ▪ Presentation template by SlidesCarnival ▪ Photographs by Unsplash