I’ve been messing around with three.js again recently and thought it would be fun to try and mix some 2D visuals with 3D, kinda like you see in games like Rayman Legends. I also thought I’d spend some time experimenting with Physijs, which is a physics plugin for three.js. The end result was this little moon buggy demo that uses some assets that our excellent artists at WeeWorld put together.
The terrain is a 3D mesh and there’s also a 3D mesh that represents the buggy, which interacts with the terrain. All the other visuals are textures mapped to planes. I also hid the buggy’s mesh and replaced it with 2D textures to ensure it sat well within the environment. To make things a bit more interesting I added a few ramps to the scene and also randomly placed some boulders for the buggy to run over. I was also considering adding a gas and brake key to allow the user to actually drive the buggy but ran out of time, so you’ll just need to watch as the buggy tries to make its own way to the end of the map.
If I find some spare time at some point I’d like to tidy it up a bit, make it playable and also stick the code on GitHub somewhere. However, other things have gotten in the way so I thought I’d share what I’ve put together so far. Anyway, enjoy, and if the buggy flips over or gets stuck then just refresh the page and see if it does any better second time around. There are lots of large textures in the demo so please be patient as it downloads.
UPDATE: I’ve now placed the source code for the demo on GitHub. It’s still a non-interactive demo and the source is in desperate need of some refactoring but hopefully you’ll be able to get something from it.