Water you looking at?!

I was considering all my options for the blog post this week, but it turns out everything I've done these past 7 days are all a bit half-baked as of right now. The only presentable thing would be water reflections, so that's what I'm going to write about! The first bit of the blog post will be a bit wordy, but scroll about halfway down if you're just interested in some pictures!



The Order of the Land

Reflections are simple on paper. Simply take all the objects you want to reflect, flip them upside down and make them all wavy - and that's it! I'd also already done the "wavy" part for the water effects a couple of weeks ago so I thought this would be a simple task.

Turned out to be quite the opposite to get it all fast, functional, and good looking!

The first issue I came across was the depth sorting. For the uninformed, depth sorting is the way you get objects to appear on top of one another in a 2D game. In the case of Landraisers, lower numbers are drawn on top of higher numbers (so an object with 25 depth would appear below and object with 20 depth).

In order to have my waves from last week appear above the ground, the water tiles have to be drawn above the other tiles in the game. This wasn't an issue - until I wanted to do reflections! This may not come as a surprise, but reflections only appear on the water and not the land. Crazy, right? So how do I make an object that exists below the ground and above the water when water is higher than ground? Simple answer: you don't. There's no way to make this work! I had to come up with a different solution.



Reflective Surfaces

...But not the kind of surface you're thinking of! in GameMaker, surfaces are a way to draw a bunch of objects on a separate layer to the rest of the game which can then be drawn (or not drawn, in this case) in any way you please.

My solution to the above issue was this:

Flip all objects as said before, applying some colour effects to make them look more like reflections

Draw them to their own separate layer, but don't actually draw this layer to the screen

Then, each water tile would pick the 8x8 bit of the reflection surface and then draw that on top of itself, using the exact same numbers as used to draw the waves, meaning that the reflections will bob around with the waves!

This also means that land tiles will have nothing drawn above them.

This approach worked well, but it took a lot of optimising due to the slow speed of the surface-related scripts in GameMaker! Eventually I got it to a point of solid 60fps, although I will continue to make improvements as we go as it is still fairly resource intensive.

Now on to the actual look of the reflections!

How do I look?





This was the first attempt at reflections (please note, most of the pictures will not have big tree reflections as they're a bit more difficult do to their segmented nature! Visit this blog post if you want to know what I mean!), with absolutely no colour effects added to them at all. Just flipped and placed in! They've got the right distorted look, but the colour is really what makes the difference when it comes to this.



So I now draw the reflections twice! Once lightly blended with a pale blue to give it a blueish hue and also at 90% alpha so some of the water's colour comes through, and then again with a flat blue at 20% alpha to give it some pop!







Nice, right? Here it is with a few more objects added in to the mixer!





And lastly, a gif!





I'm running out of lame incentives to plug my Twitter, but how about you come follow me anyway!



Thanks for reading!

