W3C logo

Game development in HTML5

Objective of the course

During this course you will learn how to use Open Web Technologies such as JavaScript, CSS3 and HTML5 to create browser based multiplayer games.


  • Learn about the current state of JavaScript games
  • Learn about are the HTML5 elements useful in game development
  • Understand how to use HTML5 animation and CSS3 transitions
  • Learn about collision detection and basic physics
  • Understand how to implement multiplayer gameplay
  • Understand how to deploy your game in the appstores

All course material is presented in English. Assignments must also be submitted in English. Participants may post messages to the discussion forum in any language.

Course outline

We will discuss and compare different methods of real-time animation, implementing game loop, structure of the code or communication between the players. Logic of our games will be based on an engine we will write – it will be able to animate sprites, detect collisions, add basic physics to our characters and much more. Finally, you will learn how to run your game as a desktop application outside the browser on MacOSX, Linux and Windows, or as a native application on your mobile device. And how to sell it in the appstores.

Each week ends with a practical assignement.

Week 1 - Introduction to HTML5/JavaScript game development

This week, we will remind basics of JavaScript & HTML5, learn how to manipulate Document Object Model or draw on canvas element. We will test different methods of implementing game loop and user controls. I will also present a history of JavaScript games.

Week 1 assignment: "Create single object on a scene and control it using mouse or/and keyboard."

Week 2 - Let's make it move!

During the second week of our course, we will discuss different methods of sprite animation using HTML5 and remind information about basics of physics from high school. We will also learn how to detect collisions between objects.

Week 2 assignment: "Create animated character that could jump on the platforms on the scene."

Week 3 - Connecting with other players

We will start third week of our course with review of methods of connecting players. Then we will check if it is possible to connect two browsers without worrying about the server side scripts. We will also learn how to implement multiplayer gameplay in our games.

Week 3 assignment: "Add multiplayer support to your game"

Week 4 - Deploying your game

Last but not least - explore the power of JavaScript, CSS3 & HTML5 outside the desktop browser. Add native features of your mobile phone like accelerometer or vibrations and publish your game in the AppStore. Learn how to run your game as a native, desktop application on Windows, MacOSX and Linux, using Mozilla XULRunner runtime.

Week 4 assignment: “Create package with your game for mobile devices using described frameworks or publish it as a desktop application for different operating systems.”

All material, including that produced by participants, in assignments and correspondence is copyrighted property and cannot be copied, duplicated, posted on another Web site, or otherwise used without the original author’s consent.