Need Help with Dynamic Grid Borders and “Carved” Effect for a Puzzle Game

Hi everyone,

I’m working on a 2D puzzle game in Unity, which essentially consists of a grid of pieces. I’m unsure about how to achieve two things:

  • Dynamic Borders: I aim to add borders around the non-empty parts of the grid. Empty parts can be on the outer edges or within the grid. I want to make these borders dynamically adjust as the grid changes, with curved edges. Does anyone have suggestions on how to implement this, maybe using LineRenderer or another something?
  • Carved Effect for Pieces: I also want to give the grid a “carved-in” appearance to make it seem more 3D, with a carved-in effect for occupied spaces and a carved-out effect for empty ones. Again, I’m uncertain about the best approach.

Here’s an example that illustrates quite well what I want to achieve, except that the grid is carved out (but I’m guessing achieving it is similar): https://i.pinimg.com/originals/da/79/e6/da79e66967a2205e8a2363d6207ae25a.gif

I’m a newbie so any tips or resources to achieve these effects are welcomed. Cheers!

I suspect that this can be done in completely different ways and with different tools. But if you don’t mind putting in the effort and also leveling up your programming skills, I suggest the following approach.

The entire field consists initially of rounded cells, and you consider this field as a two-dimensional array (for example, where 0 represents an empty cell, and 1 represents an occupied one):

Then you need to traverse all intersections of cells and come up with rules for adding sprites to these intersections. For example, a sprite in the shape of a rounded star

should be placed at every intersection where at least two cells are occupied diagonally,

while a sprite in the shape of a half-rounded star

should be placed at intersections where only two cells are occupied on one side

I deliberately made the sprites different colors for clarity. If the color is the same, the map looks more cohesive

You can create such maps entirely from code or partially. For example, you can manually sketch only the basic cells, and all the necessary “holes/gaps” will be filled when the level starts, or directly in the editor by invoking the fill method from the context menu.

I also think that you can even create your custom window where you can draw the field cell by cell, and then press the “magic” button, and the editor would automatically create the finished field on the scene. But that’s another story.

1 Like