What is WebVR?

by Jerad Bitner

The WebVR Landscape

According to https://webvr.info/ "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."

WebVR is built using JavaScript that accesses the WebGL platform built into modern browsers through the HTML5 Canvas element. WebGL allows browsers low-level access to your machine’s GPU for more advanced graphics rendering.

WebVR Diagram

WebVR Specification

w3c logo

Mozilla and Google have been instrumental in coming up with a W3C specification draft for WebVR which describes support for accessing virtual reality devices, including sensors and head-mounted displays on the Web. It’s not yet a standard, but progress is being made to get it there.

The W3C organized a Web & Virtual Reality Workshop in October of 2016 which was hosted by Samsung and sponsored by Google, Mozilla, and The Khronos Group. This workshop had around 14 different sessions talking about Performance, Accessibility, Audio, 360º Video, Multi-user techniques, and next steps for specifying a slew of features.

GRVA - Global Virtual Reality Association

GRVA logo

Acer Starbreeze, Google, HTC VIVE, Facebook’s Oculus, Samsung, and Sony Interactive Entertainment announced the creation of a non-profit organization of international headset manufacturers to promote the growth of the global virtual reality (VR) industry. The Global Virtual Reality Association (GVRA) will develop and share best practices for industry and foster dialogue between public and private stakeholders around the world.

GVRA’s mission is to promote responsible development and adoption of VR globally with best practices, dialogue across stakeholders, and research. GVRA will be a resource for industry, consumers, and policymakers interested in VR.

You can read more about the GRVA on https://www.gvra.com/.

While not focused specifically on WebVR, it’s encouraging that manufacturers are cooperating instead of just competing in order to come up with some standards that can help VR move forward in a collaborative fashion.

Browser Support

WebVR Browsers

Browser support for the WebVR API is currently happening in many of the cutting edge releases of browsers, or is hidden behind a few flags that must be set in order to enable the experimental features. You can find instructions for getting these various browsers working with your hardware here:

Note that you can develop WebVR experiences without these, but in order to see how it looks and works on VR hardware (which is often different than you'd expect when developing on a 2D screen) you will want these.

WebVR Tools

Here are some tools you can use to start building WebVR experiences now:

  • three.js - a JavaScript library making it easier to work with WebGL.
  • Primrose - one of the first WebVR frameworks. This JavaScript framework acts though listeners.
  • A-Frame - a JavaScript library with an entity-component system making it easier to work with Three.js.
  • A-Frame Inspector - a visual tool for inspecting and modifying your A-Frame layouts.
  • A-Frame React - a thin layer on top of A-Frame to bridge with ReactJS.
  • ReactVR - this is currently in a pre-release mode but aims to make use of ReactJS concepts to produce WebVR applications

Inspiration

I leave you with a little bit of inspiration of what is possible in WebVR with A-Painter, a Tilt Brush clone built using A-Frame for the HTC Vive.

A-Painter Interface
newsletter-bot