Babylon.jsハンズオン延長戦!マーカーを使ったスマホARにトライ!

2

今回は2月に開催したBabylon.jsハンズオンの延長戦!

まとめ Babylon.jsではじめるHoloLens 2 / Meta Quest対応WebXR入門 https://xr-fukuoka.connpass.com/event/270139/ 3402 pv 21 2 users 24
FumiyaHr @fit51

ZapWorksを使うっぽい 気になっていたのでわくわく #AR_Fukuoka

2023-03-01 19:27:34
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka イメージトラッキングのサポートもあるんだけどWebXRに対応してるAndroidじゃないとできないらしい できるだけ多くの端末で体験できるようにしたい OpenCVの方法もあるらしい 対応しているマーカーはアルコマーカーというらしい pic.twitter.com/vhBchor5DA

2023-03-01 19:34:55
拡大
拡大
拡大
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka 今回のサンプルはDiscordから取りに行ってね zpt拡張子のものとfigure.glbを使う予定 pic.twitter.com/KQa1yToRnU

2023-03-01 19:38:42
拡大
FumiyaHr @fit51

Babylon.js x ZapWorks の組み合わせのお話 #AR_Fukuoka

2023-03-01 19:38:42
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka テキストエディタでindex.htmlを作ったらサンプルコードをコピペして保存 これで素材はOK pic.twitter.com/Mw0u1npEBJ

2023-03-01 19:44:00
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka VS CodeでOpen Folder さっき内容を揃えたフォルダを指定 読み込まれる pic.twitter.com/8IA8Tqg2F1

2023-03-01 19:45:27
拡大
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka 描画を決めたら中身へ onload createScene addObjectsの3ブロック構成 pic.twitter.com/Dd3VPFxWes

2023-03-01 19:49:04
拡大
拡大
拡大
拡大
FumiyaHr @fit51

VS CodeのプラグインのLive Sever便利! #AR_Fukuoka

2023-03-01 19:54:10
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka zapworksの読み込み 6行目 create sceneのカメラ作成のところ カメラを作ってカメラアクセスの許可を求める pic.twitter.com/MMJ3sfCuSL

2023-03-01 20:01:24
拡大
拡大
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka マーカーの追従に関する制御を書く markerTracker マーカーの定義と紐付くファイルを指定する pic.twitter.com/KjskD3zFpW

2023-03-01 20:09:09
拡大
拡大
拡大
拡大
FumiyaHr @fit51

画像に結構いい感じに追従する #AR_Fukuoka

2023-03-01 20:13:30
えいとびーと @eightbeat8b

#AR_Fukuoka Babylonjsハンズオン! 画像に追従してARの箱が動いた!すげ・・・ pic.twitter.com/Ch57UIP5yg

2023-03-01 20:14:21
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka zapworksへのアップロード ログインしてcreate project ユーザーのアクセス方法をQRに指定 コンテンツアップロードのボタンを押す pic.twitter.com/UCFHfZs5Jq

2023-03-01 20:16:02
拡大
拡大
拡大
拡大
じゅん@3/15XRミーティング北海道エリアのお世話 10/22💉5 @jun_mh4g

#AR_Fukuoka 二つをzipに固める それをサイトにアップロード バージョン名を決める 今回は0.0.1 Publish pic.twitter.com/XMj3ffqdfS

2023-03-01 20:17:20
拡大
拡大
拡大