Andrea Hawksley, Emily Eifler, Vi Hart, Elijah Butterfield

November 2015

One of our first projects experimenting with virtual reality movement design, Float is a short virtual reality puzzle game in which you visit floating islands to make them come alive again. In theory, it’s not much of a puzzle—there’s nothing in the programming of the game that stops you from simply walking over the air to get to all the islands. The only barriers are the physical walls of the VR-supported room you’re playing in. The puzzle comes from how to use the moving platforms to manipulate what is within the bounds of those physical walls.

If you’ve got a Vive, set up webVR and try Float.

Code is on github here: github.com/vihart/float

You can see a walkthrough of the code on twitch (as it was in Dec 2015).

Helpful hints for playing Float:

If you’re reading this after June 2016, webVR API and Chromium versions may have changed. Just tweet me @vihartvihart if you have a Vive and are having trouble getting this running.

Press “f” or “enter” to go fullscreen. You’ll need to be fullscreen for it to work in VR. Or, with the new webVR 1.0 api, press “v” to go into vr mode.

It might work to some extent in your normal browser using arrow keys / wasd, or with other headsets in webVR, but it won’t be a puzzle game anymore. Don’t touch WASD if you’re using the Vive in webVR 1.0; it’ll make it track REAL weird.

Press “p” to stop the initial narration, and space to start it. We use that when we show webVR to people in our space, so that we can make sure they’re settled into the headset before we start the game.

Use IJKL U/O to move the entire scene, to get starting area aligned with your VR play space and the ground aligned with the floor. Or, put the headset in the center of the space and press x. See image at bottom of post for how the game should start in the room. Hopefully future webVR will allow us to get enough of your room info to align it automatically.

You can change the height that triggers the platform movement by going into the debugger and modifying “crouchHeight”. 0 is floor, 15 is default. We’re a research group and pretty much only developers have Vives right now, so we don’t feel too guilty about using in-browser debugging as our menu options system. Well, maybe a little guilty, but we’ve got other research to do!

Soundtrack is on Soundcloud:

We made a video about the project, featured at the top of this page, also on youtube.

Float Video Transcript:

Float is a short virtual reality puzzle game where you visit floating islands to make them come alive again. In theory, it’s not much of a puzzle—there’s nothing in the programming of the game that stops you from simply walking over the air to get to all the islands. The only barriers are the physical walls of the VR-supported room you’re playing in. The puzzle comes from how to use the moving platforms to manipulate what is within the bounds of those physical walls.

Most people aren’t used to thinking about layered spaces, especially when they move relative to each other. Winning this game requires thinking about space in a way that might be unfamiliar.

The idea for the game fell quite naturally out of the research we’ve been doing on VR movement design. Given only a small room, how do you allow someone to feel like they’re traveling through a large space? We’ve come up with a bunch of different answers to this question and this is one of them. Emily Eifler created a simple moving platform prototype in Unity a couple months ago as a proof of concept, and then I put that concept into the webVR framework that Andrea Hawksley built for us, using these 3D-modeled platforms created by Elijah Butterfield.

The biggest challenge in designing this thing is that it took me a bit to really wrap my head around the consequences of this kind of movement. We prototyped it using physical paper islands and cutout room boundaries. Once we understood that, I was ready to put it into code.

I’m not going to go too deep into the process of programming all this, but basically everything is sine waves. The rolling hills are just a pile of sine waves. The rolling clouds are sine waves. The platform movement is sine waves, the birds flap in sine waves, the butterflies flutter in sine waves. When the bloomflowers open, that’s because I’m moving each vertex by a pile of sine waves.

The first version had the platforms move along their sine-wave path just whenever you’re standing over them. Turned out this was a bad idea. One moment you’d be looking out at the landscape, the next moment the world would be sliding sideways because you’d triggered the platform, and… that’s exactly the sort of thing that gives people VR sickness.

The two problems with the old movement system were lack of visual context and lack of control over the movement. In a different game with a different style, we may have decided to put some sort of handrail or cage around the moving platform that would stay constant as you move, but that wouldn’t work for the natural setting of Float. So we decided to try something new: move only if you’re kneeling down or sitting on the platform. During the process of kneeling people naturally look down, so the platform is in their visual field providing steady visual context when the movement begins, plus kneeling down is a deliberate act so you can’t trigger the movement by accident. We added a bright green glow as a visual cue to make it even clearer that yes, you’re moving now, and that’s ok.

There’s also sound cues for when the platform starts and stops, which serve an important purpose beyond just fun and polish: they make it instantly clear to the brain whether the world is supposed to be moving around you, even if you’re not looking at the platform.

The music is also more than just atmosphere. The four major island-groups each have their own little piano theme. As you travel through the virtual space and bring islands together, you hear the intersections of these themes. New themes draw you to new islands and give the different spaces their own identities. Also when you win all the themes play at the same time to give a sense of cohesion and completion.

Float is available right now for the Vive headset in webVR at vihart.github.io/float. It requires about 3×3 meters of spatially-tracked play space, oriented such that the initial island sits in the space something like this:

float-initialconfig

If we were a game company and not a research group we’d have menu options for initial layout and crouch height and sound stuff and this would be just one level of many, but this is a research experiment so if you want to mess with that stuff you’ll probably just have to fork it on github, it’s on github.com/vihart/float. If you do have a Vive and want to try it out, probably tweet me @vihartvihart or find us at elevr.com.

related blog post: http://elevr.com/float/