Scene Construction

I’ve reached a point in development where I need to finish the environment art before I can continue (you’d be surprised how far you can get with no art! …heh…) Right now I’m working on the first environment of the game — a city. So far I’ve got the exterior done, which looks something like this.

I thought it might be interesting to break the scene down a bit in terms of how it’s constructed and displayed, so that’s what I’m gonna do! Warning, some sizeable gifs coming up.

There are two main components to the scene here: the background and the foreground. The background is just a series of large images that repeat over and over, giving the impression of an endless environment. The foreground is made using a tileset. For those not familiar with them: a tileset is like a collection of images (or “tiles”) that are used as building blocks to create your level.

It’s kind of like a jigsaw puzzle where you have an infinite number of each piece. You keep laying them out to make the picture you want.

There are two layers of tiles in the environment — one goes behind Wryn, and the other goes in front. Here’s an animation of everything coming together.

You can see a final, third layer of tiles come in at the end. That layer is usually hidden from view, being used to tell the game where the floors and walls are. Here’s another view of the scene breakdown, because I like images.

Finally, a few cool things going on behind the scenes:
-You don’t want to draw the entire level’s worth of tiles at once — levels can be really large, so that’s a lot of work for the GPU. Instead, the game only draws the tiles that the camera can see.
-The images in the background move slower than the tiles, and they all move at different speeds — this is called “parallax scrolling” and it gives the scene the illusion of depth.

Only tiles in range of the camera are drawn, and the backgrounds move at different speeds.
You never notice the rest of the world is being hidden, and the moving backgrounds create the illusion of depth!

Aaaand that’s how my scenes are put together! When I get further in development they’ll look more dynamic and exciting, although I’m not there yet… I mostly just wanted to share how things were coming. I guess I’ll stop slacking off and get back to it!