Seams in jigsaw puzzle help

I’m having some issues with making a jigsaw puzzle for use in Unity. I created the models like this

  • Import svg of a bunch of custom puzzle pieces all aligned into Blender
  • Select all pieces and Convert to Mesh from Curve/Meta/Surf/Text
  • Select each pieces Face then (F) Fill
  • UV map all pieces to image from bounds

At first I thought this would work because in Blender everything looked solid with no seams or gaps in between the pieces, but once I got the exported fbxs into Unity I noticed there are tiny gaps/seams that flicker in and out between the pieces.

So in Blender I went back and if I select all the puzzle pieces and join them together as one with Ctrl +J I can see that are actually tiny seams between the pieces. How can I model this pieces from the svg without getting these seams/gaps in between the pieces? Any advice would be appreciated, thanks.

I don’t now why you would like the pieces perfectly together. This would look like a square with an image on it. If that is what you want, I think one way of achieving it is by turning on snap to vertex and open the edit mode of every piece and then move all vertices to the vertex of the neighbour piece. But due to floating point number inaccuracy and intersections it would look awful (flickering). I would make all pieces a little bit smaller so that there are no intersections and then I would bevel the top edge. Theb it would look like a real puzzle.

I need them to fit together perfectly because each piece is a separate mesh/fbx puzzle piece in engine which is then jumbled around, when they are all dragged in the right spot it should look like a square completed image, but without these seams. So I’m just trying to to find a way to model all these pieces from the svg so they can fit together seamlessly in engine without seams and flicker.

Check the line size in the SVG…if you have inkscape or something like it you can select all and then make sure fill is set to none, and line size is small something like .5 or smaller…I personaly use .2 or .002 at times to send to a cutter …the thinner lines give you a better cut.

Ok so I got this working, I think when I try make the models by converting the SVG to mesh, the overlapping paths in the svg cause the verts to be slightly off where the pieces connect, which cause the seams in engine. What I did instead was create a plane and Knife Project the SVG curves onto the plane, edge split, then separate. No seams in engine anymore. This works fine for the smaller size puzzles but I did have to take @RSEhlers advice for the bigger size ones and change my svg strokes to a smaller value 0.2 or less to fill in the seams on those. Cheers.

That is EXACTLY how I went about doing this! Glad you got it working for you!

1 Like