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
How to enjoy Web VR
Search
ikkou
April 20, 2016
Technology
0
700
How to enjoy Web VR
ikkou
April 20, 2016
Tweet
Share
More Decks by ikkou
See All by ikkou
GitHub Copilot全社導入のその後とGitHub×ZOZOTOWNコラボレーションの舞台裏 / GitHub ZOZOTOWN
ikkou
0
1.7k
Expectations for the Immersive Web: Insights from the WebXR Japanese Community
ikkou
0
130
WebXRの現状確認 2023 Autumn / Check the current status of WebXR 2023 Autumn
ikkou
3
2.2k
あなたの知らないARの可能性を空間レベルで拡げるVPSの世界 / The World of VPS
ikkou
1
5.2k
WebXR 最前線 2022 ~ メタバースとWeb3を添えて / WebXR Frontline 2022
ikkou
1
1.7k
メタバースの激流とXR業界のイマ / The Metaverse Torrent and the XR Industry Today
ikkou
0
2k
Recent Feature Topics on WebAR - 2021-06-06
ikkou
0
91
iOSではじめるWebAR 2021 - iOSDC Japan 2021 / webar-in-ios-2021
ikkou
1
4.5k
あなたの知らないSafariのExperimental Featuresの世界 - iOSDC Japan 2021 / Experimental Features in Safari You Didn't Know
ikkou
2
7.7k
Other Decks in Technology
See All in Technology
20250705 Headlamp: 專注可擴展性的 Kubernetes 用戶界面
pichuang
0
280
Getting to Know Your Legacy (System) with AI-Driven Software Archeology (WeAreDevelopers World Congress 2025)
feststelltaste
1
160
AI エージェントと考え直すデータ基盤
na0
11
3.2k
改めてAWS WAFを振り返る~業務で使うためのポイント~
masakiokuda
2
270
〜『世界中の家族のこころのインフラ』を目指して”次の10年”へ〜 SREが導いたグローバルサービスの信頼性向上戦略とその舞台裏 / Towards the Next Decade: Enhancing Global Service Reliability
kohbis
2
300
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
visional_engineering_and_design
3
7.9k
United airlines®️ USA Contact Numbers: Complete 2025 Support Guide
unitedflyhelp
0
330
United™️ Airlines®️ Customer®️ USA Contact Numbers: Complete 2025 Support Guide
flyunitedguide
0
240
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
airhelpsupport
0
390
Coinbase™®️ USA Contact Numbers: Complete 2025 Support Guide
officialcoinbasehelpcenter
0
410
united airlines ™®️ USA Contact Numbers: Complete 2025 Support Guide
flyunitedhelp
1
420
SmartNewsにおける 1000+ノード規模 K8s基盤 でのコスト最適化 – Spot・Gravitonの大規模導入への挑戦
vsanna2
0
140
Featured
See All Featured
Unsuck your backbone
ammeep
671
58k
Automating Front-end Workflow
addyosmani
1370
200k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
For a Future-Friendly Web
brad_frost
179
9.8k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Scaling GitHub
holman
460
140k
Adopting Sorbet at Scale
ufuk
77
9.5k
Fireside Chat
paigeccino
37
3.5k
Agile that works and the tools we love
rasmusluckow
329
21k
How GitHub (no longer) Works
holman
314
140k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Transcript
How to enjoy Web VR 2016/04/19 Meguro.es #3
Web VR = Web Virtual Reality
ࠓVRݩͱݴΘΕ͍ͯ·͢
Question VRίϯςϯπΛݟͨ͜ͱ͕͋Δਓ✋
Question VRίϯςϯπΛ࡞ͬͨ͜ͱ͕͋Δਓ✋
࠷ۙVR ZONEͱ͍͏VRΤϯλϝࢪઃ ͕ظؒݶఆͰΦʔϓϯ͠·ͨ͠!
ͻͱ݄ઌ·Ͱ༧Ͱຒ·ͬͯ ͍·͕͢ɺඦฉҰݟʹ͔͠ ͣɺ৽ن༧Λड͚͚Δ̌ ࣌ʹϒϥβʹுΓ͍ͯͰ ༧͢ΔՁ͕͋Γ·͢!
ͻͱ݄ઌ·ͰͳΜͯͯͳ͍ Αɺͬͱؾܰʹ̧̫Λָ͠ Ίͳ͍ͷʁͦΜͳਓʹΦεε ϝͳͷ͕؆୯ʹखݩͰࢼͤΔ Web Virtual Reality
None
I'm ikkou • Drecom Co., Ltd. • Manager, Front-end Engineer
• Technical Director • g1983ers • Meguro.es, Organizer • ϛΫ͞Μ͕େ͖Ͱ3݄9ϛΫͷ͕݁ࠗه ೦
How to enjoy Web VR
TL;DR ํ๏͍͔ͭ͋͘Γ·͕͢ɺJavaScriptϑϨʔϜ ϫʔΫΛ͏͜ͱͰWeb VRΛ؆୯ʹָ͠Ή͜ͱ ͕ग़དྷ·͢ • Web VR Starter Kit
• a-frame • VR view
Web VR Starter Kit
Web VR Starter Kit is Կ • खͬऔΓૣ͘Web VRΛָ͠ΊΔJavaScriptϑ ϨʔϜϫʔΫͷΓ
• sample01, sample02
a-frame
a-frame is Կ • a-frameMozVR͜ͱMozilla VR team͕ϦϦʔ εͨ͠Web VRͷϑϨʔϜϫʔΫ •
ͨͬͨ1ߦͷJavaScriptΛಡΈࠐΉ͚ͩͰa- frameΛ͏͜ͱ͕ग़དྷΔ • औ͖ͬ͢͞ଞͷWeb VRϑϨʔϜϫʔΫ ʹൺͯѹత • sample01, sample02
VR view
VR view is Կ • Google͕։ൃ͍ͯ͠Δ3/30ʹެ։͞Ε͔ͨ ΓͷϑϨʔϜϫʔΫ • Web͚ͩͰͳ͘ɺiOSͱAndroidͷωΠςΟ ϒΞϓϦαϙʔτ͍ͯ͠Δ
• ੩ࢭը͚ͩͰͳ͘ɺಈըαϙʔτ͍ͯ͠Δ • sample01
Web VRΛ؆୯ʹࢼ͢ํ๏ ͔ͬͨɺͱ͜ΖͰͲ͏ͬ ͯίϯςϯπΛ༻ҙ͢Δͷʁ
Facebook Surround 360 ͜ΕΛ͑៉ྷͳ360ಈըΛ࡞ΕΔʂ
͕ɺ͓ஈ $30,000 ͱ͓ߴ͍……ɻ
ࣗͰ༻ҙ͍ͨ͠ͳΒ RICOH THETA γϦʔζ
ࣸਅ͕ཉ͍͠ͳΒ Flickr VR
VR࣮ࡍʹͦͷͰݟͯମݧ ͢Δͱ͜Ζ͔Β࢝·Γ·͢ʂ
·ͣൺֱతͱ͖͍ͬͭ͢ Web VR͔Β࢝ΊͯΈͯʁ
enjoy Web VR !!
ը૾ग़య • https://www.oculus.com/en-us/rift/ • https://project-ican.com/ • https://facebook360.fb.com/facebook- surround-360/ • https://theta360.com/ja/about/theta/
m15.html • https://www.flickr.com/vr