Seth Ladd's Blog

An HTML5 game is classified as a game that: runs in a modern web browser is written in JavaScript uses Canvas or WebGL for graphics While there is a large and growing collection of HTML5 Game Engines and Frameworks , who out there has actually written a non-trivial, professional HTML5 game?  Here's my quick list: Lost Decade Games made Onslaught Impact made Biolab Disaster Gopherwood Studios made Entanglement EA made Poppit Pagoda Software made Wordico Grant Skinner made Pirates Love Daisies Massively Fun made Word Squared Hakim El Hattab made Sinuous Bocoup builds some serious JavaScript apps and demos, but haven't produced a straight up game (yet) Subsonic Games made Sonar Who did I miss?   What are some of your favorite HTML5 Game Developers?

Update: Ilmari Heikkinen has written a helpful Browser Rendering Loop blog entry. Everything you know is a lie. OK, not everything.  But everything you know about measuring the FPS for your HTML5 game is probably wrong.  Turns out that measuring the frame rate, or FPS, for an HTML5 game written in Canvas or WebGL is surprisingly difficult. http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html  will tell you that trying to measure framerate by counting how often your setTimeout runs is not accurate. The browser can run your Timeout callback multiple times between screen paints.  All you're probably doing is measuring how often your game loop runs, which is not FPS. Turns out Mozilla has a window.mozPaintCount  available, which should provide an accurate FPS. However, this only works for Mozilla. There's an open issue for a clone of window.mozPaintCount for Chrome , but doesn't look like there's much traction there. A manual way to check f...

Good news!  I'll be presenting on HTML5 Games at Google I/O, to be held May 10-11, 2011 in San Francisco.  I know it was very hard to get a ticket to Google I/O this year, but if you were lucky enough to grab a ticket I'm really looking forward to meeting you and talking HTML5 for Games. The title for the talk is " Super Browser 2 Turbo HD Remix: Introduction to HTML5 Game Development ".  I'm working on both the game and the agenda for the talk, but my basic premise will be "it's easier than you think" and I'll be aiming at the beginner/intermediate JavaScript and web programmer.  You'll come away with the confidence and tips to build your first HTML5 game, along with perspective for distribution and monetization.  Plus, we'll look at some fun games! :) My initial agenda looks a little something like this: Why games are different than traditional web programming Game loop Input detection Animation Coordinate system Asset loading...

I was lucky enough to be able to present HTML5 Storage and Offline Technologies at the Bocoup Loft in Boston on March 10th, 2011.  Bocoup is a really cool web development agency, and I appreciate their offer to host and facilitate the talk. Many thanks go out to Mr. Eric Bidelman for putting together the awesome slides from which I poached and remixed.  And by remixed I mean more or less stole. HTML5 enables offline applications and local data storage and caching.  This leads to quicker start up times, faster processing and less network and server utilization (always a good thing).  With offline and storage, we have many technologies at our disposal: App Cache for cached static assets like images, CSS, and JavaScript Local Storage, basically replacing cookies WebSQL DB for full relational SQL Indexed DB for a very JavaScript-y object storage and retrieval system File System APIs for sandboxes, virtualized filesystems accessible from your web app If you'...

HTML5 is gaining traction as a gaming platform, but there's still one problem before we can achieve the vision of a great native-to-the-browser gaming experience.  HTML5 audio, specifically the <audio> tag and its implementations across browsers, is more or less broken for games. For details on the HTML5 audio problem, learn about The State of HTML5 Audio (hint: not good) and the troubles with Multiple Channels for HTML5 audio .  Dominic, the author of those posts, knows what he's talking about: he created Impact , the JavaScript game engine. We need your help!  Star these issues, add comments, and even better add test cases.  Tell Chrome that you care about HTML5 audio and these issues are important! http://code.g oogle.com/p/chromium /issues/detail?id=47 381 http://code.googl e.com/p/chromium/iss ues/detail?id=47761 h ttp://code.google.co m/p/chromium/issues/ detail?id=59369 http: //code.google.com/p/ chromium/issues/deta il?id=59370 http://co de.g...

Some people say "it's just a logo." Nay! I say unto them, This is the Standard's Standard! This is the Badge of Honor! This is the Heroic Coat of Arms! This is the Flag the web development community will wave proudly and yell, "I've seen the Future! It's in my Browser!" This morning, the  W3C released a logo for HTML5 . Along with the actual logos, they released the web site, free stickers by mail, and t-shirts for sale (and a portion of the profits goes to support the HTML5 Test Suite!) For those who are curious, there's a peak behind the scenes of the HTML5 logo design process . Some news: W3C blog post Brand New logo analysis TechCrunch post Hacker News Mashable post Don't forget to follow the @html5logo twitter account .

Aloha! If you are building your Chrome Web Store web app on Google App Engine (and why wouldn't you? :) then do I have a tip for you! Because no one wants to create yet another username and password for your app, we highly recommend the integration of Google's OpenID system to reduce new user friction and streamline on-boarding. App Engine actually makes this very simple, but there's a specific configuration required to allow all Google accounts to access your app. Make sure you use the following line of code: self.redirect(users.create_login_url(dest_url=self.request.uri, federated_identity='www.google.com/accounts/o8/id')) Notice the use of federated_identity='www.google.com/accounts/o8/id' to specify the Google OpenID endpoint. This is the endpoint you want to use for all Google accounts (not just @gmail.com accounts) Hope that helps! Seth