Video Game Reflection

The video game project for AP CSP was a test of our programming skills and coding skills we gained so far. The objective of this project was simply to create a video game, no restrictions being put on what the game should be. I went through many ideas of what my game should be but I eventually settled on an endless runner game where the player dodges an onslaught of asteroids in space. Being our first game, we were told to make it simple and not to make the project too ambitious. We were, after all, new to programming and a too ambitious project would've made us give up. Our video game would be created with JS but in code.org's App Lab. App Lab offered great tools for designing our UI and had many predefined functions that allowed us to start focusing on the functionality of our game right away. With that being said, I started development not in the computer but on paper first. I drafted the wireframe of my game; wireframes include the basic navigation, UI, art style (if detailed), and concept of your game. Once I was satisfied with the direction I was taking my game in I started development in the computer.

Once I started development in App Lab I found many opportunities to improve my game through an iterative and incremental process, in other words, a process where I constantly look for opportunities for improvement through self reflection/observation or outside feedback. The first thing I found myself doing under this process was refinement of my UI. My draft on paper had a bare bones UI, just the basic buttons needed to go from screen to screen and not much thought given into it. App Lab provided me with the tools to customize many aspects of my UI, such as button color and shape. Before I even started making my game play like a game I was refining its UI. I wanted to make my UI intuitive so the user can easily figure out how to navigate and play the game. I used colors that stand out on important buttons neccessary for navigating and playing the game so the user can almost immediately play the game. I made the size of neccessary buttons bigger than the less neccessary ones so the user isn't distracted or confused by the presence of so many buttons.

Next came the actual coding of gameplay. I broke my game into 3 broad parts before coding functionality. One part of the code needed to allow the player to move, the next needed to control the movement of the asteroids, and the final needed to check for a lose condition and keep track of points. Then I researched how I would tackle each of the three parts by watching videos of other people coding games with similar components to mine and implementing/reworking parts of their code to fit my vision. My coding process heavily involved the use of abstraction as I ended up creating many functions to simplify long and complex lines of code into one line. It also involved top down design, looking at what I wanted a function to do at large and breaking it down further into smaller, lower level functions that the function at large would use to execute its purpose. During play testing and debugging I again used an iterative and incremental process, implementing feedback to improve my game or reviewing and fixing code that may have been inefficient or caused problems.

These skills are important for a web designer because web designers have to implement aspects of JS into websites. While a website can be purely HTML/CSS, a bit of JS can take a site to the next level. JS can allow a site to contain special animations and interactive elements that can boost the user experience. These skills allow a web designer to get familiar with JS and know what to do to take their site to a higher level. Additionally, these skills allow a web designer to think in terms of programming. The use of top down design to break larger problems into smaller problems and the use of abstraction to simplify otherwise complex things can be useful when making websites. For example, the parts of a home page can be broken into smaller components using top down design, making the coding and designing of the home page less intimidating and more easier. While there aren't many opportunities to practice abstraction with HTML/CSS the mindset can still be used to simplify complicated problems; such as creating a main CSS file for all pages in an entire website to use instead of creating custom CSS for each page, simplifying an otherwise redundant process.

Link to my game:
https://studio.code.org/projects/applab/TNH-FU9X5d3kbcOlXx4DKwbINCFjX2ljCd5uquVDQyI