こんにちは、ARスタートアップMESONでプロデューサー・ディレクターをやっているjujujun110です。 Web ARを実現するためのライブラリ8th Wall。これまでのバージョンではマーカーレスの空間認識のみの対応でしたが、2019/04/17にリリースされたver.11からマーカー認識機能がついたので使い方を見ていこうと思います。 公式のデモ映像 アカウントとデバイスのセットアップ8th Wall はJavaScriptライブラリでありながら有償ソフトウェアであり、自身のサーバーにアプリケーションをアップロードして利用するには費用がかかります。(ローカルで試すだけなら無料) また、利用にはユーザー登録とアプリケーションの作成が必要ですので、チュートリアルを読みながら済ませておきましょう。 次に、ダッシュボードのトップページの右上から、Device Authorizationをクリ
HTMLタグで本格VRコンテンツが作れる! Mozillaが開発した3DライブラリA-Frame WebXRフレームワークの「A-Frame」を使えば、JavaScriptを記述することなく、HTMLにタグを追加するだけでVRコンテンツが作成できます。 次のデモはA-Frameを用いてt作成したオリジナルのVRデモです。中央の円状のカーソルを牛の3Dモデルに重ねることでアニメーションします。 ※パソコンではドラッグ、スマートフォンではジャイロセンサーが検知した傾きで視点が変わります。右下のアイコンをクリックすると、HMDで閲覧できるモードへ切り替わります。 デモを別ウィンドウで開く HTMLをマークアップするようにVRコンテンツを作成しよう VRコンテンツをHTMLのマークアップのように作成するには、JavaScriptライブラリ「A-Frameエー・フレーム」を使用します。「やっぱりJa
スマホ AR を作ろう はじめに 不思議で楽しい AR ニンテンドー3DSの「ARゲームズ」(2011)で「AR」という言葉が一気に知られるようになりました。そしてポケモンGO(2016)の流行で、一気にたくさんの人が AR を利用するようになりました。 AR (Augmented Reality; 拡張現実) は、カメラの映像にCGなどを重ねて表示することで、現実世界を情報で拡張した体験を生む技術です。単純に「不思議」と思える、楽しいものですね。 スマホで AR も簡単に Processing で AR このサイトでも Processing を使って AR アプリを作る方法を紹介しました。パソコンとWebカメラがあれば、簡単に作れることを紹介しました。でも、パソコンだけでなく、スマホでも作りたいですね。もちろん、スマホで AR コンテンツを作る方法はこれまでもありました(例えばこちら)。
こんにちは。 最近の推し漫画はジャンプで連載中の鬼滅の刃なjujunjun110です。基本的に展開はシリアスでよくできているし、その中に突如ぶっこまれるシュールギャグがまた良い。まだ4巻しか出ていないのでぜひ。 さて、先日VRをやっている方を集めた飲み会を開催しまして、参加者の皆様から事前に集めた話題を選ぶために、勉強も兼ねてWebVRフレームワークA-Frameで簡単なサイコロWebアプリを作成したので、その技術について書いてみます。 ↑こんな感じで、おはようからおやすみまで暮らしを見つめてくれそうなテイストのアプリケーションです。 目次 目次 物理演算コンポーネントaframe-physics-system インストール 基本的な使い方 サイコロをころがす サイコロの面を追加する まとめとお知らせ 物理演算コンポーネントaframe-physics-system まず、A-Frameの
2. CAUTION!! 本資料では数多くのデモを行います。お手持ちのデバイスで体験したい方は、ネッ トに接続できる環境をご用意いただき、URLへアクセスください。 <PC> connpassサイトのコメント欄で共有します。以下の環境をご用意ください ブラウザ(Chrome もしくは Firefox) <スマホ> 資料中でQRコードを表示します。以下の環境をご用意ください。 QRコードリーダー ブラウザ(Chrome もしくは Firefox) スマホ本体を動かすため、ご起立の上、周りに気を付けて体験願います。 3. 発表する人 こんな人 杉井 庸一(Youichi Sugii) 昭和51年生まれ(40歳) 福岡在住。今年1月から 単身赴任で広島市西区 に。 バックエンド システムエンジニア。 AIX、Shell、DB2、DataSt
A-FRAMEを使って容易にブラウザで動くVRコンテンツを作れることを知って、もっと(簡単に楽に)ちょっとリッチなものができないかなーと思ってたところでMMDモデルを導入できるJSライブラリを発見しました。 MMDっていうとあれですよ、ニコニコ動画でよく見るMMDですよ。 初音ミクさんとかを3Dモデルにして踊らせられるあのMMDですよ。 MMD杯とか大好きですよ。(特に毎回恒例の弱音ハクのハイキックシリーズとか) というわけで以下の通り、ぽんこつAIユーチューバーの「キズナアイ」ちゃんをモデルに、ちょっと気軽にサクサク作ってみました。 レシピ モデル キズナアイ様 http://kizunaai.com/ キャラクターデザイン:森倉円様 モデリング制作監修:Tda様 モデラー:トミタケ様 (c)Kizuna AI モーション 1.「八極拳 モーション詰め合わせ」より「八極小架」 作者:hi
Web のゲーム開発紹介 Web のゲーム開発紹介 ビデオゲームとの違い ツール Canvas CSS Full screen Gamepad IndexedDB JavaScript Pointer Lock SVG Typed Arrays Web Audio WebGL WebRTC WebSockets WebVR Web Workers XMLHttpRequest ゲーム開発テクニック asm.js の同期スクリプトを利用する 起動パフォーマンスを最適化する ピア通信チャンネルとして WebRTC を利用する Web ゲーム向けの音 2D 衝突検出 タイルとタイルマップの概要 Web上の 3D ゲームの概要 Web上の 3D ゲームの概要 基本の 3D理論の説明 A-Frame Babylon.js PlayCanvas を利用した基本的なデモの制作 Three.js を使った
Subscribe to get updates on A-Frame and our VR projects! Subscribe
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く