Article Image

I've been working on a 3D engine. This isn't the first time I've had a go at this, although the previous time it was written in Java - a language I did not have much experience with at the time - and used the LWJGL which did most of the cool stuff for me. I was making a simple clone of Minecraft, which was kinda pointless as Minecraft was also written in Java using the LWJGL. I got some nice lighting effects and a voxel terrain generation system going (Feature generation using the great Fractal Brownian Motion method!) before I got bored and gave up.

My favorite bug in SMC - an attempt at a Simple Minecraft Clone

My latest attempt is - in my opinion - rather more interesting. I am using a system called Emscripten. This means that I can write my engine/game in C++ (although I use it more like "C with classes") and compile the C++ and OpenGL code into javascript and WebGL.

Basically I can write the code in C++ but run it in the browser. I find that incredible! The secret lies in the use of asm.js. By compiling to a subset of javascript that is very highly optimised by browser developers, the compiled code runs blazing fast. Fast enough for real-time 3D rendering.

The way the actual drawing works is really interesting. There is a lot of maths involved in converting vectors that contain the location of each vertex into vectors that contain the location of how the vertices would look according to a viewer - who is not at the origin in your cyberworld, and has a concept of perspective. This is done by applying translations, rotations and by scaling using matrix-vector multiplication. Since the game world lives in flat space, we can use matrices to do this! The 4D transformation matrices that make this possible are an example of a wonderful use for linear maps. I am currently looking into what would happen if you add in non-linear maps, just to see if they allow the world to be morphed in strange and wonderful ways.

A cube in REMEngine, running in Chrome

The engine currently supports the loading of models in the OBJ and MTL format - with and without textures. It can also handle real time lighting - using the phong lighting model - in the form of directional lighting and point lights.

A point light illuminating part of the cube

The last time I did this I used what is called a Fixed Graphics Pipeline - because of this I was limited to a fairly fixed look. With the advent of shaders, one can change the way graphics are drawn in a very dynamic and versatile way. For example, the engine also supports the addition of different fragment and vertex shaders in an easy way. This allows me to use fun effects on the polygons drawn - such as a Toon Shader to add an outline to models.

The Toon Shader on a blue cube

The way the shader defines and draws the outline is interesting and non-trivial. One should not just draw a thick black line along every edge! More on that later.

You can see a fairly recent build of REM here. To run it you'll need a fairly modern browser, but most modern mobiles/tablets should be able to run it too.

Blog Logo




Teggers Blog

Stuff I do when bored.

Back to Overview