Use Javascript and HTML 5 to make a multiplayer game you can play with your friends in any browser.

Learn how to make games using web standards, that will play in any modern browser, without plugins! Each week we'll investigate a particular aspect of game development -- input, animation, sound, physics, and multiplayer/networking -- and learn how to implement it using Javascript and HTML 5. Bring your own game ideas, and be ready to help your fellow learners playtest their games and figure out how to fix their bugs! I will be leading this study group for six weeks beginning April 25, 2011.

Lesson 2 - Canvas graphics

In this lesson we cover how to draw graphics in the page using the Canvas tag and its API. Also, becuse it's time to start thinking about how your game engine is going to work, we also cover how objects in Javascript differ from objects in other languages, and a little bit about how to think about using objects when creating your game's world model.

1. I don't know much about Google App Engine, but as I understand it's about helping you with the server-side - your Java classes can run on Google's hosted servers, but they're still going to have to output an HTML document to creat your interface and animation and so on, so most of the techniques there will still be the same as if you just hand-coded HTML and JS files. App Engine may help you implement multiplayer, though. (It may help you a lot.)

2. For some games Canvas might not be that much advantage over images and divs and tables. (I'm actually working on a game of my own that displays a map as a bunch of images tiled inside a table; no canvas at all.) That said Canvas does give you a level of precision down to the pixel that's hard to get any other way, it lets you draw curves and diagonals that would be very hard to make out of DOM nodes, and it gives you transparencies and transformations (such as scaling and rotating) too. For your card game, you might find some of those features helpful for spinning card images around to different angles or for stacking them. But you could also find non-canvas ways of doing those things (CSS3 transforms can be used to rotate card images, too). It's ultimately up to you; I think you should give this week's canvas exercises a try, to get a feel for how it works and how helpful it would be, and then make up your own mind.