Summary

Learn how to make games using web standards, that will play in any modern browser without plugins, like the ones featured in the .Mozilla Game On 2010 Contest.

Each week we'll investigate a particular aspect of game development - input, animation, sound, networking -- and learn how to implement it using Javascript and HTML 5.

Since the Web is all about connecting with people, I would especially like to focus on using a client/server model to develop a multiplayer game where several players can log into the same server and compete or play as a team.

Bring your own game ideas!  Since the goal is to get something playable by the end of the course, you should focus on a smaller project that you think you can see through to completion.  (In other words, maybe save your idea for a huge complex epic MMORPG until after you've successfully completed a simpler idea, like a mulitplayer Asteroids clone.)  The assignment each week will be to take the new techniques you've learned and apply them to your own game idea.

In order to help each other learn, participants will be expected to playtest each other's games and provide constructive criticism and feedback, as well as to offer help with understanding code and fixing bugs to those who need it.
Learning objectives

The overall objective will be to develop a small, but playable, original game by the end of the course, using Javascript/CSS/HTML5 and other web-standard technologies.  By the end of the course you should be able to send a link to a friend and say "Here, play this thing I made. You can use whatever browser you like."  You should also have a firm foundation of concepts and programming techniques that will allow you to go further on your own and develop more elaborate games.

Prerequisites

You should know at least a little bit of Javascript already - you don't have to have written big, complex programs in it, but knowing how to do a little basic event handling is a good start.

You should have done some web development, at least enough to be familiar with the structure of an HTML page.

You should be familiar with basic programming constructs like loops, conditionals, functions, and objects, whether from Javascript or another language.  Knowing some object-oriented programming is a good bonus but not essential.

You should be familiar with using Cartesian coordinates to describe a location on the screen in pixels.


Syllabus / Curriculum:

The course will go for six weeks.  The main topic of each week will be as follows:

1. Capturing keyboard and mouse input with Javascript event handlers

2. Drawing to the screen with HTML 5 <canvas>

3. Basic animation techniques: animation frames, smooth scrolling, and getting rid of flicker

4. Basic 2-d physics:  Gravity, acceleration, friction, jumping, shooting, and hit-detection

5. Building a multiplayer server with Node.js

6. Sound effects (using the HTML 5 <audio> tag and JS audio API) and other finishing touches

Not included in the course:  3d graphics with WebGL. A very cool topic, but one that deserves a course of its own.