Building HTML5 Games for the Atari Arcade

By  |   Email     Print  Post a comment

Building HTML5 Games for the Atari Arcade

By Lanny McNie, Michael Graves, and Chris Caldwell of gskinner.com

Most HTML5 games are available in isolation so the hardware and browser can be dedicated to gameplay. But that's not how we envisioned a modern arcade where users could gather, play the games, challenge their friends to high-score dominance, and earn achievements. We had to rethink how we approached game development with a common set of tools.

With Atari Arcade, that game is changing. This site was designed completely in HTML5 for Internet Explorer 10 and Windows 8 touch-enabled devices - although it works great in all modern browsers. In this guide, we'll quickly get you up and running with your own HTML5 game. The Atari Arcade SDK with CreateJS is one of the first cross-browser HTML5 game development platforms that allow you to take advantage of multi-touch capabilities more easily. The Atari Arcade SDK is just one of many options you should consider. All of the practices we share can be used with other gaming platforms in modern browsers.

In this article, we'll provide:

  1. Steps to define and build your game
  2. An overview of the SDK's goals and approaches
  3. Sample code showing integration
  4. Adding flair and/or pizazz
  5. Steps to test, optimize, and deploy your game

Re-imagining a Classic

Invent a concept from scratch. Borrow ideas from other games. At gskinner.com, we were lucky - presented with Atari's catalog, ranging from simple to complex, tasked with a chance to reinvent them. With visions and mechanics already proven, we were able to piggyback on existing gameplay, and introduce new creative. For launch, we targeted eight of the most popular and recognizable titles.

Visualize

With the computing advancements in the past forty years, we were starting from scratch. We set out to maintain the souls of the originals, which were designed in a more restrictive, low fidelity environment. Here is a snap of the original gameplay in Atari's 1986 top seller, Yars' Revenge©.

Classic.

Conceptualize

We started with sketches. Simple, loose, and color-free. They help outline gameplay, general aesthetic, and get our noodles cooking about assets and approaches without focusing on the specific art requirements or details.

Here's a behind the scenes look at some of our original sketches.

Stylize

Yars' was both tough and fun to reimagine. Despite being a best-selling title in the late eighties, no one on our team had played it. After playing the original, we felt as lost as before.

  • A Yar is an insect. They fly around.
  • There is a projectile┬Ł which hunts the Yar.
  • Yars shoot stuff, and can hide in a barrier.
  • The Qotile is the antagonist he aims to destroy.
  • They can transform into a Swirl and shoot at the Yar.
  • But the Yar has a Zorlon Cannon that can be charged up and fired!
  • The Qotile is surrounded by what are those bricks?
  • No, they're eggs or cosmic cells┬Ł
  • And the Yar eats them.

We found this awesome comic that shows some vision for design