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
夢の技術をユーザーに届ける ~AR×UX×Gameのかけ算実施録~ / Deliver the...
Search
denari
September 13, 2020
Design
1
140
夢の技術をユーザーに届ける ~AR×UX×Gameのかけ算実施録~ / Deliver the Sci-Fi dream
UX JAM All Night の中で登壇をさせていただいた内容になります。
denari
September 13, 2020
Tweet
Share
More Decks by denari
See All by denari
「デザイン」の本質を見なおす / review core of 'design'
denari
3
1k
ぶっちゃけ世の中全て見た目で決まるから。笑 / lol all things are decided by appearance.
denari
2
340
Other Decks in Design
See All in Design
What makes a great Director?
_limex_
0
210
株式会社バクタム 会社説明資料
bactum
0
330
真・altはつけるだけじゃなくて -alt属性の考察 2025年版-
securecat
5
1.7k
デザインの意思決定を加速するワークショップ設計 / Workshop design to accelerate design decision-making
lycorptech_jp
PRO
0
440
【30人中30人が3ヶ月平均180万収入アップ】マズロー安達の弟子、成功事例集
maslow_akkun
0
300
Marpで推しCSSスライドを作ろう! / marp-with-favorite-css
fujiemon
0
570
BPStudy#213〜ビジネスアナリシスとDDD(ドメイン駆動設計)パネルディスカッション資料 / BPStudy213-panel
haru860
0
480
sachi_y_portfolio
sachi337
0
520
デザインシステムの「種」を使って、受託開発を加速させる
akane___ui
0
11k
組織で取り組むアクセシビリティのはじめ方
masakiohsumi
0
180
portfolio.pdf
onof003
0
160
freee + Product Design FY25Q4
freee
4
16k
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
431
66k
Bash Introduction
62gerente
615
210k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Gamification - CAS2011
davidbonilla
81
5.4k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
Automating Front-end Workflow
addyosmani
1370
200k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
187
55k
Rails Girls Zürich Keynote
gr2m
95
14k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
Transcript
在 @denari01 Graffity Inc. AR×UX×Game
@denari01 Gra ty Inc. 在 UX 在 Web Dev denari.link
. ?! . ? . 在 !! . ?! AR×UX×Game
AR ?
"VHNFOUFE3FBMJUZʜ֦ுݱ࣮ײ
None
None
CG
CG →
VR Beat Saber
AR AR
None
None
Ͳ͏ͯ͠ԶΒͷαʔϏε ΘΕͯͳ͍ͷ
None
None
·͞ʹʮݱ࣮Λ֦ுͯ͠Δ͍͍ϓϩμΫτʯ͡Όͳ͍͔
ྲྀߦΒͳ͍ Ϣʔβʔ͕શવ͜ͷΞϓϦΛͬͯ͘Εͳ͍ʜ
ΠϚΠνྲྀߦΒͣɻݱࡏΫϩʔζ͞Ε͍ͯΔʜ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS ཧͯ͠ΈͯΘ͔ΔɺʮΊΜͲ͍͘͞ʯײ֮
None
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS εϚϗͰ"3ΞϓϦΛ࡞Δͱ࣮֬ʹ௨Δεςοϓ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS
None
https://www.youtube.com/watch?v=uTknV2tPwsg
݁Ռɺ"3ΞϓϦͰ ࠓ·Ͱʹ΄΅ͳ͍Ϩϕϧͷ τϥϑΟοΫΛهɻ AR Gra ty ..w
- Ͳ͏ͯ͠ԶΒͷαʔϏε ΘΕͯͳ͍ͷ 在
None
ͳΜͰ͜ͷϓϩμΫτͬͯ ྑ͔ͬͨΜ͚ͩͬ
ॱ෩ຬൕͳΓग़͠ʂ ελʔτΞοϓͱͯ͠ ͕͜͜؊৺ɻ ˠ͜ͷϓϩμΫτΛ࣠ʹ ɹࣄۀΛΈཱͯΔ͜ͱʹ
ͦ͏͔ΜͨΜͰͳ͔ͬͨʜ
ܧଓ͞Εͳ͍ ͜ͷΞϓϦɺϦςϯγϣϯ͕Ͳ͏͍ͯ͠ʜ
Πϯετʔϧೋͷ Ϣʔβʔ͕ͲΕ͚ͩ ϓϨΠͯ͘͠ΕΔ͔ͷσʔλ ˞ը૾ΠϝʔδͰ͢ɻ࣮ࡍϦςϯγϣϯΛݟ·ͨ͠ɻ
Πϯετʔϧೋͷ Ϣʔβʔ͕ͲΕ͚ͩ ϓϨΠͯ͘͠ΕΔ͔ͷσʔλ ˞ը૾ΠϝʔδͰ͢ զʑͷΞϓϦɺҰճ༡ΜͩΒ࣍ىಈ͞Εͳ͔ͬͨʜ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS ༑ୡͱʹ্͕ͬͯ Πϯετʔϧͯ͠ ࣮ࡍʹ༡ΜͰָ͠ΜͰ ཌҎ߱ܧଓʜ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS ༑ୡͱʹ্͕ͬͯ Πϯετʔϧͯ͠ ࣮ࡍʹ༡ΜͰָ͠ΜͰ ཌҎ߱ܧଓʜ ͜͜ͷܧଓ෦͕མͪͯ͠·͏
Ͳ͏ͯ͠ܧଓͯ͠ΘΕͳ͍͔ ήʔϜͱͯ͠ͷΓ͜Έཁૉ͕ͳ͍͔Β ਖ਼֬ʹ࣌ʮ࡞͍ͬͯͳ͍͚ͩʯͰඞཁੑΘ͔͍ͬͯͨ
Γ͜·ΕΔήʔϜͷಛྫ ऩूཁૉ͕͋Δ ରઓ૬ख͕͍Δ ϓϨΠεΩϧ্ָ͕͍͛͠
Ͳ͏ͯ͠ܧଓͯ͠ΘΕͳ͍͔ ϖνϟότʹશͯͳ͔ͬͨ ɾಛʹऩूͰ͖ΔཁૉͳͲӅ͠ཁૉແ͘ ɾͷલʹ༑ୡ͕͍Δͱ͖͔͠ϓϨΠͰ͖ͳ͍ ɾϧʔϧ͔ͳΓ୯ௐͳήʔϜ
Γ͜·ΕΔήʔϜͷಛྫ ऩूཁૉ͕͋Δ ରઓ૬ख͕͍Δ ϓϨΠεΩϧ্ָ͕͍͛͠ ͍ͭ͜ΒʮͲ͏ʹ͔ͳΔͩΖ͏ʯͱࢥͬͨ
Γ͜·ΕΔήʔϜͷಛྫ ऩूཁૉ͕͋Δ ରઓ૬ख͕͍Δ ϓϨΠεΩϧ্ָ͕͍͛͠ ͜Ε͔ͬΓϢʔβʔʹ༡ΜͰΒΘͳ͍ͱʜ
αʔϏεͱͯ͠ͷࠓͷྑ͞कΓͳ͕Β ήʔϜੑΛਂ͍ͷʹ͢Δ ϛογϣϯ
ϖνϟότͷྑͬͯ͞ ͳΜ͚ͩͬ AR !!! (AR ) →
None
None
AR IT
AR IT ↓
AR IT ↑
ήʔϜੑΛਂ͍ͷʹ͢Δ ັྗ͕Θ͔ͬͨͱ͜ΖͰ
None
λϚΛආ͚ͳ͕Β૬खͷλϫʔͷͱʹ ͞ΕͨΒࣗͷλϫʔμογϡ͢Δ ΞΫςΟϒͳಈ͖͕ٻΊΒΕΔήʔϜੑ
W
W \ !!/ \ !!/ ༑ୡͱϓϨΠ͢ΔલఏͰίϛϡχέʔγϣϯྔΛ૿͢
W \ !!/ \ !!/ ͜ΕΒʹΑͬͯΠϯλϏϡʔͷධՁ͕ͲΜͲΜධʹ
- ͳΜͰ͜ͷϓϩμΫτͬͯ ྑ͔ͬͨΜ͚ͩͬ 在 在
Ϣʔβʔݟͯͳ͍Μ͡Όͳ͍ɺ ݟ͑ͳ͍Μͩ
͜͏͍͏৽نϧʔϧΛ࡞Δͱಉ࣌ʹͲΜͲΜݦࡏԽͨ͠
ཧղͮ͠Β͍ ෳࡶ͕͞૿ͯ͠͠·͍ɺϢʔβʔࣗʹԿ͕ى͖͔ͨΘ͔Βͳ͍
͜ͷࠒྑ͘ѱ͘ɺ ʮγϯϓϧͳήʔϜʯͩͬͨ
͜ͷࠒྑ͘ѱ͘ɺ ʮγϯϓϧͳήʔϜʯͩͬͨ ͦΜͳࠒͰ͑͞ɺࠨԼͷඞࡴٕϘλϯʹϢʔβʔ͕ؾ͔ͮͳ͍
ͦΜͳʹΘ͔Γʹ͍͘6*͡Όͳ͘Ͷʜ
λϚΛආ͚ͳ͕Β૬खͷλϫʔͷͱʹ ͞ΕͨΒࣗͷλϫʔμογϡ͢Δ ΞΫςΟϒͳಈ͖͕ٻΊΒΕΔήʔϜੑ ͖ͬ͞ͷεϥΠυ
ϢʔβʔʹٻΊΒΕΔߦಈʜ
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ λϚΛආ͚Δ
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ λϚΛආ͚Δ λϫʔΛૂ͏
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ λϚΛආ͚Δ λϫʔΛૂ͏ ૬खͷअຐΛͭͭ͠
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ λϚΛආ͚Δ λϫʔΛૂ͏ ૬खͷअຐΛͭͭ͠ ࢮΜͩΒλϫʔͷۙ͘
ϢʔβʔʹٻΊΒΕΔߦಈʜ ૬खΛ߈ܸ͢Δ λϚΛආ͚Δ λϫʔΛૂ͏ ૬खͷअຐΛͭͭ͠ ࢮΜͩΒλϫʔͷۙ͘ ͜ΕΛߴͰΔ
UI
6*ʹରͯ͠ɺ࡞ͬͯΔͱ͖ͱͬͯΔͱ͖Ͱମײ͕ҧ͍͗ͨ͢
ը໘෦Λ༻͍ͨ)1දݱ ࣮ࡍʹࣦ͋ͬͨഊ HP → HP
σβΠϯ࣌ͷײ ը໘ͷ)1όʔ FPS !!!
࣮ࡍʹϓϨΠͯ͠Έͯ ը໘ͷ)1όʔ
Ϣʔβʔ͕͋·Γʹͯ͘͠ɺݟ͑Δͷݟ͑ͳ͍
ɾϢʔβʔͷͰ͖Δ͜ͱΛҾ͖ࢉ͍ͯ͘͠ ɾใʹ༏ྼΛ͚ͭͯѻ͍ʹࠩΛ͚ͭΔ ɾͱʹ͔͍ͪ͘ૣ͘ɺσβΠϯըΛखݩʹ࠶ݱ͢Δ Β͕ͬͨ͜ͱ
͞ΑͳΒɺඞࡴٕ ϢʔβʔͷͰ͖Δ͜ͱΛҾ͖ࢉ͢Δ 2 在
ࣗͷ͜ͱɺઓگͷ͜ͱɺ ૬खͷ͜ͱʹΘ͚Δ ใͷѻ͍ʹࠩΛ͚ͭΔ UI AR
ϓϨΠͨ͠ମײΛ͍ͪૣ͔֬͘Ί͍ͨʜ
"EPCF9%ͷσόΠεϓϨϏϡʔ σβΠϯըΛ͍ͪૣ͘खݩ ( UI ) PC USB UI HoloBreak
HoloBreak - https://www.youtube.com/watch?v=kbH0hurmL18
- Ϣʔβʔݟͯͳ͍Μ͡Όͳ͍ɺ ݟ͑ͳ͍Μͩ 在 Adobe XD
͓٬͞Μ͕ू·Βͳ͍
AR ! ! ! ΒͷັྗΛ౿·͑ͯ
ΞιϏϧʹͯؒ ग़ళ͍͖ͤͯͨͩ͞·ͨ͠ɻ
ਓ͕ɺू·Βͳ͍ ༡ΜͰΒͬͨํ͔Βͱͯධͳͷʹɺͳͥʜ
ΞιϏϧʹͯؒ ग़ళ͍͖ͤͯͨͩ͞·ͨ͠ɻ 9.00 (10 ) ?!
None
ͳʹͬͯΔ͔Θ͔Μͳ͍ʜ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS ༡ΜͰΔͷΛݟͯ ͓ۚΛͬͯ ࣗ༡Ϳ
ϢʔβʔࢹʹཱͬͯετʔϦʔΛߟ͑Δ Ϣʔβʔδϟʔχʔͷཧ ؆қWFS ༡ΜͰΔͷΛݟͯ ͓ۚΛͬͯ ࣗ༡Ϳ ͕͜͜؊ʹͳΔ
ॏཁͳͷ ʮτϥΠΞϧྗʯͰ͋Δɻ →
೩අʹɺτϥΠΞϧྗΛߴΊΔ ΞΠσΟΞΛੜΉ͜ͱ Β͕ͬͨ͜ͱ
DESIGN SPRINT
@denari01 5ؒͷരϓϩτλΠϐϯά ՝Λఆٛ͢Δ Day.1 ΞΠσΟΞΛൃࢄ͢Δ Day.2 ΞΠσΟΞΛબ͢Δ Day.3 ϓϩτλΠϓΛ࡞Δ Day.4
ΠϯλϏϡʔͰݕূ͢Δ Day.5
@denari01 ΞΠσΟΞΛൃࢄ͢Δ Day.2 طଘͷࣄྫΛूΊͯ͘Δ طଘࣄྫͷ͍͍ͱ͜ΖΛϝϞ͢Δ ϝϞͨ͠த͔ΒΞΠσΟΞΛߟ͑Δ
͍ͬͯΔࣄྫ͔ΜͨΜͳݕࡧͰग़ΔࣄྫΛूΊͯ
ࣄྫΛͱʹΞΠσΟΞग़͠ΛϒϨετܗࣜͰ࣮ࢪ
ධՁ࣠ΛαΫοͱܾΊͯධՁ͢Δ
ͦͷ݁Ռݟͨ͠ͷʮΞϓϦຊମʯͰͳ͘ձͩͬͨ
AR https://youtu.be/uM7_Mg6i60A
在 https://www.youtube.com/watch?v=YvgPXbiscwI
εϚϗΛखʹऔΔલ͔ΒମݧཧΛͯ͠ඪΛୡ
- ͓٬͞Μ͕ू·Βͳ͍ 在 SPRINT 在
(SBGpUZͷઓ·ͩ·ͩଓ͘ͷͰ͋Δʜ
ࠓճͷ·ͳͼͨͪ ·ͱΊ
- Ͳ͏ͯ͠ԶΒͷαʔϏε ΘΕͯͳ͍ͷ 在
- ͳΜͰ͜ͷϓϩμΫτͬͯ ྑ͔ͬͨΜ͚ͩͬ 在 在
- Ϣʔβʔݟͯͳ͍Μ͡Όͳ͍ɺ ݟ͑ͳ͍Μͩ 在 Adobe XD
- ͓٬͞Μ͕ू·Βͳ͍ 在 SPRINT 在
͍ͭͰ69ͷࢹΛ࣋ͪɺ၆ᛌͰཧΛ͢Δ͜ͱ ϢʔβʔࢹʹཱͬͯՁΛಧ͚͑͢͞Ε͍ͭͯ͘Δ ૯ׅເͷٕज़ΛϢʔβʔʹಧ͚Δʹʜ
@denari01 5IBOLTGPSZPVSBUUFOUJPO