Game Overview
Queen of the Hill was created by Milo Fisher, Paul Lee, Jared Nolen, Jalen Pastor, William Propp, Alexander Shaham, and Alexis Sanchez and was made for the Game Design Studio class at UC Santa Cruz. In this game, the player plays as a rising ant civilization, controlling the development of its society. The player can choose to focus either on military development, scientific development, religious development, or any combination of the three. To advance in the game, the player must partition their ants and sugar grains to buy various upgrades, unlocking new means of progression through the game. Finishing one of the development branches' upgrade lines result in a unique victory. This game was originally made for a 2 week project at UC Santa Cruz in which our team was tasked with making an idle game prototype using only vanilla JavaScript, HTML, and CSS. To accomplish this, our game was built in JavaScript using my own personal lightweight game library. The library handles rendering of sprites and sprite sheet animations as well as game buttons and text objects that can all be moved and layered during runtime. The library I made sped up our development significantly, allowing our team to create a more polished game than the prototype we were tasked with creating.
As a side note, this game has had over 1800 players and 2500 viewers on itch.io in under a month, which is roughly 900x more popular than my next popular game on itch,io. Our team really enjoyed making this game and we were very happy to see the positive feedback the game has received.
This image shows the upgrades tab, with the general branch upgrade "Permanent Mating Season" highlighted.
This image shows the upgrades tab, with the science branch upgrade "Organized Research" highlighted. Note the background changes during certain population increase milestones.
My Contributions
On this project, I was the lead programmer. To meet our project requirements provided from out class, our team was only able to build our game vanilla JavaScript, HTML, and CSS within a 2-week timeframe. Any pre-existing game library or engine was forbidden, so to get around this hindrance, I created my own lightweight JavaScript game library, Milo's Game Library. My library streamlined the use of HTML canvas elements, formatting them in a familiar game engine fashion, enabling sprite and sprite sheet animation rendering. The library allowed sprites, sprite sheet animations, buttons, and text to move, rotate, activate, resize, and re-layer all during runtime. Our team used these elements to implement our whole game.
As the lead programmer, I oversaw and assigned the programming work for our team, as well as handling any code merges on our Github. I personally implemented the UI functionality, as well as the game's upgrade system. For the upgrade system, I implemented an external JSON file interpreter. The interpreter reads in the external upgrade files for each of the game's branches (general, military, science, and religion) and then creates the upgrade buttons, giving them their names, descriptions, costs, requirements, and images. Other features I implemented were the various effects of the upgrades, as well as the idle aspects of the game, such as the passive generation of resources. I made global variables to handle the different cost reductions, resource generation rates, and the different resource caps. The upgrades each altered these values accordingly when purchased to provide their unique boons.
The Sprite game object from my game library:
Note the object uses an HTML canvas Image to draw the object, but the rendering system in the library clears and redraws the images each frame. Every time the objects are redrawn, they are drawn with updated coordinates, dimensions, layer, rotation, and visibility.