Interactive Web Programming Assignment – HTML5

I haven’t posted on this blog in a while, partly because the very interesting Human Computer Interaction assignment is complete and handed in, for which I was improving the Aber LINKS site, and many new assignments have now taken its place over Easter. One I am currently working on for a module called “Interactive Web Programming” involves making a game using HTML5 (and mainly the HTML5 canvas) with a lot of JavaScript. ¬†After reading up on some of the new additions to HTML5, and following a couple of tutorials, I have been able to start making a game from scratch.

In my little game, you have control of a a little “Viper” spaceship, which can be moved around with the arrow keys. At the moment, you can just fire one type of bullet that will destroy the enemy Cylon Raiders, and in turn increase your score. There have been many challenges with this assignment, mainly just creating a 2d game in JavaScript – and learning how JavaScript does have a version of constructors, objects and methods for those objects. Other challenges have included getting the game to respond to 2/3 key inputs at once (e.g telling the spacecraft to go up and left, and shoot), having the enemy ships move around the screen randomly without falling off the sides, and only allowing so many bullets to be fired per second.

Space Game

Currently, I have a moveable spacecraft that can fire bullets to destroy enemy craft. The enemy spawn at the top of the screen and move down in a seemingly random fashion, with many random calculations, some deciding sets of movements so some enemies movements are much different to another’s. When a bullet hits an enemy, the enemy explodes (need to add sound clip) and is destroyed along with the bullet, whilst the player’s score is incremented.

I still have much I would like to do including adding more  guns/bullets, possibly getting the enemy to fire back, different levels with harder opponents, a help menu, and a high score leader board.

A fun week of JavaScript lies ahead!