Callum Thomas
having a slow weekend start · 8:39 am Melb
← All workCT-08 · Personal

Personal · API · Next.js · TypeScript

Sliding Tiles Puzzle

Retro sliding tile puzzle game with multiple grid sizes.

Drawing
CT-08
Type
Personal
Built with
APINext.jsTypeScript
Live
sliding-puzzle.callum-thomas.com ↗
Source
caltho/sliding-puzzle ↗
A retro and nostalgic sliding-tile puzzle that brings back the excitement of your childhood. With five grid sizes to choose from, the app offers a challenging yet entertaining experience. It uses the Unsplash developer API to fetch random images for the puzzle, then scales each image based on its aspect ratio so it fits the puzzle pieces regardless of source resolution.

Building the puzzle board introduced some interesting game logic — only half of all randomly generated puzzles are actually solvable. The trick to a randomised-yet-solvable puzzle is calculating the parity of the generated array and swapping any two pieces if it comes out unsolvable. More on the solvability of sliding-tile puzzles is referenced here.