NEW PROJECT – Asteroids

Asteroids is a bare-bones facsimile of the classic arcade game of the same name.

Objective

I want to focus on more creative projects this year in order to break up the grind of work skill development. I’ve always been passionate about game design, and there are a lot of free tools to chose from. My intent is to start with some JavaScript-based browser projects because that’s my wheelhouse. I’ve heard of cases where web-based games could be distributed as executables via Electron beyond the usual browser distribution too. It’s an opportunity to do more of the object-oriented programming that I don’t get from WordPress development.

Development

My experience with the JavaScript Canvas API is nonexistent, so I started from a Net Ninja tutorial to get a feel for the process. That series helped to establish the basics of drawing simple shapes in Canvas, moving them around and colliding them.

From there I added a variety of enhancements on my own.

• Border detection for the player character
• A Game Over screen with reset
• A score system
• Variable speeds and point values for different sized asteroids
• A timer that gradually increases the spawn rate for the asteroids
• Asteroid splitting on impact
• Simple fun color effects for all of the objects
• Refactored some of the tutorial code into new functions to eliminate repetition in some places.

Hurdles

My high school trigonometry is very rusty. Fortunately I remember my Pythagorean theorem, which is the key to finding collision distances in a 2D game like this. The tutorial did a lot of the heavy lifting for me in the math department, since this was a first go, but I’d like to try it more freehand on my next project.

Another issue is collision detection for polygonal objects. Getting a triangle to know it collided with a circle required an external library with a lot of math. This might be okay. My aim is programming, not computer graphics design. For this reason, the game lacks the special graphical effects of the original game. I’m not drawing all those asteroid bits breaking apart.

Takeaways

This is a project I can definitely come back to after I’ve gained more experience with Canvas. Some additional features I’d like to add are diagonal paths for the asteroids, and multiple lives for the player.