Lightmapping and the browser

One of my goals with SceneVR is to let people build simple, but good looking scenes. Part of the problem with many user generated content worlds (second life) is that the content isn’t modelled by professional artists, and it’s really hard for dedicated amateurs to create game level content.

Minecraft avoided this by using voxels and a nice lighting solution that meant that even though everything was low-fi and blocky, it also looked nice when rendered on a good computer.

Minecraft rendered with a global illumination rendering mod and high resolution texture packs.

I’m not a good 3d modelller myself, and so far, all the content that I’ve made in SceneVR has been with sketchup, and then lightmapped using blender. This lets me create pretty simple scenes that have nice lighting from the sky.

Homeroom in scenevr modelled in sketchup and lit using Blender

There are a few problems with the above process. One, I can’t edit the scene in the browser, I have to install sketchup and learn how to use it to edit the scene. It also means I can’t edit collaboratively with people, and finally, you have to know how to do lightmapping in Blender, which is a far from trivial exercise.

Lightmapping in Blender

I’m pretty good at remembering all the steps for lightmapping in Blender, but it’s complicated to learn.

I have in the past, contemplated providing editing tools for scenevr, so you could place geometry, then ‘bake it’, send the scene off to the server to be lightmapped by blender. This is a cool idea, but building modelling tools in the client is really difficult. There are some great modelling tools in the browser, but it’s a huge job by itself. And it’s not very efficient, if people want to build a house, they’re probably going to stack a bunch of blocks, which is much more efficiently done using a voxel field.

So I started playing with aomesher, a npm module by mikolalysenko, that lets you treat voxel fields as 3 dimensional ndarrays, and then efficiently convert them to meshes. I wrote some code to turn the meshes into a format that three.js can use, added a little bit of code to let you place and remove blocks, and suddenly you can create a world a-la minecraft.

Code for editing a world live in SceneVR

So now you have voxels, and they’re in the browser, and they have some shading using ambient occlusion (thus AOmesher), and it looks like this:

Voxel support with ambient occlusion

Now, I quite like this, and the ambient occlusion adds a nice sense of depth, especially combined with the block texture (the uv coordinates are a bit messed up on that render), but the thing is, I’ve been watching ephtracy on twitter, and there have been some renders that have made me decide that what I really want to do is global illumination in the browser. I worked at Indigo Renderer for a long time with my good friend Nick Chapman, and I appreciate how a good renderer can take some pretty basic modelling and turn it into a stunning environment.

Render by @elusiveone96 made in magicavoxel

So, what I’m working on right now, is a mod of SceneVR that lets you edit voxel-based scenes right in the browser, and have the server on the backend lightmap the scene as you place and remove blocks, including light emitting blocks (think glowing red blocks). Using the blender cycles renderer and their python API, plus a bit of magic on the server and I should be able to get most of this working. Then, over time, by decreasing the voxel size and adding the ability to have multiple adjacent chunks (currently scenevr only supports chunks of 32x32x32, not a seamless world), you should be able to create pretty nice indoor environments that are nicely lit from a global sun, plus lightsources in the world. I don’t plan on doing specular reflections for now, so everything will have to be diffuse (but I’ll hopefully get transparency working), but it might look quite nice.

I think a dark world with lots of neon blue light-cubes will create a nice tron look. Here’s what I have so far:

Scene created in the browser and rendered on the server by an offline process

See what I’m building in SceneVR.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.