Overview
For this week’s assignment, I utilize the idea of “abstract” buttons and PoseNet with the help of oop concept to create an interactive screen game. In this game, the player is able to control the poke ball on screen by moving their face in front of the computer to try to catch the pikachu. When the poke ball is close to pikachu, the color of Pikachu will become lighter, indicating that the player is close to catching pikachu. When the player catches pikachu, a poke ball will appear under the specific pikachu. I used class() to design the “pikachu” object and wrote an array to hold the object. The number of Pikachu appearing on screen is limited and the pikachu will disappear before it reaches the border of the canvas. With the help of PoseNet, I’m able to get the coordination of player’s face, in my case, I used the coordination of the nose of the player to calculate the distance between the pokeball and the Pikachu and wrote the checkInteraction() function to design the game.
Technical Problem
The biggest problem I met during the process of creating the game is that I found it very difficult to get an accurate distance between the coordination of player’s nose and Pikachu. When I used MouseX and MouseY as condition, the distance between pikachu and the mouse is always very small and accurate. However, when I used Posenet, the number it gave is always above 100. I’m not sure why this is happening. In addition, there always seem to be a 0.5~1s delay when playing the game. I think it might be because the order of some of the code I wrote still needs improvement, but I can’t find what the errors are. The code of my project can be found here.