Classic Jigsaw Puzzle

Showcase
1

Hi I want to share my newest game.

It’s a classic jigsaw puzzle made with Phaser 3.

Here to play: https://oliver77.itch.io/fantasy-jigsaw-puzzle

Comments are appreciated.

Thanks.
poster

3 Likes
2

Congratulations, It’s great game.
Here’s few things that might help you improving the game:

  • being able to snap piece onto white space is neat little trick to easily win game.
    – It would be great If you could make that piece only snaps to already placed piece
  • I’ve also noticed that each piece is loaded as separate image resulting in larger loading time(since multiple http request is slower than single big one) and unnecessary extra draw calls because of texture buffer overload.
    – It would be great if you could combine all images into texture atlas or even better add feature to slice any image into puzzle pieces during runtime. That will make implementing new levels much easier and neat
  • What about adding onion skin view of image as hint?
3

Hi what is a texture atlas?
Like a sprite with 2 dimensions?
I load the images like this:

const maxlevel = [12, 12, 18, 12, 12, 12, 35, 40, 35, 35, 35, 35, 63, 56, 63, 63, 63, 63, 63, 63];

        for (i = 0; i < maxlevel.length; i++) {
            for (z = 0; z < maxlevel[i]; z++) {
                let x = i + 1;
                let y = z + 1;
                let a = 'level' + x + '-piece' + y;
                let b = 'img/level' + x + '/level' + x + '-piece' + y + '.png';

                this.load.image(a, b);
            }
        }

it’s just few lines of code to load all puzzle images.
I don’t know how to slice the pieces programmatically - that’s not an easy task.

4

Hi @Oliver77,
It’s awesome.
How can I make the jigsaw puzzle like yours?
Can I get the code?

5

Nice game! :slightly_smiling_face: