Image Sliding Puzzle

How to Play the Sliding Puzzle

Welcome! The goal is to rearrange the image tiles to reconstruct the complete picture, leaving the last space empty.

Avalaible images are set with data-images attribute for the game container (see HTML file)

Puzzle image is selected randomly between images in dataset-images

When puzzle is solved a message appears above the board and the complete image is shown

Selected image is shown for a while before game starts

Instructions:

1. Choose Puzzle Size: Use the buttons below the puzzle grid to select your desired grid size (e.g., 4x4, 4x4, 6x6).
2. Shuffle: Press the "Shuffle" button to randomly rearrange the image tiles. This will start a new game.
3. Move Tiles: Click on any tile that is directly adjacent to the empty space. The clicked tile will slide into the empty space.
4. Reconstruct the Image: Continue moving tiles until the entire image is correctly assembled, with the empty space in the bottom right corner.
5. Track Moves: The move counter displays the number of moves you've made. Aim for the lowest number of moves to solve the puzzle efficiently.

Tips and Strategies:

• Start by identifying and positioning the corner and edge pieces to create a frame.
• Focus on grouping tiles that contain similar colors or recognizable features of the image.
• Be patient! Complex images may take time and careful strategic thinking to piece back together.

Have fun playing the Sliding Puzzle!