web vr creative_vr

16
WebVR A short introduction @oscarmarinmiro

Upload: oscar-marin-miro

Post on 10-Jan-2017

99 views

Category:

Internet


0 download

TRANSCRIPT

WebVRA short introduction

@oscarmarinmiro

What’s WebVR?

“WebVR is an experimental JavaScript API that provides access to Virtual Reality devices, such as the Oculus Rift, HTC Vive, Samsung Gear VR, or Google Cardboard, in your browser.”

https://webvr.info/

Why WebVR?• From an “Internet of Information” to an “Internet of experiences” (Kevin Kelly)

• Web interoperability

• Device agnostic

• Tailored for Web Developers

What’s really WebVR?

WebVR enabled-browser +

AFrame / three.js

AFrame stack

WebVR API

three.js

WebVR Boilerplate

AFrame

DOM

JS

YOU

Beyond that…

var ring = document.createElement("a-ring"); ring.setAttribute(“radius-inner", 1.1); ring.setAttribute(“radius-outer", 1.2); ring.setAttribute("material", “color: #FFF”); ring.setAttribute("visible", true);

var scene = document.querySelector(“a-scene”); scene.appendChild(ring);

ring.addEventListener(“click”, function(event){ ….

});

Some other features

• Ray caster + Gaze-based click/fuse • Vive-controls • Loads .obj, blend, collada models • Can be embedded • Sound component • Animation • Link traversal

three.js or AFrame?

• Low-level vs High-level • More structure • Performance (DOM)

More goodies

More goodies