Game Journal #135 - Alignment

This one's a bit of a brief update. I could summarize it in one sentence as "I finished up standardizing all the large level backgrounds", but there's a bit more to say about the process so I'll give it a couple paragraphs before I push send and get some dinner in me.

In my last gamedev update I posted about standardizing all our small background assets- uniformly square single building segments- so they all fit on a 100-px grid.  There's a few kinds of background element in the game, they go like this:

There's the standard background piece, a building with a bit of floor beneath it

There's the standard ground piece, which is modular so you can mix and match ground elements with the standard backgrounds

These are the ones I adjusted last update so they were all scaled to increments of 100 pixels in width and height.

To supplement the standard pieces we have large backgrounds, which are longer stretches of more specialized art so the world feels like a world and not just a string of boxes

These have their own floors baked into them.  They're easy to adjust since they're the same height as a standard unit, just wider.  To make sure they all lined up well I actually went and cut a vertical slice from my standard size template with exact pixel positions for the sidewalk lines and the lines in the road.  I think I mentioned before but to maintain all the art alignment I expanded my canvases outward from the top left corner, which meant I was adding a defined width to the bottom stripe in the road now, so that needed to be accounted for in everything else I standardize.

Another type of background is the small angle.  These are slight deviations in the road to help keep the levels from all just being permanent straight lines

What ended up happening here is these files were originally already designed with a width that was a multiple of 100, so they only needed their height adjusted.  That part was easy, but the tricky part was even though I was expanding my canvas downward to the nearest 100, all the ground details still needed to correspond to the same distance from the tops and bottoms of the screen that they would in a standard-height piece.  I pasted my vertical slice reference stripes in from a standard template and you can see how some of the alignment was not quite where it needed to be:

On the right is the standard stripe position rooted to the ground tiles, and on the left is the original position of the road stripes after expanding my canvas.  I didn't save my before and after shots but you can see that in order to make the new background dimensions align I needed to do some cutting and sliding.  It all worked out, though, which I'll share in a moment.

The last kind of background I have is the extremely large bend in the road.  These are inspired by the "vertical" sections in Streets of Rage, where you have a larger play field and a wall to bounce people off of

In order to get these ones to line up I needed to cut and shift whole sections of building to nudge a few pixels upward, getting the stripes to line up correctly just like with the slight angle cases above.  Pulled back like this it's almost an imperceptibly small difference between a previous time you may have seen these art assets and now, but with everything aligned to a 100px grid then our modular stage plan is actually squared up to start working.

So what this all means now is for these larger vertical sections, we can take a standard-height piece, align it with the top or bottom edges, like so with the top part of the above section:

.. and the bottom part of the same section..

.. then all the lines match up just how we need them to!  Pretty cool, huh?

I'd done a standardization pass before to make everything a uniform size within its subgroup but this second pass to make sure everything was an even 100 pixels means that the art should finally be where it needs to be, and our gameplay containers are ready to fill with action again.

My next plan is to begin colorizing some sprites, and I have an idea where to start with that, so the next gamedev update should have some fun new details to share.  Until then, thanks for sticking with us on this long and challenging road.  Have a good weekend!