WebVR experiment with three.js
Recently we’ve been exploring the magic world of WebGL and the WebVR API.
We used webvr-boilerplate as a starting point which is a THREE.js base for VR experiences that works in both Google Cardboard and other VR headsets such as the HTC Vive.
The boilerplate contains a webvr-manager which facilitates the entering and exiting of VR mode. It relies on the webvr-polyfill to provide VR support if the WebVR API is not implemented.
The great thing about WebVR is that it’s quite easy to progressively enhance the experience for VR enabled devices, and at the same time deliver a nice 3D experience for our regular screens.
It was awesome to see how easy it is to access the Vive Controllers, thanks to the THREE.js ViveController class.
Seems like the future is here to stay!
Get the code
You can get the code for our Aeronaut experiment on GitHub. For now, you’ll need an experimental WebVR build of Chrome in order to try it in HTC Vive.
Note: current version is optimized for desktop (using mouse to steer) and HTC Vive (using Vive controller to steer). The mobile Cardboard experience could use a bit more work since there’s currently no way to steer the plane.
Feel free to fork our repo and add more aweomeness!
Write a comment