Yeah, We’re Geeks.
Most of us, while emphatically refusing to admit our age, will admit that we’re of a certain generation that essentially lived and breathed the original Nintendo Entertainment System. We’re also not afraid to admit that that’s partially (mostly) still true, and have gotten in many a heated, alcohol infused argument over Castlevania vs. Metroid, or whether or not the 30 man code is cheating (let’s be honest, it’s a cheatcode, people). Also, some HERO went back and re-coded Tecmo Super Bowl with the 2015 NFL teams, players and stats and this is something you can buy right now on the internet. But I digress.
Our frequent collaborators at Cole & Weber were evidently cut from the same cloth, and came up with the phenomenal ideal of creating a series of 8-bit inspired arcade games as rich media banners and an HTML site. Each game was thematically drawn from WA Lotto’s on air and print campaigns (most of which we also created).
Character Animations were a combination of traditional cell animation and 8-bit digitizing. Additional animations were done in After Effects and transcoded into flash or HTML5 animations.
After tossing around a couple different options, we collectively settled on two games. Hoverboard is a traditional side scroller, featuring our hero as he hoverboards through various Washington locations, collecting coins and lucky clovers, and hover-grinding on everything he can. “Zorb-Golf” is a new take on the traditional POV golf game, in which our hero has created a golf course utilizing giant hamster balls which he may climb into and roll himself down a ramp to “tee off.”
Designing a Modern 8-Bit
The two primary uses for these games – rich media banners and a microsite – really required the games to be light weight (under 300k file size). Fortunately 8-Bit art weighs less than most gifs, so the design language was a perfect solution.
The challenge was to create an 8-Bit design language that old nostalgia gamers like ourselves would identify with, but would also be visually attractive to those poor souls who were’t around to remember the amazingness that was RC Pro-Am. Now, just because it’s 8-Bit doesn’t make it an easy thing to design. In fact, those types of limitations really make things difficult.
We developed a meticulous design aesthetic where elements were created on a per pixel basis at 50%, then scaled up to 200% and layered in space using current design techniques such as lighting and atmosphere. The result is a modernist take on something akin to Skate or Die, approachable for a wide audience.
What’s a Game Without Levels?
Some might say it’s just a banner, but we really thought of this as if we were creating a stand alone game title that required the depth one would need to keep users engaged over a prolonged period of time. Hoverboard has over 250 image assets Golf has over 150 image assets.
Built both in HTML and Flash for compatibility, Golf features the first few holes on the rich media site, then directs the user to a standalone microsite where all 9 holes can be played. Each hole was designed after different Washington locales to create a little tour of the state. From Seattle to the San Juan islands, the Cascades to the windmills of central Washington, users from any part of the state can identify with the game and it’s familiar locations. Real three-dimensional physics were developed and then translated to calculate the ball’s flight path in the 2D game. Each hole is given a par based on degree of difficulty, make sure you’re not knocked out of the air by the giant orca whale that’s a sure-fire bogey.
Hoverboard features 4 unique levels that also feature iconic environments to the state, such as the Olympic rainforest, to the bavarian town of Leavenworth. Easter Eggs abound, prompting repeat play, along with a total score that users are encouraged to try and beat. The faster you “hover” the higher the scores, but the less reaction time you have… so striking a balance between speed and precision is key.
A tossing and tumbling human ball demands a certain amount of, how do you say, control. We combined live transform animatinos on the fly with designed motion frames to give us the chaotic, insanity driven yet controlled sportsman.