VR Hyperspace Simulator

A VR hyperspace simulation built in the browser for Google cardboard.

Cardboard allows you to turn a smartphone into a VR device using some cardboard, biconvex lenses and a few other cheap components. This provides a cost-effective and accessible way to experience VR without the need for expensive, specialist hardware. It also means that any content that can run on a smartphone can potentially be repurposed for VR. With this in mind, I developed a small demo that requires no additional app downloads and runs directly in the browser.

Cardboard provides essentially two input mechanisms: head position/rotation and a single magnet-based button. The button seems made for generating acceleration so I made a (lo-fi) hyperspace simulator a la Star Wars. A star field stretches towards you as you accelerate, and moving your head allows you to explore the tunnel-like effect.

Tech

The demo was built using three.js and renders with openGL for performance. Two views are rendered, one for each eye/lens, using a stereo effect. The device accelerometer/orientation is used to rotate the camera, allowing the user to look around the scene. The stars are rendered using a single geometry rather than multiple lines which provides a big performance boost: on a years old Nexus 5 it manages around 2000 particles.

Strap on your cardboard and try it out at infinitefun.space/lab/hyper (tap once and allow full-screen then put the your phone into cardboard).