For a project a classmate and I were tasked to create a game prototype based on an 80’s arcade game, with a fresh new isometric look.
We decided to go with one of those smups, with a scrolling terrain.
I came up with a system that would display a scrolling blocky terrain.
SCROLLING TERRAIN
Because of limitations, we couldn’t load in every block at the beginning of the game, so I had to come up with a system that would require only as many blocks as you could see on the screen, without dynamic loading.
In this gif, the desired effect is shown:
As you can see, the blocks only move forward and snap backward, but if we cover the ends, it looks like the terrain is infinitely scrolling.
Of course, we can achieve this by making the position dependent on a timer, like so:
float offsetX = (timer % 1) * blockWidth;
Now we have scrolling terrain!
TERRAIN LOOKS
When I presented this scrolling terrain to my others, of course the idea of random terrain generation came up. I decided against this, as it wouldn’t allow for as interesting levels, compared to making a heightmap and color map yourself.
Here’s the heightmap of what is supposed to be something like Central Park, NY. And here is the result:
Here is the code to sample the pixel for the color map, in Unity speak.
colorMap.GetPixel(cubeX, cubeY + (int)timer);
The x value would always be the same (the sample map would be upright), but the y value would be different every time the cube snaps back. We can get this value by integercasting (or flooring) the timer.
Same of course goes of course for the height map.
Some more results:
THE BACKGROUND COLOR
The background color was an interesting one. I felt like sampling all the pixels from the color map on screen would be a bit too much, so I decided to go with a more chaotic implementation.
First, I would sample 4 random samples from the color map that would be visible.
Them I would average these 4 colors into one color, and call this desiredColor.
this desiredColor is then lerped with a member Color called backgroundColor, with desiredColor having only very little effect.
backgroundColor = Color.Lerp(desiredColor, backgroundColor, 0.98f);
Now, the background color will be a smooth transition from area to area. This color is also applied to the ambient light color, to give the effect of indirect light.
The indirect light makes a massive difference on the mood of the whole level:
And there we have it! An aesthetically pleasing scrolling terrain, at low cost!