Caveat lector: i write this through bleary, unslept eyes.
The third annual TOJam event wrapped late last night. This year, around 125 developers crammed into a scary warehouse at the edge of town to spend one weekend creating all kinds of video games about cheese. Cheese was this year’s theme. Some developers, like Shawn McGrath and myself were gung-ho to create non-cheese-related products (though for my part, my game contains poetry which is - at its core - terribly cheesy.)
Click to play the fruits of my labour, Here Be Dragons.
Skilled shutterbug Brendan Lynch grabbed some great shots at the event. Click on the image of Yours Unruly to see the gallery.
Due to some project-related obligations, i wrote to the organizers on Friday and cancelled my participation, forfeiting my spot at the Jam. But fairy tales can come true, and by the end of the day, all the fires had been put out on the project. i packed an extra monitor into my knapsack and biked it down to a dodgy part of the city apparently dubbed “Corktown”, but better known by locals as “ugh.”
If you see this many dead-end streets and train tracks on Google Maps, don’t go.
Building Games in a Mafia Dumping Ground
When i rolled up to the derelict factory, it was immediately familiar. i had been there before, for a meeting with a pair of Facebook app developers called Refresh Partners. Back then, the place reminded me of the warehouse where Batman knocked Jack Napier (AKA the Joker) into a vat of acid. Apparently, scenes from Chicago were filmed there, as it offered that perfectly gritty bleak brick prison motif.
By luck of the draw, i had one of the better rented chairs in the building, because it had working wheels and armrests. Well - armrest, really, because one of the armrest cushions was missing. The chair owner had jury-rigged a new armrest by binding bunched-up bubble wrap to the chair with electrician’s tape. This assembly, as functional as it was, betrayed the danger of a hidden nail sticking straight up through the wrap. Thank God that my tetanus shots were up to date. i’m willing to suffer slings and arrows for my craft, but i draw the line at lockjaw.
We came and went via a back stairwell, which was home to a dead mouse and numerous other unmentionables that, fittingly, i won’t mention. The hundred-odd (and i do mean “odd”) participants were spread out between two rooms, one of which was stiflingly hot and the other which was freezing cold, thanks to windows that wouldn’t close. i was set up much better than most folks, some of whom were clustered around a shared folding table beneath a fluorescent lighting fixture that hanged precariously from one bolt.
Sleep When You’re Dead
After riding home for some sleep at 2:30 Friday morning, i stayed awake from Saturday morning at 9:30 to Sunday night at 11:00 PM, when the event ended. Being without my air mattress, which i found indispensable last year, i tried to take a nap while lying across three chairs lined end to end, but i was constantly awoken by the carpenter downstairs who spends his early mornings loudly slamming piles of wood together arhythmically. i troddled off to the hotbox room to snooze there, but that part of the building was emitting some strange beeping noise loud enough to keep me awake. At last, there came a vacancy on one of the dodgy couches in the nearby makeshift lounge, but by that time i was too tired to sleep.
That said, i was much more relaxed this year than last, although i think i stayed up the same number of hours. Compare and contrast this year’s photo from last year’s (also by Lynch):
Beware, Amish: spurning caffeine has its hazards
The key difference, i think, is that last year i was determined to prove myself. i wanted to show the world - and particularly my team supervisor - that locking me up writing game documentation for two years was a waste of my talents. To that end, i was dead-set on creating a finished, functional game if it killed me. And it nearly did.
My success this year started with my cancellation. i figured that having missed a day, there was no point in even showing up. With the pressure relieved, i was able to really take my time and tune into the game design process, without worrying so much about being perfect.
The Game
The game i chose to build was one from our internal game ideas wiki called Here Be Dragons. Here’s what the wiki entry looked like:
Sea Monster
It’s Like
That spider game in the junkyard where you pull the spider back like a slingshot to grab flies.
Overview
You’re a sea monster eating ships.
Not much to go on. The entry was in there just to remind me that i really wanted to make a sea monster game. Simple concepts make for simple games. Simplicity is crucial to turning out a finished title in a weekend.
The spider game i referenced was a great little Flash game i remember playing a few years back. You play a daddy long legs in a junkyard. You click and drag the spider’s body to jump up in the air and eat insects. The game was technically very impressive; the spider’s legs programmatically contoured to the shape of the terrain. The artwork was also quite nice. If anyone has a link to the game, please let me know!
i figured the same pull-back-and-release mechanic would be great in a sea monster game. Your monster waits at the bottom of the sea. Pull back and release to swim up breach the water. If there are any boats in your way, you eat them. Bonus points for eating one boat on the way up, and another boat on the way back down.
This all sounded good in my head until i actually started looking at pictures of sea monsters. Somehow, i had forgotten that they were all slinky and snake-like. A mathematical springy game mechanic is one thing, but add to that some chain physics, and suddenly the task seemed daunting. i’m no math wizard, and i never took trigonometry (though i’m aiming to fix this gaping hole in my understanding within the year).
i thought about the game for weeks leading up to TOJam, and eventually conceived of a game where the sea serpent is stationary and the boats move past it. All i’d need is a locked chain mechanic. This seemed a lot more reasonable.
Math for the Numerophobic
i started with an excellent Flash chain physics tutorial by Alejandro Quarto. His example contained all the trig i’d need to find the distances and angles between the sea monster’s neck segments.
i spent the first few hours of TOJam3 playing with Alejandro Quarto’s balls
In Alejandro’s example, the chain segments detect and prevent collision against each other. This was the first aspect i dropped, because it wasn’t important for my monster’s neck to collide with itself. Instantly, my chain moved much more smoothly. The trouble was that i needed a chain anchored to one point, but Alejandro’s chain was free-floating.
Here’s how Alejandro’s chain works: the last ball in the chain follows the mouse. As it’s being pulled around, all subsequent balls look for a larger-than-acceptable gap between themselves and the previous ball in the chain. If the gap is too large, a ball will tighten that gap by moving along the angle between itself and its companion ball. The gap that Alejandro set is the distance between the balls’ centrepoints, so you get a nice tight chain. (For the sea monster game, i tightened the chain even further so that the segments had more overlap.)
In order to affix the chain to one spot, i had to reverse Alejandro’s logic. First, i told the end segment to stay put. Then i told all subsequent segments to follow the mouse. Finally, i reinstated Alejandro’s logic to keep the each ball from straying too far from its parent segment. i kept the ball shape for the segments because circle segments look the most fluid when bent.
The end result is a really fantastic-looking and -feeling segmented sea monster neck. Thanks, Alejandro!
Programming in a Snap
Finishing off the rest of the game logic was a piece of cake. i made an early decision to angle the sea monster’s head as it followed the mouse, which players really reacted to. There was no magic to it:
i love it when graphics provide the illusion of technical prowess
i just chose a line down the middle of the sea monster, and chose a distance to either side. If the head was within that threshold, it showed its “forward” graphic. Otherwise, it showed its “left”- and “right”-facing graphics depending on which side of the threshhold it was on.
For the y axis, it was the same deal. When the head is within the middle threshhold, show the “straight” graphic. Otherwise, show the “up” or “down” graphic.
This provided the illusion of the sea monster looking around as its head follows the mouse. It’s not a technically brilliant scheme, but it is graphically labour-intensive, requiring nine pictures of the head (six actually, because the “left” pictures could be flipped for the “right” side). Then double that, because each head picture had to have a “mouthOpen” and “mouthClosed” state. Then add a few more pictures of the head with pursed lips for when the sea monster spits out the ship rigging. Finally, i lost the benefit of mirrored images when i added some shadows and highlights later.
Here are all the head images:
Attention, mermaids: he’s single
Gameplay Polish
The game was pretty well finished by Saturday night, and i had the rest of the weekend to add polish and to playtest. i had a few TOJam organizers sit down with Here Be Dragons. Jim thought the sea monster’s tongue was a laser, and so he didn’t grasp the fundamental game mechanic or goal. To fix this, i took his suggestion and changed the monster’s tongue from purple to pink. Then i added a chunk of code to depict the things the monster was eating being retracted into its mouth; until then, you’d tongue-lash items on the boat and they’d disappear, leaving a more laser-like impression.
Emily wondered why she had to click to spit stuff out. Then i started to wonder that too, and i took it out - now you just have to look up to spit. Both Emily and Jim didn’t understand why the sea monster could eat the mast, sailors and crow’s nest, but not the sails. So i created a rule where anything fleshy was edible, and anything not-fleshy had to be spit out. (One exception is the ship’s hull, which is implied to be full of delicious, crunchy sailors).
Originally, there was only one sailor pacing around the deck. Jim wanted a whole pile of things to eat, so i added a sailor in the crow’s nest, a sailor belowdecks, and a captain in the stern of the ship. Interestingly, most players focus only on the pacing sailor, even though he’s more difficult to catch. i think this is because he’s the only sailor with a sound cue - footsteps on wood. Testament to the power of sound.
Early play tests revealed that it wasn’t clear that the sea monster was spitting anything out, so i added animation of things being spat and landing in the distance. i animated this programmatically, which took much more time than it would to hand-animate it.
When i conceived of the game, i thought the passing ships would shoot harpoons at the sea monster, and that i would have a lives/death/game over system. i asked the other developers whether the challenge of filling the monster’s stomach with hard-to-snag sailors was enough, and they said “sure”. “No scoring?” “Nope.” “No timer?” “Nope.” i came to regret listening to those opinions.
Graphical Polish
i had the luxury of sprucing up my flat graphics with a few more gradients and highlights. Here are some comparison shots:
Ahh - much better
The Result
The Big Reveal on Sunday evening is always exciting. You have some teams kicking back, relaxing and adding the finishing sparkle to their title screens, while other teams frantically, desperately try to get their core game mechanic to function properly. It’s the thrill of victory and the agony of defeat everywhere you look. When you cruise around to different stations looking for games to try, it’s always a little sad when you find an abandoned station with nothing to show for a weekend’s worth of toiling.
As usual, there were a lot of games that were too complex for their own good. You’d roll up to a station, and the developer would be there, looking all nervous, unable to abandon his post because his game was too complicated for people to figure out on their own.
“Okay okay! So, you put your fingers on the WASD keys to control the movement of the black triangle. Move the mouse to kiss the zombies. Click the mouse button to increase the number of units on the screen, and shift-click to make a sandwich. If you need to drop your superbomb, step on the Rock Band drum pedal. And to look around the room, tape this Wii remote to your forehead.”
i was determined to let my game speak for itself, so i wandered away from my station and kept an eye on players from a distance. i did have to tweak the sailors’ deliciousness level for the demo, because it was taking too long for people to get to the end of the game. Players would abandon the game in the middle of a session, and the next person would sit down in the middle of the game and miss out on the silly poetry that bookended the experience.
In the end, the changes that came from that late-night playtesting served the game very well, but i should have added a scoring system. i implemented the “YOU ATE:” tally screen within the final hour, hoping that the “hulls eaten” tally would inspire people to go back and try to eat an entire ship (the most difficult task in the game), but no dice: there were just too many other games to play.
Tips for Future First-Time TOJammers
Designing a game to hold someone’s frenzied attention span in a room full of nerds n’ noise is slightly different from designing a game to captivate and engage the player across many hours and repeat visits.
i recommend a dead-simple control scheme. Mouse is preferable to keyboard, and single-clicking trumps click-and-drag. i’m already not a fan of clicking and dragging, especially for kids’ games, although all my kids teevee clients ask for it. Interestingly, in the two second timespan it takes for you to sit down to a game and then abandon it, all but one of the TOJam3 games that required clicking and dragging were too obtuse for me to figure out on my own, and i didn’t spend any time with them.
The one exception was Happy Goat Lucky, which used the pull-back-and-release spring mechanic that i had initially planned to use for Here Be Dragons.
And lo, it comes full circle.
Armor Games is a Flash portal that will sponsor games on a case-by-case basis, with a game’s worth being determined by the site’s moderators. The site owners appear to be very efficient at pimping out games themselves; the Armor Games splash screen seems to pop up in every conceivable corner of the Internatz.
