Improvements in visuals

This is a follow up on this article.

So these last couple of weeks I was mainly focusing on getting Pyramid Plunge to look better, and I tried to attack the problem from different angles, mainly Atmosphere and Depth.

Now it looks like this:

As a reminder, previously it looked like this:

I think it looks much better now. Here’s a breakdown of what was done:

Atmosphere

The game somehow lacked that your in a mysterious place and after brainstorming a bit I came up with the following changes that I could experiment with:

Shadows – we know how that turned out

Fog – I added some green myst and it gave it a real interesting feel to it, even though it’s very subtle

Lighting – The previous lighting was too basic (just darkened everything and subtracted circles of light). I now opted for pixel-based lighting with normal mapping and specular lighting thrown in the shader. Normal mapping gave a sense of depth, more on this later.

So for light we added some Ambient light, dark blue to give a sense of cartoony darkness, and then candle light yellow light for the torches that flicker (and also some glow on top). For the light coming from the players, we used a tint of green but not much. We also tried spawning torches across the level to remove the light from the players, but this turned out to be distracting for the fast paced game Pyramid Plunge is shaping into.

Props – The background looked too empty and repetitive

  • Columns – These immediately reinforced the egyptian theme
  • Sand dunes – Small mountains of dust spaced here and there added a nice touch
  • Spider webs – We place them randomly in corners and scale them randomly too and gave a sense of an abandoned place
  • Murals – These were placed seldomly to seal the egyptian theme

Depth

I wanted the game to somehow pop out in a subtle way. And two things came to my mind: Faking depth with normal maps and lighting, and parallax effect where you have multiple layers scrolling at different speeds.

Normal Maps – I tried several tools, but wasn’t happy with the results. So most of the normal maps I painted them myself. See previous article for more details on normal painting. Recently we also found an easy to use free/pay-what-you-want normal map generator tool called Laigter.

Parallax – This is something I still need to experiment more with as I couldn’t get something decent yet. I’m thinking having 3 layers. The background bricks, columns, and the platforms. But this still looked odd while playing and felt more distracting to the player, so we didn’t include this yet.

Now that we have the tech in place, I’m looking forward to continue production on the next themes and their enemies.

Striving for Pixel Perfection

So I forgot about high-resolution monitors, and this happened while a player was play testing it on a high-res monitor. ?

Besides the error in the water shader, the player was seeing a bigger chunk of the level making the game super easy to win. What was happening was that I was using a 2x scaling factor on a 4k monitor. If it wasn’t for the water shader problem, I probably wouldn’t have known what was happening on high-res monitors.

This got me thinking on how to best tackle this on the million different types of resolutions / aspect ratios.

Let’s start with the simple one: Aspect ratios. I’m targeting mainly 16:9, but there are super-wide and fatter aspect ratios. The most important thing is the height of the game. Seeing more horizontally shouldn’t give such a big advantage.

Next is different resolutions and there are basically 3 options:

A) scale the graphics by a round scaling factor (x2, x3, x4 etc),  depending on the resolution of the screen

B) stretch to keep the design height with NO bilinear filtering, but this introduces some pixel duplication, or even decimation

C) stretch to keep the design height WITH bilinear filtering, but this introduces blurriness.

So even though some monitors will have a bit more vertical, or more horizontal, I’m going to stick with option A.

Also here’s a sneak preview of the new lighting WIP