1. Chrome Game programming
(with ForPlay)
Firenze GTUG, 06.07.2011
Luca Masini

2. Agenda
■ Anatomy of a 2D Arcade
■ Impact HTML5 Game Library
■ ForPlay: features
■ Hand-on a simple demo

3. Anatomy of a 2D Arcade
Game Lifecycle
We can identify three steps:
● init: asset loading and general housekeeping
● update: game logic and physics
● paint: everything that is strictly inherent to graphics

4. Anatomy of a 2D Arcade
Asset Management
● We need to load Images, Sounds, Text before they are
used, but in a smart way so that the memory is not filled
from the start.
● We also need a callback mechanism that warns us when a
particular asset is loaded.

5. Anatomy of a 2D Arcade
I/O Subsystems
● Input from joypad, touchscreen, keyboard, pointer
● Disk Storage and network
● Audio Device
● Video Device

6. Impact HTML5 Game Library
● Impact has a visual game editor for level and AI
scripting
● It really uses CANVAS and AUDIO tags
● Target at classic 2D games, using many ideas from
old consoles (like Super Nintendo)
● Sprites are drawn over multiple background layers
(for parallax) made up of many bricks of smaller
images

7. Impact: Weltmeister Game Editor

8. First ForPlay project in 30s
Using a maven-archetype:
mvn -DarchetypeRepository=
http://forplay.googlecode.com/svn/mavenrepo
-DarchetypeGroupId=forplay
-DarchetypeArtifactId=forplay-sample-archetype
-DarchetypeVersion=1.0
archetype:generate

11. ...forplay is not limited to HTML, these are the generated
platforms:
● HTML5
● Android
● Java Desktop
● Flash

12. Riferimenti
● Impact official site: http://impactjs.com/
● Impact article on Google Code Blog: http:
//googlecode.blogspot.com/2011/05/creating-2d-
games-with-javascript-html5.html
● forplay official site: http://code.google.com/p/forplay/
● Kick-ass Game Programming with GWT (Google I/O
2011): http://www.google.
com/events/io/2011/sessions/kick-ass-game-
programming-with-google-web-toolkit.html