CrossRoad

AR、MR、VR、Babylon.jsを中心とした技術ブログ。 If you're non-Japanese native guys, check "English" category.

【2019/8/19追記】xR Tech Tokyo #17 の全講演をまとめてみました

すでに何度か参加報告を書いてますが、昨日、XR系のイベント「xR Tech Tokyo #17」に参加しました。今回はLT枠で発表をさせていただきました。 今回もXRおよび関連技術の発表が興味深かったのでまとめました。他の方のまとめはこちらです。 bibinbaleo.haten…

Edgeブラウザの先行版Canary Channelで搭載されたDOMの3DView機能を試してみました

先日、このようなツイートがありました。 Inspired by @FirefoxDevTools' Tilt feature, we just released the 3D DOM viewer in Edge Dev/Canary builds 1) Enable Developer Tools experiments in about://flags2) Ctrl+Shift+P > "Experiments" > "Enabl…

アプリ開発者目線で、OpenXR1.0のサンプルコードの概要と動作を確認しました

前回、Windows Mixed Reality OpenXR Runtimeについて書きました。 www.crossroad-tech.com このときはソースコードの話がなかったので、今回はOpenXRのサンプルコードを元に動かした話を書きました。 以下の環境で動作を確認しています。 Open XR API (vers…

OpenXR1.0で公開されたMixed Reality OpenXR Runtimeの準備手順をまとめました

OpenXRという規格があります。簡単に言うと、(主に)VRコンテンツを作る手段、VRのためのヘッドセットが多数あるので、ハードウェア、ソフトウェアの双方の開発を楽にしようという規格です。2019年の3月にバージョン0.9の仕様が公開され、先日1.0になりました…

Babylon.jsでOculus Questのコントローラを使ってオブジェクトを移動させる方法

Babylon.jsはWebVRコンテンツを作る仕組みが色々と揃っていますが、コントローラでオブジェクトを移動させる機能は入っていません。 そこで、Babylon.jsのメソッドを利用して作りました。今回は作り方を紹介します。 1. Babylon.jsにはコントローラのrayが当…

Babylon.jsでglb形式の建物モデルを読み込み、Oculus Questでテレポート移動させる方法

Babylon.jsでOculus Questのコントローラ入力の方法がわかってきたので、今度はテレポート移動を試してみました。 このようになります。 今回はこのテレポート移動を実現するための方法だけでなく、表示した博物館のモデルを読み込む手順も書きました。 1. …

Babylon.jsでOculus Questコントローラの入力を取る方法

Babylon.jsを使ってOculus Questのコントローラ周りを色々と調べています。 コントローラの表示はできても、各ボタンの入力を取るための具体的な方法が見つからなかったので、まとめてみました。 1. コントローラの表示はOculus Touchだが、全ボタンの入力を…

【2018/6/26更新】令和最初のxR Tech Tokyo #16 の全講演をまとめてみました

XR系のイベント「xR Tech Tokyo #16」に参加しました。ブロガー枠での参加というのもあり、講演内容をまとめました。 他にまとめられてる方のリンクです。 xR Tech Tokyo #16メモ - トマシープが学ぶ 1. xR Tech Tokyoとは? 2. 講演(30min session) 2.1. …

Babylon.jsをビルドしてローカル環境を作り、他の端末からアクセスする方法

Babylon.jsは、通常CDN(Contents Delivery Network)を使うなどして、必要なjavascriptを呼ぶだけで使うことができます。 しかし、それだとBabylon.jsそのものに変更を加えることができません。 今回はBabylon.js自体をビルドし、その結果を実行する方法を解…

【2019/6/26 更新】Babylon.jsでOculus Questのコントローラを任意のモデルに変更する方法

2019/6/26 追記 デフォルトのTouchコントローラのモデルが残ってしまう問題の解決方法を追記しました。 Babylon.jsでVRコンテンツを作り、VRヘッドセットでアクセスすると、コントローラもVR空間に表示されます。 ただし、5月に発売したばかりのOculus Quest…

Babylon.jsで360度画像を回転させる方法

以前、Babylon.jsのWebVR機能について書いたとき、360度画像をみられる"photoDome"という機能を少しだけ紹介しました。 Babylon.jsのWebVRモードと通常モードを切り替える方法 - CrossRoad 今回、このような問い合わせがありました。 @WheetTweet はじめまし…

VRMとアニメーションで勘違いしていたことを整理しました

前回、VRM形式のキャラクタモデルをWebブラウザで表示させる方法を解説しました。 【2019/7/21更新】Babylon.jsでVRMモデルを読み込み、Oculus Questで表示させるまでの手順をまとめました - CrossRoad これはアニメーションを入れていないので当然ですが止…

【2019/7/21更新】Babylon.jsでVRMモデルを読み込み、Oculus Questで表示させるまでの手順をまとめました

最近、vrmという規格に興味があって調べていたところ、株式会社バーチャルキャストがBabylon.jsに対応したbabylon-vrm-loaderを公開したことを知りました。 VRM は Unity 専用じゃない!ブラウザで VRM 表示出来るものを作りました! | VirtualCast Blog Git…

ARCore1.9の新機能一覧と、WebブラウザでARがつかえるScene Viewerの環境構築手順

ARCoreが1.9になりました。代表的な機能として、WebブラウザでもARCoreの機能が使えるようになる「SceneViewer」が導入されました。 今回はScene Viewerを試すための環境構築手順をまとめました。 動作環境は以下の通りです。 Android 9.0 iOS 12.2 1. ARCor…

Azure Spatial Anchorsにかかるコストについて

先日、Azure Spatial Anchorsの使い方を調べました。 公式ドキュメントを元に、Azure Spatial AnchorsをiOSとAndroidで試してみた - CrossRoad 数日後、Azure Portalにログインしたところ、1日約200円のペースで課金されており、原因はAzure Spatial Anchors…

F8 2019のUnlocking the Future of WebXRの内容をまとめました

先日、Facebook主催のカンファレンス「F8」が開催されました。 Facebook Developer Conference. April 30 - May 1, 2019.San Jose, CA. この中ではXR関係もいくつか発表がありました。代表的な発表はOculus Quest、Rift Sなどの発売日と価格ですが、実はWebX…

A meetup report : highlight of xR Tech Tokyo #15 in Japan

The other day I attended a large XR meetup in Tokyo, Japan. The meetup name is "xR Tech Tokyo #15". I reported about the event because it is worth reporting to overseas XR communities. 1. What is xR Tech Tokyo? 2. A new style VR visual nov…

【2019/8/18更新】平成最後のxR Tech Tokyo #15 の全講演をまとめてみました

昨日、XR系のイベント「xR Tech Tokyo #15」に参加しました。XR関係のゲームからBtoBまでの動向を知りたかったので、発表内容をまとめました。 多数の発表があったため文章量が多いですが、記録も兼ねているのであえて全発表を記載しています。また、発表中…

Tips of dual camera "VuzeXR" for camera beginners

日本語記事はこちらです。 180度と360度撮影ができるカメラ「VuzeXR」でつまづいた箇所と解決方法 - CrossRoad I bought a new dual camera "VuzeXR". Several posts introduce about VuzeXR. Here is a good example. Review: Vuze XR shoots solid VR180 v…

180度と360度撮影ができるカメラ「VuzeXR」でつまづいた箇所と解決方法

新しい360度カメラ「VuzeXR」を買いました。VuzeXRについては下記のブログで色々と紹介されています。私も参考にさせていただきました。 独立型戦闘支援ブログ | by @torikasyu しかし、カメラ初心者の私には、この情報でもつまづくところが多かったです(自…

Slideshareの諸々の問題が、MacからWindows10に変えたら解決したお話

先日、発表スライドをSlideshareにアップロードしたところ、アップロードが終わらないという問題が発生しました。 他にもいくつかありましたが、MacではなくWindowsにすると全て解決しました。せっかくなので、状況を整理しておきます。 検証時の環境 MacOSX…

勉強会での発表にiPadを使うとき、事前に準備すべき4つのこと

先日、Microsoft MVPの集まりで日本のコミュニティを紹介する機会がありました。発表にはいつもノート PCを使うのですが、今回はiPadを使ってみました。 しかし、iPadでのプレゼンは思ったようにできませんでした。。 とはいえ、iPadの方が軽くて便利だし、…

アプリ開発者目線から、OpenXRの発表内容とOpenXR API、Runtimeについて調べてみました

GDC2019で、KhronosからOpenXRに関する新しい発表がありました。 Khronos Releases OpenXR 0.90 Provisional Specification for High-performance Access to AR and VR Platforms and Devices - The Khronos Group Inc しかし、ちょっと読んだだけだと、Open…

【2019/3/16リンク追記】XR Nights #7 Looking To The Future Of VRに参加、運営お手伝いをしました

2/27にXR Nightsというイベントに参加、運営お手伝いをしました。日本では少し珍しい、英語ネイティブによるXRコミュニティのイベントですので、内容を簡単に紹介いたします。 1. XR Nightsとは? 2. 当日のイベント概要 3. 講演 3.1 Using Brain-Computer I…

公式ドキュメントを元に、Azure Spatial AnchorsをiOSとAndroidで試してみた

先日、Mobile World Congress (MWC)でMicrosoftよりいくつかの新発表がありました。 体験でわかった「HoloLens 2」。視野拡大と“両手で操作”が快適 - AV Watch Introducing Azure’s augmented reality: spatial anchors | InfoWorld 発表の1つに、Azure Spa…

Oculus GoでBabylon.jsを使ったときに、没入型と通常VRモードを切り替える方法

前回、PCのような2Dスクリーンで、Babylon.jsのVRモードと通常表示をキーボードで切り替える方法を紹介しました。 Babylon.jsのWebVRモードと通常モードを切り替える方法 - CrossRoad これだとVRヘッドセットを使うときもキーボード接続が必要になります。そ…

【2019/3/16講演スライドリンク追記】xR Tech Tokyo #14 で聴いた講演内容をまとめてみました

本日、XR系のイベント「xR Tech Tokyo #14」に参加しました。有益な情報が多かったので勉強会の内容をまとめてみました。 1. xR Tech Tokyoとは? 2. 講演内容 2.1. バーチャルライブプラットフォーム「INSPIX」を支える技術とその活用法 2.1.1 INSPIXとは?…

How to switching mode between WebVR and 2D view in Babylon.js

Japanese version is here Babylon.jsのWebVRモードと通常モードを切り替える方法 - CrossRoad Babylon.js provides Web VR sample codes. Here is an example of Windows Mixed Reality. Babylon.jsでWindows Mixed Realityヘッドセットのアプリを作る方法 …

Babylon.jsのWebVRモードと通常モードを切り替える方法

English version is here How to switching mode between WebVR and 2D view in Babylon.js - CrossRoad Babylon.jsを使うと、以前紹介したようにWebVRコンテンツも開発できます。 Babylon.jsでWindows Mixed Realityヘッドセットのアプリを作る方法 - Cross…

Babylon.jsとDayDreamを使って、ChromeのWebVR機能を使うためのTipsについて

以前、Babylon.jsのWebVRについて調べたことがあります。 Babylon.jsでWindows Mixed Realityヘッドセットのアプリを作る方法 - CrossRoad そのときはWindows Mixed Realityヘッドセットを使いましたが、今回はモバイルVRであるDayDreamで試しました。結果、…