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エー・フレーム」を使用します。「やっぱり
スマホ 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の
A-FRAMEを使って容易にブラウザで動くVRコンテンツを作れることを知って、もっと(簡単に楽に)ちょっとリッチなものができないかなーと思ってたところでMMDモデルを導入できるJSライブラリを発見しました。 MMDっていうとあれですよ、ニコニコ動画でよく見るMMDですよ。 初音ミクさんとかを3Dモデルにして踊らせられるあのMMDですよ。 MMD杯とか大好きですよ。(特に毎回恒例の弱音ハクのハイキックシリーズとか) というわけで以下の通り、ぽんこつAIユーチューバーの「キズナアイ」ちゃんをモデルに、ちょっと気軽にサクサク作ってみました。 レシピ モデル キズナアイ様 http://kizunaai.com/ キャラクターデザイン:森倉円様 モデリング制作監修:Tda様 モデラー:トミタケ様 (c)Kizuna AI モーション 1.「八極拳 モーション詰め合わせ」より「八極小架」 作者:hi
このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。 PDߪ�View in English �gު�Always switch to English WebVR API と WebGL API によって、ウェブブラウザー内で仮想現実 (VR) 体験を作成し始めることが可能になっていますが、コミュニティはもっと簡単に作れるツールやライブラリーが現れるのを待っています。Mozilla の A-Frame フレームワークは、ウェブ開発者が慣れ親しんでいるシステムを用いて 3D VR 空間を構築するマークアップ言語を提供しています。このシステムはゲーム開発のコーディング原則に従っています。これはプロトタイプやデモを、大量の JavaScript や GLSL を書かずに、迅速にうまく構築するのに役立ちます
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く