• Register
Post news Report RSS Glux: Olvand's new graphics and lighting engine

This week, I describe Glux, and how basic 2.5D lighting works.

Posted by on

As I told you last week, the main focus of the coming updates will be a new graphical engine I am developing. I call my graphical engine Glux, and it basically is a library of code that makes creating 2.5D games (2D games that are not completely from above, but also not completely from the side, like Olvand) with OpenGL super-easy. So far, I've used SDL instead of OpenGL, which was a bit too slow and caused some graphical glitches. At the moment, Glux can already succesfully draw sprites (images), text, lines, circles, make screenshots, etc.

While I was working on Glux, I figured I wanted to try if I could use OpenGL to build something better than my own clunky lighting engine. This turned out to be much harder than I thought, but it also turned out to be more or less possible. So Glux will include a new, faster an better-looking lighting engine! Or at least, if I can get the shadows to at least look acceptable. What I teased you last week is an earlier, more basic result without shadows.

Basic lighting
Let me tell you how I came to what you saw in the teaser. Like I said, building a lighting engine turned harder than I thought. It already started with simply drawing circles - or disks, to be precise, as the circles are filled. In computer graphics, you can't draw real disks, you draw a fan of triangles:

Zoom in (real dimensions: 355 x 163)Image

By making the triangles thinner, your eyes can no longer see the individual triangles at some point. However, to be able to create a formula which can translate info like 'I want a circle of this size here' to positions of triangles, I had to know how things like sinus and tangus worked... which I once learned in highscool, but completely forgot. Thanks, [Khan Academy] for helping me refresh that knowledge :).

Anway, once I had written the code to easily draw disks, I thought it was only matter of drawing colored disks on a black layer (the darkness), making this layer a bit transparent, and drawing it on top of your world. That, however, looked like this:

Zoom in (real dimensions: 300 x 300)Image

After a lot reading on the internet, and making mock-ups with GIMP, I figured out I shouldn't make the lighting layer transparent, but use the 'multiply' blending mode. If you use Photoshop or GIMP, you'll recognize this way of combining images:

Zoom in (real dimensions: 300 x 300)Image

That looks a lot more like light already! But what if two disks meet on our lighting layer?

Zoom in (real dimensions: 300 x 300)Image

Here, the blue disk was draw later than the red disk, and is thus draw on top of it. What we want instead is that the two lights 'mix'; in this case the overlapping area should be purple. To achieve this, I create a lighting layer for each individual light (so each individual disk), and then blend them together using the 'screen' blending mode. The result is then drawn over the world in 'multiply' blending mode.

Zoom in (real dimensions: 300 x 300)Image

Much better! The next step is to make the edges of these disks transparent:

Zoom in (real dimensions: 300 x 300)Image

And there we are, at the stage of the basic tease last week. In my code, I now only have to tell where the lights are, and which color, and Glux does the rest. I feel proud :).

A problem with this system is that underground, you can look at the other sides of walls and stuff, which of course is not what we want. Therefore, like I said, I am currently adding a shadow system to Glux, but that again gives me a number of problems to solve. I am making progress, though, so I hope to be able to show you something soon!

If you want more development, see [twitter] or [facebook]. If you want to be a tester, you can subscribe on [olvand.com].

Post comment Comments
johnlier
johnlier - - 46 comments

Very nice update. Looking forward to more.

Reply Good karma Bad karma+4 votes
Twillypop
Twillypop - - 149 comments

Same here ;]

Reply Good karma Bad karma+2 votes
ScicoPax
ScicoPax - - 154 comments

Looking forward to the shadow system explanation. :)

Reply Good karma Bad karma+2 votes
Post a comment

Your comment will be anonymous unless you join the community. Or sign in with your social account: