1. HTML5 Canvas Identicon Generator

    Default Avatar - Mystery Man

    Identicons are graphic representations of hashes. The most popular implementation has 16-blocks of a single colour, as in figure left. You'll no doubt have seen them used as avatars in blog comments.They're one option provided by the hugely popular Gravatar service, and can also be generated yourself using a Wordpress plug-in, or other blogging software.

    The problem with these avatars, is that each commenter on your blog adds one extra image. This can quickly result in hundreds of extra HTTP requests, and reducing requests is the single most important factor in site performance. It may be Gravatar's bandwidth, but it's your blog that's going to be slow. The usual method of packing many images into a CSS sprite is also impracticable here.

    Gravatar takes an md5 hash of your e-mail, and returns the corresponding avatar, or in our case identicon. The Gravatar server also hashes the hash, probably with a salt value, which is evident from the avalanche effect when changing one character of the original md5 hash. For this reason, the identicons generated by the Wordpress plug-in are different, and it's impossible to generate a Gravatar equivalent identicon yourself.

    I've been meaning to write my own client-side identicon generator for a while now. For each comment, JavaScript reads the hash from the HTML, draws the identicon onto a canvas, then over-writes the place-holder image. This means zero extra HTTP requests, and is extreamly fast.

    Figure top-left is a live example generated by JavaScript.

    Download script

  2. What would Mutli-Player SimCity look like?

    SimCity 3000 Fire disaster

    I love city building games, however they're fundamentally a single player experience. There's only room for one omnipotent mayor per city, which is probably why there aren't any multi-player city games. At least not for my definition of multi-player.

    Although some city games today allow limited player interaction, such as sharing maps and resources, a true multi-player city building game would need to allow players to interact in real time. Call it a massively multi-player online city game if you will, where players develop one shared cityscape.

    The idea of a multi-player SimCity is an interesting starting point, but a working game must diverge significantly from the quintessential city sim. I want to build a game based on what everyone instinctively understands; supply and demand economics.
    Rather than try to simulate a city, my goal is to not simulate one. For example, land value shouldn't be a value in a database, but rather what two players agree it is via price discovery. This game will be an economic simulation game, which just happens to generate a cityscape as a by-product.

    My goals for this project:

    1. Build an economic simulation game, casting the player in the role of entrepreneur. Keep it simple, accessible and fun. Focus on market self-organization and emergent behaviour, and minimize simulation of the actual city.
    2. Develop as a browser-based game in JavaScript / HTML5 canvas. Web technology is an extremely fast moving target; make full use of today's web technologies. Keep the download size to a minimum, with mobile users in mind.
    3. Procedurally generate the graphics for the cityscape, including textures, art assets, and later models if the project moves to WebGL. Use the strengths of the browser environment, and pick an open content licence to publish under.
    So what would mutli-player SimCity look like? Probably nothing like SimCity.