Practical Web Projects, November, 2004

This article was about creating a game in Flash to fit into the framework of a pre-existing site.

When it comes to really showing our stuff, nothing seems to show it better than creating a game for our site. Creating a game says that we don’t just know how to build sites, but we know how to entertain. It indicates to the world that we know what we’re doing in Flash, and that we care about user satisfaction.

The value that a game adds to a site is immeasurable and, currently on the web, game sites account for those with the most consistent traffic, and those where visitors remain the longest. In this sense, they’re called “sticky”, because games cause the users to “stick” to the site. In the competitive online world, being sticky is definitely a good thing, and if we can create sticky sites for ourselves, then clients will hire us to create sticky sites for them as well.

In this tutorial, we’re going to be creating a game that is essentially a remake of an old classic, which often goes under the name of “memory” or “match”. In the game, we’re going to present the user with a grid of squares, or “cards”. When the user clicks on a card, it flips over, revealing a picture on the back of the card. The user may then click on another card, and if the two card images match, then the cards will fade away, revealing portions of the background.

The object is to clear the entire grid of cards in as few attempted matches as possible. When the user selects two cards that don’t match, they both flip back over, leaving it up to the user to remember where each card is.

The core of our game will be the card logic, fade code, and the shuffle algorithm that ensures every run is different.