So I'm making a game with a regular hexagon map. Now the difficulty is in creating seamless tiles. With square tiles, I can make the tile in Photoshop, then use Offset to correct the edges, but I can't do the same with hexagons.
I was wondering what method you guys use to make hexagon tiles?
Cheers
Seamless hexagon textures
There are two different type of ways to seamlessly tile hexagons.
The first way makes them create a pattern from left to right. The top edge must match the bottom edge, while the upper left diagonal matches the lower right diagonal and the the upper right diagonal matches the lower left diagonal. You can accomplish this by starting with a square where each quarter is a mirror of the others, then trimming the square into a hexagon.
The second way is to create a hexagon with 6 way radial symmetry. That means it has 6 wedges which are mirrors of each other, each wedge being a 60 degree angle.
In either case, you can create your hexagon in photoshop by creating one quarter or wedge, then copying and pasting it, rotating the pasted wedge 90 or 60 degrees, then pasting another one, and so on until you have your hexagon or square which can be trimmed into a hexagon.
The first way makes them create a pattern from left to right. The top edge must match the bottom edge, while the upper left diagonal matches the lower right diagonal and the the upper right diagonal matches the lower left diagonal. You can accomplish this by starting with a square where each quarter is a mirror of the others, then trimming the square into a hexagon.
The second way is to create a hexagon with 6 way radial symmetry. That means it has 6 wedges which are mirrors of each other, each wedge being a 60 degree angle.
In either case, you can create your hexagon in photoshop by creating one quarter or wedge, then copying and pasting it, rotating the pasted wedge 90 or 60 degrees, then pasting another one, and so on until you have your hexagon or square which can be trimmed into a hexagon.
Mathematically, hexagonal tiles are equivalent to rectangular tiles, and you can convert seamlessly tiling rectangles to hexagons by rearranging pieces and adding appropriate transparent padding (a good job for image editor scripting).
I think the simplest rectangular tiles to convert are as large as two hexagons (an aspect ratio of sqrt(3)to 1 for regular hexagons), with one of the longest hexagon diagonals parallel to the longer sides of the rectangle.
You can carve such a rectangle into two hexagons using five pieces (a whole hexagon in the middle, the other split into four quarters lying at the corners) or four (an hexagon split along a diagonal and the other split along the perpendicular direction).
Tile shapes that don't fit together might be a bigger threat to seamless tiling of hexagons; there are the same issues as in isometric tiles.
I think the simplest rectangular tiles to convert are as large as two hexagons (an aspect ratio of sqrt(3)to 1 for regular hexagons), with one of the longest hexagon diagonals parallel to the longer sides of the rectangle.
You can carve such a rectangle into two hexagons using five pieces (a whole hexagon in the middle, the other split into four quarters lying at the corners) or four (an hexagon split along a diagonal and the other split along the perpendicular direction).
Tile shapes that don't fit together might be a bigger threat to seamless tiling of hexagons; there are the same issues as in isometric tiles.
I had to give this one a go. :)
I created a new 580px x 1000px in Photoshop.
Tiled it along the short edges.
Made a new 1k square.
Dropped the tile in the center.
Made two more copies.
Rotate the copies 60deg and -60deg
Made the copies layers and softened the edges.
Scaled it to fit the texture file.
and tiled.
(If you can somehow use this image you're welcome to it.)
I created a new 580px x 1000px in Photoshop.
Tiled it along the short edges.
Made a new 1k square.
Dropped the tile in the center.
Made two more copies.
Rotate the copies 60deg and -60deg
Made the copies layers and softened the edges.
Scaled it to fit the texture file.
and tiled.
(If you can somehow use this image you're welcome to it.)
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
