AR Slide Puzzle

AR Demo

Idea

So I did this flutter slide puzzle hack using AR. It has rubber ducks representing numbers and you can move around the ducks in AR. It has cool animations as well as a confetti animation and sound screen at the end when you complete the puzzle. You can turn on random moves maker, shuffle the puzzle or change the distance between you and the puzzle. It shows you the total moves you have made as well as the ducks that are still left to be placed at the right position. It also has an easter egg. (At the end)

Inspiration

I saw a flutter conference where they made an AR app using flutter. I found it really cool and that's when I decided ok ill try something with it. Cut to today, I made this flutter slide puzzle in AR.

Dependencies

Overall it was a really smooth experience. Adding AR to flutter was really easy with the help of arcore_flutter_plugin. Currently, it only supports android but with the help of ar_flutter_plugin which is based on arcore_flutter_plugin, we can add IOS support. (I did not have a device to do that). I used vectary website for creating the 3D models. I took an open-sourced sample rubber duck model and changed it according to my needs. Gave it a signboard with the number. If you complete the puzzle there are confetti animations and winning sound for which I used confetti. For the puzzle logic, I used Kevin Moore repo slide_puzzle as starters which helped a lot as I built my project on top of that. So shoutout to him for an awesome project @kevmoo.

Working

The goal of the game is to arrange the ducks in increasing numerical order. You can click on the ducks to move them. If they can be moved they will slide to the position with animation. Or will give back a kick animation if it is not able to move. You can turn on the random motion, which will randomly make moves. You can change the distance between you and the puzzle with the help of a slider. You can shuffle the whole puzzle. You can also reach the end by clicking on 4 ducks that cant be moved. It will automatically take you to the second last move. It shows you the total moves you have made as well as the ducks that are still left to be placed at the right position. In the end, it shows a win screen with confetti and sounds.

Easter Egg

If you click on 4 ducks that cant move, the puzzle will automatically complete and take you to the second last step with 999 moves and you can play the last move to win the puzzle.