Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Virtual Reality and Augmented Reality Web Apps

Andrew Cassell
May 25, 2016
Programming
2
680

Virtual Reality and Augmented Reality Web Apps

Virtual reality and augmented reality will revolutionize the Web as we know it. In this talk, we will build and demo a web application in virtual reality (WebVR) using PHP, React.js, A-frame, and an Oculus Rift.

Andrew Cassell

May 25, 2016
Tweet

More Decks by Andrew Cassell

See All by Andrew Cassell
Immutability to Save an Ever-Changing World
cassell
0
30
Immutability to Save an Ever-Changing World
cassell
0
10
Domain-driven Design Workshop
cassell
1
250
Immutability to save an ever-changing world
cassell
3
450
Introduction to Domain-Driven Design in PHP - ZendCon & OpenEnterprise 2018
cassell
3
690
Immutability to Save an Ever-Changing World - PHP Benelux 2018
cassell
1
540
Domain-driven Design in PHP - PHP Benelux 2018
cassell
1
150
php[world] 2017 Domain-Driven Design Workshop
cassell
1
270
Domain-Driven Design
cassell
2
860

Other Decks in Programming

See All in Programming
PagerDuty を軸にした On-Call 構築と運用課題の解決 / PagerDuty Japan Community Meetup 4
horimislime
1
110
What’s New in Compose Multiplatform - A Live Tour (droidcon London 2024)
zsmb
1
340
プロジェクト新規参入者のリードタイム短縮の観点から見る、品質の高いコードとアーキテクチャを保つメリット
d_endo
1
1k
現場で役立つモデリング　超入門
masuda220
PRO
13
2.9k
Vue SFCのtemplateでTypeScriptの型を活用しよう
tsukkee
3
1.5k
Piniaの現状と今後
waka292
5
1.5k
RailsのPull requestsのレビューの時に私が考えていること
yahonda
5
1.7k
macOS でできる リアルタイム動画像処理
biacco42
7
1.9k
Kotlin2でdataクラスの copyメソッドを禁止する/Data class copy function to have the same visibility as constructor
eichisanden
1
140
Identifying User Idenity
moro
6
7.9k
Nuxtベースの「WXT」でChrome拡張を作成する | Vue Fes 2024 ランチセッション
moshi1121
1
520
Vue3の一歩踏み込んだパフォーマンスチューニング2024
hal_spidernight
3
3.1k

Featured

See All Featured
Speed Design
sergeychernyshev
24
570
Thoughts on Productivity
jonyablonski
67
4.3k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
27
4.2k
Typedesign – Prime Four
hannesfritz
39
2.4k
How to Ace a Technical Interview
jacobian
275
23k
Building Applications with DynamoDB
mza
90
6.1k
Scaling GitHub
holman
458
140k
Designing on Purpose - Digital PM Summit 2013
jponch
115
6.9k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
92
16k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
37
1.8k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
The World Runs on Bad Software
bkeepers
PRO
65
11k

Transcript

  1. Virtual Reality Web Apps Virtual Reality Web Apps Andrew Cassell

    Andrew Cassell
  2. None

  3. https://amzn.com/B01770MBN4

  4. None
  5. None
  6. None
  7. None
  8. None
  9. None
  10. None
  11. None
  12. None
  13. None

  14. Graz University of Technology Institute of Computer Graphics and Knowledge

    Visualization

  15. freesoftwaremagazine.com

  16. Reality Augmented Reality Augmented Virtuality Virtual Reality

  17. Reality

  18. None
  19. None
  20. None
  21. None

  22. Reality Augmented Reality Augmented Virtuality Virtual Reality

  23. None
  24. None
  25. None
  26. None
  27. None
  28. None
  29. None
  30. None
  31. None
  32. None
  33. None

  34. Augmented Reality Web Applications

  35. <body> <video> <canvas> <canvas> <canvas>

  36. None
  37. None

  38. ArUco marker

  39. None

  40. Frozen Sing-Along https://github.com/cassell/frozen-web- augmented-reality-demo

  41. None
  42. None
  43. None
  44. None
  45. None
  46. None
  47. None
  48. None
  49. None

  50. https://github.com/jeromeetienne/threex.webar

  51. Reality Augmented Reality Augmented Virtuality Virtual Reality

  52. Knightmare

  53. Reality Augmented Reality Augmented Virtuality Virtual Reality

  54. None
  55. None

  56. VR Devices

  57. None
  58. None
  59. None

  60. WebVR

  61. WebVR

  62. WebVR No Installs Many Devices No Vendor Lock-in Many Browsers

  63. WebVR Motion Sickness Framerate

  64. None

  65. DEAL WITH IT

  66. http://mozvr.com/webvr-spec/

  67. None
  68. None
  69. None
  70. None
  71. None
  72. None
  73. None
  74. None
  75. None
  76. None

  77. Device

  78. Device

  79. Device Device

  80. None

  81. mozvr.com

  82. https://www.superdataresearch.com/market-data/virtual-reality-industry-report/

  83. We always overestimate the change that will occur in the

    next two years and underestimate the change that will occur in the next ten. Don't let yourself be lulled into inaction.

  84. Virtual Reality Business Gaming & Entertainment

  85. Shopping Real Estate Education Medical

  86. None
  87. None

  88. navigator.getVrDevices() + three.js

  89. aframe.io

  90. aframe.io VR + Mobile + Desktop Entity Component System Uses

    threejs and WebGL Open Source Animations Events

  91. IF YOU CAN WRITE HTML YOU CAN DEVELOP FOR VIRTUAL

    REALITY
  92. None
  93. None
  94. None
  95. None
  96. None
  97. None

  98. x y z

  99. None
  100. None
  101. None
  102. None
  103. None

  104. https://github.com/cassell/webvr-soccer-stadium-multiplex

  105. None
  106. None
  107. None
  108. None
  109. None
  110. None

  111. http://facebook.github.io/react

  112. https://github.com/cassell/aframe-react-leapmotion-slot-machine

  113. None
  114. None
  115. None
  116. None
  117. None
  118. None
  119. None
  120. None
  121. None
  122. None
  123. None
  124. None
  125. None

  126. https://github.com/cassell/aframe-react-leapmotion-slot-machine

  127. @alc277 andrewcassell.com

  128. Demos