Tile maps
These sketches are an exploration of how to create tile-based map generation systems.
512 Grid
If the rules for placement of tiles only consider tiles that are one to the side or diagonally, then 9 positions need to be considered (including the center tile). If there are two options for each position (e.g land or water) then in total there are 512 (29) possible combinations. Not all of these are unique however, because many are rotations etc.
I started thinking through how to iterate through all the combinations by visually representing the grid of options. This produced some interesting visual results. 512 tiles are produced in total.
I tried turning these into a poster, but when they were ordered by the underlying binary representation there was not an even gradient from least to most pixels. You can think of 100000000 and 000000001 as both representing a single filled corner, but one is much larger than the other. To fix this, I used p5js to count the number of white pixels in each image and ordered them based on this. This let me create a poster with a more even gradient. I wrote a simple processing sketch do generate the pdf (sketch_512_grid.zip)
I also used my ‘zine-layout’ processing sketch to turn the images into a 16 page code zine. I wrote another small processing script to do some pre-processing to collate the individual images into groups of 32 (sketch_512_zine_imgs.zip)
Generate tiles
This sketch loops through all the possible combinations of water/grass for the outer squares and saves all the unique tiles (accounting for rotations).
There are 30 unique tiles in total.
This poster displays them in a grid.
Next steps
- Create a lookup table that you can use to choose the right tile for a square depending on what it’s neighbours are. This should also tell you how to rotate. This would let someone hand-draw the 30 tiles to create their own maps.
- Print and cut the tiles to make a ‘morpholo’ game.
- Not all tiles are equally likely. Could I figure out the relative frequency to decide how many of each tile to print for a ‘fair’ deck?
- Add other elements (e.g. roads and bridges?)
Related links
These videos on ‘wave function collapse’ were in the back of my mind while I was playing around with the tiles. That is a more general approach, but it reminded me of this in terms of the idea of constraints.
EPC2018 - Oskar Stalberg - Wave Function Collapse in Bad North
- https://www.townscapergame.com/
- https://www.gamedeveloper.com/blogs/how-townscaper-works-a-story-four-games-in-the-making