色々な WebAR を実験しています。
基本的にはスマホ前提となります。
中には今は動かないものもあるかもしれません。
緑の箱が回ってるだけ
🎥 動画を見る
super-mario-box_min.mov
※ 音が結構うるさいので注意です
マリオの音楽再生とはてなボックス
🎥 動画を見る
multi-object_min.mov
オブジェクトを生成してその位置のマップを表示する
🎥 動画を見る
shooter_min.mov
体の周りを回るオブジェクトをタップで撃ち落とす
カメラで写真を撮る
🎥 動画を見る
写真を撮った時に音が出ます（結構うるさいので注意です）
draemon_min.mov
※ 音が結構うるさいので注意です
キャラクターと一緒に写真を撮る
🎥 動画を見る
※ AR.jsが使っていた Heroku の CORS 対策サイトが動かなくなった影響で動かなくなってます。 AR.jsのイメージトラッキング
※ AR.jsが使っていた Heroku の CORS 対策サイトが動かなくなった影響で動かなくなってます。
AR.jsのイメージトラッキングで画像を認識したらリダイレクトさせる 画像トラッキングのイベントはここを参考にした
※ AR.jsが使っていた Heroku の CORS 対策サイトが動かなくなった影響で動かなくなってます。
AR.jsのイメージトラッキングで画像を認識したら動画を表示させる Youtubeは指定できないみたいなので、動画をmp4とかにしてサーバーにおく必要がある
🎥 動画を見る
color-dropper.mov
カメラで色を取得する
カメラの真ん中にある１ドットの色を取って画面に表示しています。
カラーコードや色味の評価をテキストで出しています（色味の評価はライティングとかで結構ブレるので見直しが必要）
🎥 動画を見る
multi-tap_min.mov
スマホでシングルタップだとオブジェクトを移動させる。
マルチタップだと縮小、拡大、回転、移動ができるUI
URLに mode=test があればヘルパーが表示されます
openssl req -newkey rsa:2048 -new -nodes -x509 -days 3650 -keyout key.pem -out cert.pem
http-server -S -C cert.pem