Tiles, Lighting, and Art
Hey folks! Hope everyone had a good weekend. I sort of violated one of my rules this weekend and did some work in my brief free time. I had a real hankering to work on some pixel art spaceship stuff, so I couldn't help myself.
Up until now, I've been using a hacked-together, green ship layout tileset I made many years ago. It was a 10x10 grid tileset I bumped up to 32x32 crudely. Neither the art style nor the quality were my goal, so I set about working on some bespoke 32x32 tiles for this prototype.
Here's a shot of what I came up with:
Now there's a lot going on in this pic, so let me break things down.
First, the new artwork. I drew some new tiles which combine a white exterior cladding with rust-colored girders/structure and blue-tinted interior walls. The floor is also a rust-colored grating. I think it's a big improvement over the old tiles, for sure, but still pretty basic. Even so, it's a step in the right direction, and more importantly, has revealed some new questions I need to answer about the game. But let's put a pin in that for a moment.
The second thing you'll notice is that there's a big white line down the center. This is where the image is split between a flat "diffuse map" renderer and a "lightmap" renderer. (A crude lightmap, but bear with me.)
"Diffuse map" just means the tiles are drawn without any shading. The input images are drawn on-screen as they appear in the files. This is on the left.
"Lightmap" means the tiles are tinted according to nearby lights. Some tiles can block light (such as walls) while others don't (like floors). This is the right side.
Now, this may not be the best map layout to illustrate, but it's what I screengrabbed, so we'll work with it. Notice that the left side is the same brightness everywhere, and doesn't look too bad. The right side, on the other hand, has variable brightness, including a completely dark room. You can also see how the lights affect nearby walls and floors, with the tiles getting darker as distance from light increases.
Here's where the question comes in. Notice how the lights inside the ship are illuminating the outside cladding of the ship? It's also happening on interior walls, but the walls are darker so it's hard to tell.
This is due to the way I've drawn the tiles. In this tileset, a single tile can "straddle" up to three materials. E.g. an outside wall has 1/3 cladding, 1/3 rust-colored structure, and 1/3 interior blue wall. However, the lighting engine doesn't know that. It just sees a single tile, and lights the whole thing.
So my next experiment was going to be creating a tileset where each tile is a single material. One whole tile for cladding, one for structure, and one for interior wall. In theory, this would mean exterior cladding (and even the rust-colored structure) would remain unlit in such a tileset, and the lights would only affect interior walls. It would also mean that interior dividing walls could be lit separately from either side.
However, the trouble I'm running into is that 32x32 tiles look way too "thick" for each of those materials. In order to have a double interior wall (like we see between two adjoining rooms above), that'd be 64 pixels thick. And with humans only 32 pixels wide, that's one heck of a thick wall :)
(I can sort of bypass this problem on the outside cladding since only one side of it needs to connect to structure. The other is exposed to empty space, so I could make them less than 32 pixels thick, if desired.)
Now, one's first instinct might be to "just make humans bigger than 32 pixels" and/or make the tiles smaller than 32 pixels. However, then we start to run into another problem: the game gets a bit weird when the human size doesn't match the tile size. Humans start clipping through walls when they walk around. E.g. they'll see that a 16x16 tile is walkable, and move into it, but they'll overlap into the adjoining wall tile without triggering any problems in the pathfinding code.
It's probably solvable, but it breaks with Flixel's standard pathfinding algorithm. So I'll need to write my own code atop it if I want to do that. Not sure if it's worth it. (Then again, I'm already writing my own stuff for the lighting, so maybe...)
Anyway, food for thought. It was a welcome break from boring UI and data-parsing work, though :)