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
すたみと3登壇資料.pdf
Search
Yuki Homma
September 09, 2019
Design
0
170
すたみと3登壇資料.pdf
Yuki Homma
September 09, 2019
Tweet
Share
More Decks by Yuki Homma
See All by Yuki Homma
Designship2019_AR / Spatial Experience Design
hommy1014
4
2.9k
Other Decks in Design
See All in Design
組織の右腕として共創する ー デザインと経営の二つの視点から見えた、新しい支援のかたち/ Designship2025_Nishimura
root_recruit
0
280
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
1.9k
アイデアを加速させる!Firefly ボードで発想の幅を広げよう
connecre
1
310
越境するデザイン人材:デザイナーが社会資本となる世界へ
goodpatch
1
510
“ことば”が苦手なデザイナーへの処方箋 「なんとなく」から「意図」へ、 デザインを動かす言葉の力
mixi_design
PRO
1
200
一次体験を起点にしたUX改善の取り組み / Direct Experience Driven UX Improvements
bitkey
PRO
0
380
2026年、デザイナーはなにに賭ける?
0b1tk
0
480
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは?~操作を減らし、成果を最大にするための設計~
ncdc
0
120
Meet, Learn, Grow × AI ― コミュニティで加速するスキル循環 「コミュニティと関わり方」
tame
1
370
デザインするために「多様性」について考える
iflection
0
190
Liquid GlassとApp Intents
touyou
0
820
プロダクトデザイナーに学ぶ、『見る気が起きる』ダッシュボードの作り方 / Creating Engaging Dashboards: Lessons from Product Designers
yamamotoyuta
2
520
Featured
See All Featured
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
200
How to build a perfect <img>
jonoalderson
1
4.9k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
89
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.2k
How STYLIGHT went responsive
nonsquared
100
6k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
57
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.7k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.1k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Odyssey Design
rkendrick25
PRO
1
500
GraphQLの誤解/rethinking-graphql
sonatard
74
11k
Transcript
ˇ 【すたみと#3 特別編】 夏のxR⾃由研究発表祭
2 本間悠暉 @y__homm ⾃⼰紹介 MESON ディレクター/デザイナー Spatial時代のユースケースとUXをつくる会社MESONに ディレクター/デザイナーとして所属。 Twitterやnoteにて⾃分のアイデア・プロトタイプ、 体験を拡張するプロダクトをハントして発信中。
ONWARD:『PORTAL』, 博報堂:AR City, 共同研究第2弾 Twitter URL
3 ⾃分のアイデアをARですぐ形にできる プロトタイピング!! 本⽇のテーマ
4 本⽇持ち帰ってほしいこと! アイデア プロトタイプ⼿法 TORCH ARとFigmaを⽤いた ARプロトタイプ⼿法を シェアします! ⽇々のアイデア⼒を鍛える& すらすらアイデアを出す
ための⼿法を共有します! ARプロダクトのプロトタイプづくりの2要素!
5 プロトタイプ動画
6 プロダクト開発のサイクル ⽬標の設定、必要な要素の洗い出し、アイデア決定、プロトタイプ作成、デモの発表 というサイクルを何周も回していく Goal Key factor Idea Proto Demo
show
7 共同研究における開発サイクル ⽬標設定とその要因の洗い出しはnoteを読んでいただけると! Goal Key factor Idea Proto Demo show
8 共同研究における開発サイクル 今⽇はアイデア出しとプロトタイプ作成について説明! Goal Key factor Idea Proto Demo show
9 1. アイデア
10 とっておきアイディエーション…!
Spatial ⼤喜利 インスタントアイデアブレスト法
Spatial ⼤喜利 インスタントアイデアブレスト法 ⾃分 ARおじさん
Spatial ⼤喜利 Spatial花⽕!! インスタントアイデアブレスト法
Spatial ⼤喜利 Spatial花⽕!! AR時代は、 みんなが花⽕を打ち上げ 年末年始やお盆は 街中がAR花⽕だらけに!! インスタントアイデアブレスト法
Spatial ⼤喜利 Spatial天気の⼦!! インスタントアイデアブレスト法
Spatial ⼤喜利 Spatial天気の⼦!! 将来はSNS上の 友⼈たちの感情とリンクして ARエフェクトで ⾬が降ったり、晴れたり、 感情の共有できる! インスタントアイデアブレスト法
17 AR⼤喜利のコツはとにかくポップに繰り返し続けること! 思った5倍くらい脳が柔らかくなるのでおすすめです!
アイデアの例
19 2. プロトタイプ
使⽤ツール 使⽤するツールはFigmaとTorch デザインツール (PC) ARプロトタイプツール (iPhone, iPad)
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 21 1. 体験フローを考える 対象物体の検知 ARWikiの表⽰ アプリ起動
03 04 01 Wikiの選択 02 体験フローを洗い出します
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 22 1. 体験フローを考える 対象物体の検知 ARWikiの表⽰ アプリ起動
03 04 01 Wikiの選択 02 ⾮AR体験と、AR体験フローを考えていきます ⾮AR体験 AR体験
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 23 2. ⾮AR体験をかんがえる Figmaを⽤いて、画⾯をデザインします!
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 24 2. ⾮AR体験をかんがえる 画⾯遷移をプロトタイピングします!!
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 25 2. ⾮AR体験をかんがえる Figmaでのデザインを学びたい⽅は、こちらの⽅の記事を参考に! https://note.mu/fjkn
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 26 3. AR体験のプロトタイピング TORCHはノンコーディングで 3Dオブジェクトの配置/インタラクションをデザインするツール
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 27 3. AR体験のプロトタイピング プロジェクトを作成 プロジェクトX
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 28 3. AR体験のプロトタイピング 体験シーンを作成 シーン1 シーン2
シーン3 プロジェクトX
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 29 3. AR体験のプロトタイピング 3Dオブジェクトや写真、動画をシーンに配置 シーン1 シーン2
プロジェクトX シーン3
- その場で、ランウェイに登 場する服の素材感を知るこ とができる 30 3. AR体験のプロトタイピング オブジェクトや、シーン遷移のインタラクション決める シーン1 シーン2
シーン3 プロジェクトX
31 TORCH内で、できること 3Dモデル 動画/写真 PNG, SVG(UIパーツ) Q. どんなものを配置できるの? 天球型写真
32 TORCH内で、できること カメラフォルダ 端末内フォルダ Dropbox Q. どこから配置できるの? Skechfab Poly
33 TORCH内で、できること イメージトラック GAZE Approach Q. どんなインタラクション(⼊⼒)が可能なの? Tap
34 TORCH内で、できること 移動 回転 ⾊を変える Q. どんなインタラクション(出⼒)が可能なの? ETC,,,
35 TORCHをうまく組み合わせると…? こんなことができるように!
36 おもしろいxRアイデアをかたちにしていきましょう! (質問ありましたら気兼ねなく懇親会で聞いてください)
37 ご静聴ありがとうございました!
38 おまけ
39 プロトタイピングが重要な理由 空間的・⽴体的な体験であるARサービスのUXや仕様 は作りながらでないと決められないため、⾼速でプロ トタイピングしながら設計の解像度を上げていく必要 がある Fixをさせないサービスデザインが必要 プロトタイプによるトライ&エラーとブラッシュアッ プは際限なくできてしまうので、最初に期限を決めて その時点までの最適解を定め、改善サイクルを回すが
重要 終わりからはじめる開発スタイル AWEで発表されていたGoogleのAR開発⼿法
アイデアシート
インスタントアイデアブレスト法① Spatial (3Dのインタラクションを持つ) (3Dオブジェクトを⽤いた) (HyperSpaceを⽤いた) × Instagram Google Dropbox LINE
Airbnb Facebook Spotify