Slide 1

Slide 1 text

Building multiplayer VR web apps WeAreDevelopers 2018 Srushtika Neelakantam @Srushtika

Slide 2

Slide 2 text

Hi ! I’m Srushtika @Srushtika [email protected] Developer Advocate

Slide 3

Slide 3 text

Virtual Reality @Srushtika | WeAreDevelopers | 2018

Slide 4

Slide 4 text

Virtual Reality is tricking your brain into believing something that’s not. even. real. ! @Srushtika | WeAreDevelopers | 2018

Slide 5

Slide 5 text

Gatekeepers @Srushtika | WeAreDevelopers | 2018

Slide 6

Slide 6 text

Installs @Srushtika | WeAreDevelopers | 2018

Slide 7

Slide 7 text

Closed @Srushtika | WeAreDevelopers | 2018

Slide 8

Slide 8 text

Solution? @Srushtika | WeAreDevelopers | 2018

Slide 9

Slide 9 text

Image source: The Engineer’s cafe An open Virtual Reality platform with the advantages of the WEB @Srushtika | WeAreDevelopers | 2018

Slide 10

Slide 10 text

Open @Srushtika | WeAreDevelopers | 2018

Slide 11

Slide 11 text

Connected @Srushtika | WeAreDevelopers | 2018

Slide 12

Slide 12 text

Instant @Srushtika | WeAreDevelopers | 2018

Slide 13

Slide 13 text

IMPORT WEBVR POLYFILL SET UP CAMERA SET UP LIGHTS INITIALIZE SCENE DECLARE AND PASS CANVAS LISTEN TO WINDOW RESIZE INSTALL VR EFFECT INSTANTIATE RENDER CREATE RENDER LOOP PRELOAD ASSETS FIGURE OUT RESPONSIVENESS DEAL WITH META TAGS AND MOBILE @Srushtika | WeAreDevelopers | 2018

Slide 14

Slide 14 text

Hello A-Frame ! A-Frame is a web framework for building virtual reality (VR) experiences. As originators of WebVR, the Mozilla VR team developed A-Frame to be the easiest as well as the most powerful way to develop WebVR content. @Srushtika | WeAreDevelopers | 2018

Slide 15

Slide 15 text

Sketch credits: @ngokevin @Srushtika | WeAreDevelopers | 2018

Slide 16

Slide 16 text

How does it work? @Srushtika | WeAreDevelopers | 2018 @Srushtika | WeAreDevelopers | 2018

Slide 17

Slide 17 text

Virtual Reality @Srushtika | WeAreDevelopers | 2018

Slide 18

Slide 18 text

on the web Virtual Reality @Srushtika | WeAreDevelopers | 2018

Slide 19

Slide 19 text

on the web Virtual Reality Now let’s make it realtime! @Srushtika | WeAreDevelopers | 2018

Slide 20

Slide 20 text

HTTP @Srushtika | WeAreDevelopers | 2018

Slide 21

Slide 21 text

AJAX Polling @Srushtika | WeAreDevelopers | 2018

Slide 22

Slide 22 text

AJAX Long Polling @Srushtika | WeAreDevelopers | 2018

Slide 23

Slide 23 text

HTTP/2 @Srushtika | WeAreDevelopers | 2018

Slide 24

Slide 24 text

The paradigm @Srushtika | WeAreDevelopers | 2018

Slide 25

Slide 25 text

WebSockets @Srushtika | WeAreDevelopers | 2018

Slide 26

Slide 26 text

Pub/Sub @Srushtika | WeAreDevelopers | 2018

Slide 27

Slide 27 text

Presence @Srushtika | WeAreDevelopers | 2018

Slide 28

Slide 28 text

Live Demo @Srushtika | WeAreDevelopers | 2018

Slide 29

Slide 29 text

@Srushtika | WeAreDevelopers | 2018

Slide 30

Slide 30 text

Building multiplayer VR web apps WeAreDevelopers 2018 Srushtika Neelakantam That’s all folks! Thankyou. @Srushtika