Week 12

Interface and application programming

For interface and application programming, I want to redesign and improve a game I made previously.

The game is a 1D game of cat chase mouse, I made a reference to Tom and Terry so that people can understand the game easier.

The logic of the game is that Terry (the mouse) can walk one step at a time but can teleport between the mouse holes represented by the black pixel in the array. Jom is the cat and is more nimble than the mouse so he can move 2 steps at a time. The goal of Terry is to eat the magical teleporting cheese while the goal of Jom is to catch Terry.

The video below shows the first prototype:

I wrote this in P5js and the logic the first prototype is very simple since it is just one line of pixels. However, one aspect of the game I want to change is the overall design. Instead of a black background I think it would be more interesting if the color scheme could be more representative of Tom and jerry.

Another problem with this first version is that the cat would jump over certain pixels and completely miss the mouse.

This is the code for the game, I use an extension in visual studio code called live server to run my game as an html. Because there is many js files I only put a screenshot here.

Here is the final design, I added color scheme of Tom and Jerry and made Jom the cat jump two spaces and made him two pixels instead of 1 make him cover more surface area.

Left: Terry win. Right Jom win.