You are browsing as a guest. Sign up (or log in) to start making projects!

Puzzel3D

  • 1 Devlogs
  • 0 Total hours

This is a simple web based game in which we can use facecam to build a live puzzle of our photo and then try to solve it. I have introduced different difficulties in it.

Ship #1 Changes requested

Puzzle Cam is a cool webcam game that you can play with your hands. You do not need a mouse or keyboard to play this game.

To start playing you need to hold up both of your hands to the camera. The Puzzle Cam will then count down. Take a picture of your face. After that it will break the picture into a puzzle. You can use your hands to fix it. You can move the pieces around by pinching them with your thumb and index finger. When you fix the puzzle you will get an white picture that you can download. The Puzzle Cam uses web technology like HTML and JavaScript to work. It also uses something called MediaPipe Hands to track your hand movements and Canvas to show you the puzzle.

If you want to try the Puzzle Cam you can do it by opening the file on your computer and allowing the camera to work. Then you just need to hold up your hands and start playing. If you do not have a webcam you can still see how the game works by opening the simulation.html file. This file will show you a person playing the game so you can see how it works.

The hardest part of making the Puzzle Cam was getting the hand tracking to work perfectly. It was also hard to make sure the game did not get confused when you were moving the pieces around. We also had to make sure the game worked well on all kinds of devices even if they are not very powerful.

  • 1 devlog
  • 0h
Try project → See source code →
Open comments for this post

25m 25s logged

Building this project so as to understand the basics of the media pipeline so i can make more creative hand interactive projects. This is a very simple project in which we can use our webcam and hands to make puzzle live on screen and then play with hands and pinching fingers.

The project is live at : https://lakshyabadjatya.github.io/Puzzel3D/
Source Code: https://github.com/LakshyaBadjatya/Puzzel3D

0
0
10

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…