Anatomy of a Tile

When building a game, one of the first questions you have to deal with is how the player will move through your world. There are two main ways to approach this: continuous movement, and tile based movement. Continuous movement allows the characters to move as much or as little as they want, similar to movement in the real world. Most modern triple-A games allow this kind of movement. Tile based movement, on the other hand, constrains how the player can move to a specific collection of tiles. Tiles are reminiscent of physical board games, and earlier generations of video games.

From the beginning, we wanted Rads & Relics to be tile based. Part of this is the simplicity of coding tile based systems, but a bigger part is the historical precedent of similar strategy/tactics games (XCOM, Into the Breach, Civilization).

Tile Types: Squares, Hexagons

Knowing that we wanted to work with tiles, the next question to address is what kind of tile to use. While there are an infinite number of possible tilings [1] almost all games use one of two systems: squares and hexagons.

Squares are a natural choice for tiling. They map very cleanly to 2D coordinates and what we think of as the cardinal directions. If your character is in a square it has obvious neighbors left, right, up, and down. However, the complication arises with the diagonals. The squares on the corners don’t share an edge, just a single point. If you consider these to be adjacent, they are further away from the source (sqrt(2) instead of 1). All of this can be addressed, but it adds complexity to a seemingly simple shape.

Hexagons address this concern with neighbors. Each Hexagon has 6 neighbors, they all share an edge, and are all the same distance away. However, they no longer cleanly map to 2D coordinates or simple directions.

Plenty of excellent video games (and board games) have been built on a hexagon grid, but for Rads & Relics we’ve decided to stick with squares. Once again, this is primarily driven by genre expectations, but we also think that we can handle the adjacency cleanly enough to stick with a square grid.

Tile Layers

Having decided on our tile grid, we needed to think about how our tiles would interact with the world. At the most basic level, each tile has a type (e.g. a grass tile) and you can just place your characters, trees, etc. on top of that. Before this week, that’s exactly what we had. But, as we’ve continued to build out the game we’ve quickly run into limitations with this approach. We want to support specific gameplay effects on a per tile basis (e.g. a radioactive tile), we want to show specific tiles specially in the UI, and we want the tiles to have a bit of flavor to them outside of their basic type. To support all of these goals, we’ve split a tile into four different layers.

• Terrain: The basic “type” of tile, these can have some impact on specific abilities/characters. Examples: grass, dirt, stone
• Decoration: These are specific things that will augment a tile, but not impact gameplay. Examples: rocks, blood spatters.
• Effect: This is used for specific effects within the game, independent of the base terrain. Examples: irradiated, electric
• UI: This is where we can give hints to the user about the state of a given tile.

Each of these layers is combined and then finally the characters and other entities are drawn on top. By splitting up these layers, we have a much greater ability to mix and match different tile visual and game effects.

State of the Game

• Current Progress
  • Tile layering overhaul
  • Map editor to experiment with new tile system
  • Strategy layer prototype: added a map that allows you to move between different fights, and the ability to upgrade your party between fights.
• Upcoming
  • Improved pathfinding and range detection
  • Improved enemy AI
  • Additional enemy types
  • Code refactoring to support fully reactive UI

Further Reading:

• http://www-cs-students.stanford.edu/~amitp/game-programming/grids/: A much deeper dive into the pros and cons of different grids.
• https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps: A decent overview of tile based systems broadly.

[1]: https://en.wikipedia.org/wiki/Tessellation has a lot more information about different tilings. I am interested in the use of non-standard tilings in games, but that idea goes in the Someday folder.