Lab 7 in Singapore

Unityでのゲーム開発、プログラミング教育、VR/AR/MR、AI・機械学習に関して。たまにシンガポールのネタも。

WebAR

【WebAR】AR.jsとA-Frameで簡単にWebARを実現 Part.2

前回から AR.jsA-Frame の組み合わせで実現する WebAR を試しています。前回は AR.js公式ページで紹介されている Marker Based WebAR のサンプルプログラムの使用方法を紹介しました。

AR.jsとA-Frameで簡単にWebARを実現 Part.1

今回はこのサンプルプログラムを修正して、以前 WebVRで試したものを WebARで表示してみようと思います。
IMG_1140

続きを読む

【WebAR】AR.jsとA-Frameで簡単にWebARを実現 Part.1

以前 Webブラウザ上で簡単に3D表現が実現できる A-Frame を利用した WebVR を紹介しました。

【A-Frameで簡単にWebVRを実現】

そして、今回からは同じ A-Frame と、WebAR用の JavaScriptライブラリ AR.js を組み合わせた WebAR を紹介 します。
AR Image_035

まず今回は写真にあるように、一番簡単な黒い枠線のあるマーカーを利用した Marker Based WebAR を公式にあるサンプルを使って説明していきます。

続きを読む

【WebAR】A-Frameで簡単にWebVRを実現 Part.2

本ブログでは今まで Unityでの ARアプリ開発の話を多く書いてきましたが、WebAR も書き出そうかと思います。

前回から ARの前に、A-Frame のみで実現できる WebVR を紹介しています。A-Frameとはと言う概要から、A-Frameのサイトにあるサンプルをスマホで実行するまでの方法、プログラムの詳細を説明しました。

【A-Frameで簡単にWebVRを実現 Part.1】

今回は前回のサンプルには含まれない他のいくつかのタグを紹介します。
以下の様に画像ファイル、アニメーション、3Dモデルの表示ができるようなプログラム(HTML)です。
AR Image_024
続きを読む

【WebAR】A-Frameで簡単にWebVRを実現 Part.1

本ブログでは今まで Unityでの ARアプリ開発の話を多く書いてきましたが、WebAR も書き出そうかと思います。

WebARを作成する場合、メジャーでかつ無料なライブラリと言ったら A-Frameと AR.jsです。
これらの利用法を何回かに渡って紹介していきます。

まず今回は ARに入る前に、A-Frame のみで実現できる WebVR の紹介です。
A-Frameのサイトにあるサンプルをスマホで実行すると以下のような形で表示されます。
AR Image_017

続きを読む
Game App from Lab7
GooglePlay_Top_2 (Android) GooglePlay_Top_2 (Android, iOS) GooglePlay_Top_2 (Android, iOS) GooglePlay_Top_2 (Windows) GooglePlay_Top_2 (Android, iOS)
Lab7 blog in English
Sponsored Link
Twitter プロフィール
《シンガポールでARゲーム個人開発中。 主にARに関して情報発信してます。》 VR/AR/MR、Unity、機械学習/AIにも興味あり。それらのシンガポール、東南アジアの情報もあわせて発信中。
Blog Visitors [訪問者数]
  • 累計:

PV [アクセス数]
  • 累計:

Sponsored Link