JavaScript | HTML | CSS

Ancient Avians is a web app designed and developed entirely by myself. This is my largest project to date, with a combined 100 hours creating all of the visuals plus writing and testing the code to make it functional. The game itself was a fun, goofy way to excercise my existing coding and design abilities while also to improve my skills in JavaScript and learn more about how to implement the language into front-end development and design.

There were three major areas of functionality I needed tho achieve in order to bring this whole project together, those being: player movement, equipment mechanics, and battle mechanics.

The first of which was relatively easy to implement through the use of JS event listeners and CSS positioning, while the latter two involved variables and a decent amout of maths, which turned out to be more complicated than I had originally anticipated.

Achieving the functionality of having an equipment piece's stats apply to the player's when equipped, but also having these stats be replaceable later down the line proved to be more challenging than expected. In the end, it was just a matter of setting a whole bunch of variables, but it took a lot of thinking to get to that point, and I'm still convinced there's a way to do it that involves fewer lines of code.

The battle mechanics were another tricky element of this project to nail. The maths in this script didn't give me nearly as much trouble as the equipment segment did, but the procedure of the battles sure proved to be quite uncooperative. There are many events that need to happen every time the player hits the “Attack” button, and these need to happen in a different order depending on who has the higher speed stat, the player or their enemy. This was not as simple to solve as it may sound.