Maple Keys revisited with WebVR

Lie down under a maple tree, and watch the keys lazily drift down towards you. In your VR goggles, with WebVR!

(This is in an iFrame – to pop it out for your VR goggles, click here)

I’d written a demo using THREE.js some time back, that simulated maple keys falling in the spring. Having secured some VR goggles (Samsung Gear VR with a Galaxy S7), and tried no end of VR experiences, it seemed like I should “port” that demo into an immersive version.

Now I’ll be the first to admit, that the way I created this was a bit of a hack. It’s based on A-Frame VR – I really like the way A-Frame makes it easy, at least with today’s mobile VR technology, to view this anywhere. I can see it on my desktop. I can see it in my phone. And if I click the little “goggles” icon, and pop the phone into my headset – ooOOOooo, it’s like I’m really there.

And this was one interesting challenge, moving from THREE.js to WebVR. When I was projecting these models onto a flat screen in my previous demo, size didn’t matter. Distance didn’t matter. The keys themselves were over a meter long – but there was no way to tell that. Inside the goggles – it suddenly became important to have things at the right scale – right size and right distance from the user – to give that “these things are swirling all around me” appeal.

An amazing moment was when my 11-year-old daughter asked to see – I popped the goggles on her head for a moment, and was most amused to see her reaching out, seriously trying to catch the keys. Yes! That was exactly the illusion I was looking for, for this experience.

And that’s what drove me thought the creation of this uber-simplistic demo – I wanted to create an “experience”. I’ll get to story-telling and proper use of the tools. Maybe use A-Frame with a bit less reckless hackery, as it moves beyond version 0.2.0. But for today – I’ve really enjoyed taking a simple model from Blender and turning it into something that’s relaxing to lay down and just watch for a while.

Try it – lay down and watch. It’s fun to do in my back yard, in the real world, at the right time of year – and it’s fun to do it here, with this demo, in even the most primitive VR goggles money can buy. This is passive VR – this is basic VR – this is VR that works in the very lowest of the low in terms of hardware – and it’s as easy as visiting  a website. This website. Or my new website at – where this, with some subtle modifications and extra bits of content – serves as the very first bit of content to get the site online.


Tweet about this on TwitterShare on Google+Share on LinkedInShare on FacebookEmail this to someone

Author: Pete

Editor-in-Chief, Lead Software Developer and Artistic Director @