Playing around with a samsung Gear VR headset and a rollercoaster simulator, someone asked if, as a developer, I could make a rollercoaster simulator. I thought it seemed like an interesting challenge. I knew how to make animated models in Blender, and I knew how to render 3D graphics in the browser, via threeJS. The only thing I was unsure about was whether threeJS, or more broadly speaking, WebGL, had mechanisms to do I/O with a VR headset. Turns out, they do! WebGL has a "WebXR API" for this (XR represents the acronyms VR and AR), and threeJS leverages it with some of its preconfigured libraries. ThreeJS even has a demo, and source code, that demonstrates a VR Rollercoaster! Making the app was a sinch! It was done in about 2 days.
The provided rollercoaster code did need a number of tweaks here and there to work as I wanted it to. For instance, the code in the example generates the curve of the rollercoaster track based on a mathematical algorithm, whereas I wanted more control; to define a curve by the location of points in 3D space. This way, the track would snake over the terrain that I had created in Blender.
While riding, keep an eye out for the alien mesh I modelled, textured, and animated in less than 15 minutes! It is a monstrosity in more ways than one!
NB: WebVR only works when the app is delivered over HTTPS, which I have not configured for this website. So unfortunately, VR works when the app is run locally with my dev server, but will not work here! I may change this in the future. However, you can still experience the rollercoaster here in "2D 3D" - as opposed to "3D 3D". You can also press C on the keyboard to activate the debug camera, and then use W, A, S, D, Space, Left Shift, and the mouse to fly around and look at the map.
NB: To create the app more quickly, I have dispensed with a loading progress indicator. Therefore, once you have clicked on the app to start it, you may see a black screen for a few seconds before the app starts - just keep waitin!