はてなブックマーク

WWDC2019でARKit3が発表され、2020年の3月にはARKit3.5が登場しました。 注目の新機能が追加されている一方で、ARKitでデバイスによる機能差異が出てきており、どのデバイスを買えばいいのか悩むケースもあります。 その辺をいい感じにまとめたサイトが見つからなかったため、自分用に一覧にしました。 今後更新していくかは割と気分次第ですが、誤りとかあればコメント等で指摘頂けると幸いです。 ARKitとARCore比較 方向性の違い ARKit 対応デバイス一覧 iPhone iPod iPad ARKitまとめ ARCore 対応デバイス一覧 ARCoreまとめ まとめ（2020/10） ARの開発がしたい方へ ARのサービス利用を考えている方へ ARを楽しみたい方へ 宣伝 ARKitとARCore比較 まず、ARKit3.5とARcore v1.16の主要な機能を比較します

前回の続きで、物体検知＆セグメンテーションのライブラリ調査です。 最終的にはモバイルARで使う想定で評価しています。 ↓前回 jyuko49.hatenablog.com はじめに DeepLabの特徴 DeepLabの環境設定 ライブラリのインストール サンプル実行 コードを読んでみる テストスクリプトの作成 静止画（ローカルファイル） リアルタイム動画 性能比較 実行環境 Mask R-CNN 処理結果 処理時間（sec） DeepLab 処理結果 処理時間（sec） 結果まとめ 今後 はじめに Mask R-CNNをカメラでキャプチャしたリアルタイムの動画に適用したところ、すごくカクカクで思うように速度が出ませんでした。 GPU性能を活かせば速くなるらしいのですが、モバイルARで使うとなると、マシンスペックに頼るのは難しいです。 そこで代替のライブラリを探したところ、以下の動画を見つ

AR x AIで使えそうなMask R-CNNというOSSを教えてもらったので動かしてみました。 github.com Mask R-CNNでできること 環境構築 Jupyter Notebookのインストール 必要ライブラリのインストール COCO APIのインストール コードを読んでみる In[1] In[2]: Configurations In[3]: Create Model and Load Trained Weights In[4]: Class Names In[5]: Run Object Detection 使ってみる 結果の画像を表示する 検知結果の中身を確認する rois masks class_ids scores コードを書く 矩形の描画 ラベルとスコアの描画 マスクの描画 実行結果 完成版のコード 今後 リアルタイムの動画でテストする Unityで使えるか調べ

久々の投稿デス。 WebXRやろうかなと思ったのですが、手持ちのARCore対応デバイスがAndroid7.xのため試せず・・・で気分転換にWebVRをやりました。 はじめに three.jsでVRMを扱う UniVRMでエクスポートする ボーンアニメーションで動かす three.jsのシーンをWebVRに対応させる Daydreamコントローラーを使う Gamepad Extensionsを有効化する Ray Inputで代用する 空間内の移動を実装する まとめ はじめに three.jsに関する基礎知識を持っている前提で書いているので、three.jsをさわったことがない！という方は、他の記事やサイトも合わせて読んでください。 開発環境については、以下となっております。（WiFiルータ経由でローカル通信） Webサーバ Macbook Pro http-server クライアント AS

ARの開発環境では、Unityがデファクトスタンダードだと思いますが、Unityに使いにくさを感じることもあり、Unreal Engineも試してみることにしました。 そもそもなんでUnityを使ってたんだっけ？ Unityのつらみ Unreal EngineのAR対応 ARKit ARCore UEでARプロジェクトを作る プロジェクトテンプレートから作る ARCoreのサンプルプロジェクトを使う その他UE関連 ヒストリアさんのブログが半端ない Unity引っ越しガイド まとめ 結論 そもそもなんでUnityを使ってたんだっけ？ ARを始めた当初（といっても1年半くらい前ですが）、最新のARデバイスと言えばHoloLensとTangoで、ネイティブ環境を除くとどちらも開発環境がUnity一択でした。 元々はUnityを一度も触ったことがなくて、積極的に選択したという訳ではなかったと思い

アプリをストア申請するにあたり、Webサイトがあった方がよさそうだったのでVue.jsで作りました。制作期間は2-3日くらい。 jyuko's playground Vue.js JSフレームワークを選定するにあたり、軽くて扱いやすいライブラリを用いたかったので、Vue.jsにしました。 jp.vuejs.org Angular.jsとReact.jsは今までに触ったことがあるのですが、いずれも学習コストは若干高めに感じましたし、Reactに至ってはJSXとなかなか仲良くなれない。 せっかくならば・・・と使ったことのないVue.jsを試してみたら、かなり良かったです。 Vue.jsの特徴としては、 軽い 扱いやすい 拡張性がある 軽量なライブラリの方が、サイト表示のレスポンスを向上させやすく、AWSなどのクラウドサービスで運用する際に通信量＝コストを抑えられます。 Vue.jsのインストー

先日Vue.jsで制作＆公開したWebサイトは、AWSでお安く運営しています。 Vue.jsでWebサイトをサクッと作る - じゅころぐAR Vue.jsで作ったサイトをPWAに対応させてみる - じゅころぐAR 構成はよくある"静的WebサイトのS3ホスティングパターン"ですが、必要な設定を全部まとめておきたかったので書きます。 構築手順 独自ドメインを取得する SSL/TLS証明書を取得する S3バケットを作成する CloudFrontを設定する Route53にサブドメインを登録する S3アップ時に自動でCache Invaridationを行う 請求アラートを設定する メリット 機能面 コスト面 まとめ 構築手順 2018年4月時点の画面および手順です。 ※Managed ConsoleのUIは頻繁に変わるので注意 独自ドメインを取得する "Route53"を選択し、Domains

2018年はPWA(Progressive Web Application)が注目されつつあるので、先日Vue.jsで作成したWebサイトをPWA対応させてみたいと思います。 jyuko49.hatenablog.com PWAとは？ PWAのメリット SPAのアプリ化が簡単 WebのOSSを使い放題 Webアプリの機能を拡張 PWAに対応する Vue.jsプロジェクトをPWAボイラープレートで作成する アイコンを作る Lighthouseでチェックする PWAを動かしてみる iOS11.3 Android7.0 まとめ PWAとは？ "ホーム画面に追加"を行うことでネイティブアプリのように動作するWebアプリケーションです。オフラインキャッシュで快適に動作したり、Webプッシュ通知が受けられたりします。 Googleが提唱していた技術で、以前から気になってはいましたが、Microsoft