Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
XRの近況とUX/UIについて
Search
Akinen
February 27, 2023
Design
0
380
XRの近況とUX/UIについて
This slide provides an organized introduction to the characteristics of UX/UI in the XR space.
Akinen
February 27, 2023
Tweet
Share
More Decks by Akinen
See All by Akinen
AI時代に淘汰されないデザインのしごと
akinen
1
150
3D空間を扱うUI表現とユーザビリティ
akinen
0
1.1k
FigmaとBeziではじめるXRUIプロトタイピング
akinen
1
840
Vue.jsでChrome拡張機能をつくった話 / Created a Chrome extension in Vue.js
akinen
2
1.1k
Other Decks in Design
See All in Design
株式会社バクタム 会社説明資料
bactum
0
260
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.9k
FigmaのFigmaファイルから学ぶTips & Tricks
hilokifigma
0
560
Building foundations 堅牢なデザイントークンの設計
hilokifigma
2
3.6k
Cyber Heart Online Book
hjnasby
0
150
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
trivia
0
500
今日から意識できるアクセシビリティ
fumiko
0
280
UXとUIの違いを自分の言葉で表現する: UX DAYS TOKYO
mizunashi_mana
0
190
デザインから開発まで一貫したデザインシステムを構築するベストプラクティス / Best Practices for Building a Consistent Design System from Design to Development
lycorptech_jp
PRO
0
330
freee + Product Design FY25Q4
freee
4
15k
AIの実践とコミュニケーションデザインの意義 / AI practice and the significance of communication design
bebe
0
680
真・altはつけるだけじゃなくて -alt属性の考察 2025年版-
securecat
5
1.6k
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
70
11k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Code Review Best Practice
trishagee
69
19k
Visualization
eitanlees
146
16k
Side Projects
sachag
455
43k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
108
19k
Transcript
XRの近況と UX/UIについて 2023/02/28 Akinen Generated by midjourney
VR・AR、 やってますか? 個人的な取り組みと、 そこから得た知見についてご共有します。 以下は私見であり不正確な推測を含む場合があります。
近年、 広告・PR目的ではあるものの、 VRプラットフォーム上への出展事例が増えつつある。 金融・損保業界の取り組み
マルチデバイスでアクセス可能なプラットフォームと、 そのユーザー数は着実に増えつつある Fortnite、 VRChat、 Clusterなど 「メタバース」 と呼ばれるプラットフォームが増えつつある。 VRChatについては80億円の資金調達。 ClusterやREALITYなど、 スマホからアクセス可能なアプリも人気に。
一方で、 NFTと絡めてメタバース上の土地を売るバーチャル原野商法も流行。 端末の処理速度が飛躍的に向上し、 誰でもスマホで3Dが動かせるようになった 2000年代の 「セカンドライフ」 の時代と比べて、 ハード面の技術進化が進み、 できることが増えつつある。 HMDについては画質と重さがネックだったが、 近年高画質化・軽量化が進みつつある。 (最近だとパナソニックのMeganeX、 HTCのVive XR Eliteなど) 現実的なVR・ARの事業化は、 まだ検証段階 さまざまな領域、 医療や建築の分野でも研究が進んでいる。 ただし、 現時点ではゲームや配信が中心であり若い世代が多いため、 エンタメ系以外の企業が事業として成立させるレベルには至っていない。 主な普及の阻害要因としては ①常用するコンテンツの不足、 ② 「かける」 習慣が定着していないこと が挙げられる。 XR(VR, AR, MR)の流行
XRによる課題解決の事例 https://www.startupticker.ch/en/news/almer- technologies-begins-series-production-of-its- augmented-reality-glasses ARグラスにはカメラが内蔵されており、 専門家が現場作業員を技術サポート。 遠隔保守のほかにも、 遠隔損傷評価、 遠 隔トレーニング、
遠隔試運転、 医療支援、 作業員誘導、 倉庫での経路最適化など 作業員の遠隔支援(Zurich) NAVITIMEが提供する運転支援システム AiRCAM。 ARで道路交通情報を表示し、 運転者に危険な状況を通知する。 スマホをフロントに設置する必要があり、 ストアの評価は二分している模様。 https://static.cld.navitime.jp/automostorage/ servicestorage/html/aircam.html 運転の危険予知・ガイド https://mavic.ne.jp/automotiveindustry-3dscan- faro/ 交通事故や災害の現場をカメラで撮影・ 転送し、 その3DデータをHMDで確認する ことで遠隔地からも損害調査が可能。 「Luma AI」 では、 1分間iPhoneで動画を 撮影するだけで3Dデータが作成できる。 3Dスキャンで損害調査
AIによるコンテンツ不足の解消 Text to Imageの応用で、 スカイボックス (天球用環境マップテクスチャ)を生成。 数秒で任意の世界を作成できる。 Text To Skybox
Promptから3Dモデルを生成するAIで、 NVIDIAやGoogleが研究している。 上手 く生成できるオブジェクトはまだ少ない。 Text to 3D 大規模言語モデルと合成音声を使って、 アバターとの自由な会話が実現できる(可 能性がある)。 Text to Speech + GPT 多大な労力・時間が必要だったコンテンツ制作をAIで自動化する時代へ
XRUIのプロトタイピング 業務外でプロトタイプをつくってみました ダッシュボードUI(AR) 商品購入UI(VR)
つくる・調べる中で得た気づき
従来のデバイスとの体験の違い
XRにおけるUIは、 WebよりゲームUIが近い 大きく透明なディスプレイを眼前に置き、 ユーザーの通常の視界に重ねて情報を 表示する手法。 計器などの情報を見るために視線を動か す必要がなく、 現実では戦闘機などに実 装されている。 HUD
(Head Up Display) ユーザーの関心を惹くために表示される UIのこと。 常に表示されるわけではなく、 目的地の ある方向を画面に表示したり、 アイテムに 近づくと詳しい情報が表示される。 POI (Point of Interest) ダイエジェティック = 物語世界内に属し ているUI。 UIに現実のオブジェクトや表 現を取り入れる手法のこと。 何を3D化して、 何を2DのUIにするかは情 報量に応じて検討する必要がある。 (常に 空間上に表示されるため) Diegetic UI
UIデザインのポイント 画面サイズが自由でウインドウが不要。 ユーザーが自由に動き回れるため、 平面 ではなく3D空間でのインタラクションを 考慮する必要がある。 場合によっては、 ボタンではなくVUI(音 声UI)で操作する方法も考えられる。 3D空間にUIを「置く」
BlenderやUnityよりも手軽に作って試せ る 「Sprine」 や 「Bezel」 といった3Dモデ リングツールが登場しています。 Figmaのように複数人で作成でき、 VRで URLにアクセスするとすぐにモデリングし たものを閲覧可能です。 プロトタイピング 視野角のこと。 VRでは没入感にも影響す るため、 HMDの評価ポイントの1つ。 UIを作成する際は視界に入るか、 ユー ザーとの距離感、 UIの存在に気づけるか 等を考慮する必要がある。 FOV (Field of View)
まだまだ模索中
テーマ 「XRにおけるデザイン・開発の先行調査」 ① Design: UX/UIの調査 XR空間ではどのようなUIが望ましいか? 入力手段とそのインターフェイスの調査 ※ AI・セキュリティなどをテーマにした、 有志による研究会 やらないこと
「Web3」 「NFT」 「メタバース」 ② Dev: プロトタイピング ・Unityを用いたプロトタイピングによって、 実際の体験やXR開発のノウハウを蓄積 ・他社事例や新規事業の実現可能性についても調査し、 得られた知見を展開する Cue_Lab参加者募集
私自身もまだ浅学ですが、 ご興味のある方はぜひ小澤までご連絡ください。 Thank You.