HTML5 = new world of hackable games

March 12, 2012 § 10 Comments

I believe HTML5 will create a new class of games: webbish games that, like the web itself, are hackable by design. These games will let you pull assets and data from across the web into your game world. And, they will let you remix, fork and share to your heart’s content. The result will be fun for people who like games — and huge potential for webmaking and learning.

The first glimpse I got of this was Jono Xia’s RunJumpBuild, a very simple side scroller level editor. While RunJumpBuild is rudimentary at this point, it shows an important idea: web games can pull anything with a URL into a game. A picture. A sound. A video. Data. RunJumpBuild is designed to let people create game levels that are made up of the web.

This may sound like no big deal. This is how millions of everyday web pages already work: displaying an image from Flickr; embedding a video from YouTube; pulling in Twitter and RSS data. But, just like movies, most games don’t work this way. Games tend black boxes, firewalled off from the social and creative assets of the web. IMHO, this is a missed opportunity for fun and creativity.

The other thing we’re starting to glimpse is games where ‘the web is the level editor‘. Of course, hackable games are nothing new. There is a long history of game modding. However, most modding uses level editors designed for a single game or game engine. HTML5 games will change this: the web programming stack (HTML, CSS, JavaScript) will become a universal level editor.

Enchant.js is an early example of this. It’s a rudimentary JavaScript framework for making 2D games. What’s notable is the invitation to ‘fork’ that is included in all the sample games. Press the ‘fork’ button and you get pushed into an editor that lets you work with the HTML, CSS and JS code that makes up the game.

While these developments are nascent at best, I believe they hold great potential for Mozilla’s webmaking work and for our efforts to promote HTML5 games through our app store. At the webmaking level, the potential is obvious:

  • Games are where the people are
  • Hackable games can teach people basic web mechanics
  • -> e.g. a URL is how the web knows where things are
  • They could also teach HTML / CSS / JS to non-programmers
  • -> games = motivation to learn the ‘universal level editor’

With this in mind, we’re starting a number of HTML5 game experiments as part of our webmaking work. The most significant is Gladius, a game engine which uses the web’s most popular 3D game libraries. We’ll use Gladius to build sample games with a web native level editor as a way to test out the ‘hackable web games’ idea. We’re also considering hackable game experiments built around basic 2D game archetypes and learning-oriented game experiences using Processing.js. All of this is in very early stages of development.

Obviously, there are a bunch of big design questions that will come with this work. How do you use content from across the web to add fun and playability into a game? How do we create simple UX to onramp people who have never edited HTML / CSS / JS before? And how do you layer in the learning angle? The good news is we have many of the same questions with Hackasaurus and Popcorn, so we’ve got a head start.

As an example: we’ve already done alot of work with Popcorn to build an ecosystem of plug-ins that pull services and data into a web native video production. We have plugins that make it easy to throw Twitter, Flickr or GoogleMaps into or around your video. We should do the same with games.

Why does this matter? Because much of the HTML5 talk today treats games like a black box — using things like Google’s NaCl to port existing C++ games to the web. This is similar when we first started Popcorn, a time when the web was seen simply as a distribution channel for a black boxed video. Now we’re starting to show that video on the web can be about something totally new. We can do the same with games: to seed a whole new class of games that are actually designed from the ground up to work like the web, and that are more fun because of this.

Rumour has it that Dan Mosedale, Alan Kligman, Bobby Richter and Rob Hawkes are going to be blogging about some of our plans in this area in coming days. So watch for that. Also, if you know other examples of hackable HTML5 games please let us know about them. We want to work with any and all people who are exploring this space.

PS. Yes, there is a typo in the word ‘learning’ in the diagram above. That’s part of my charm.

Where Am I?

You are currently browsing the games category at commonspace.