Match, originally Color Browser, is a digital adaptation of a game that I made for my physical computing and alternate interfaces class. The objective of the game was to match the RGB values of one color. The arduino version just keeps generating random colors and goes forever.
This adaptation would have a lot more features, and will be playable with friends. The game falls within the casual puzzle genre. The game is currently under development for computer browsers and will be optimized for mobile devices with touch controls. It is being done in pure JavaScript and Canvas. The hardest work I did for this game was programming and creating all the UI elements from scratch. I made my own sliders, and I made my own buttons, allowing for different variants.
The game was originally planned to have a random mode where the player will be able to just constantly guess colors, in spirit of the original game. That has been since changed to practice mode, the first fully finished mode of Match.
The play mode is a mode that is nearly finished at the moment. A list of levels is loaded in play mode and the player can see how many levels they can beat. Currently there are only three levels. However with the way it is set up to load levels in, new levels can be generated quickly. Additional modes would be VS modes where friends can make colors up for the player to guess, and a speed mode where the player can see how many guesses they can get before time is up. This game has limited images used, and will be a majority of canvas drawing.
Programming the Sliders, one of the several UI elements made from scratch by me
Original physical prototype for the game
As I stated before, all the sliders and buttons were programmed from scratch right at the start. I knew that this game would be UI heavy, and being the person that is interested in UI, I decided to tackle it myself. I could have simply used HTML buttons over the canvas, but I wanted to program the logic myself. It was a great learning experience for JavaScript programming, Canvas drawing, and UI logic. This project really helped improve my debugging skills as well. JavaScript is a tough language to debug, however Google Chrome has a fantastic console debugger that allows you to follow every part of your code easily.
A semester later, I ended up writing a level editor for this game, as well as leaderboards and redeploying the game as a Node.js web application.