Part 1 - Introduction
This is a postmortem analysis of T³ Interactive's word-building game, WordLeap. I've seen various postmortems done for other games around the Internet, and so I was provoked to try to do a similar behind-the-scenes look at the development of our latest game. As of right now, this is focused primarily on the inspirations and graphical design decisions made for the game, since that's the part I've been involved in. Later on, I might see if I can get Todd to add some commentary about the coding side of things, to make for a more comprehensive look at the game's evolution.
Part 2 - Pre-WordLeap
There have been a lot of different video games based around forming words with lettered tiles, from the various iterations of Scrabble, to PopCap's Bookworm, to our own Alphabet Soup.
Bookworm, a well-done word game |
There are some power-ups that pop up occasionally, but they're only bonus tiles that increase the point value of your current word. Eventually, red "fire" tiles will begin to appear at the top of the board to give you a kick in the pants and compel you to keep making words. These red tiles will eat away the tile beneath them as they slowly make their way to the bottom of the screen. If you don't clear them off and they hit the bottom, then it's game over.
Part 3 - Proto-WordLeap
A little while later, I believe around 2007, I was considering working on a new project. At the time, I was doing some Java games here and there, but none that I ever completely finished (with the exception of Dot to Dot). I wanted to do something that would be somewhat casual while also mildly intellectually stimulating. This made me start to think of perhaps doing a puzzle or word game, or maybe even something based on a board game.
A Battleship clone... |
Round and Round, a puzzler |
Finally, one day, while ingesting a highly caffeinated beverage and experiencing extreme existential angst, I remembered how much fun I had playing Bookworm (in fact, I later purchased the Nintendo DS version after playing the PC game for quite a while), and it compelled me to start thinking of creating a word game in a similar vein but with more of an action-game aesthetic. Thus, Vocabuleaper was born.
Part 3a - Vocabuleaper
Title screen for Vocabuleaper |
Also, Vocabuleaper would be different in that you couldn't just start a word anywhere you wanted. You would be forced to create words based on where the on-screen character is currently standing. There would be a highlighted radius of a set number of tiles that indicates which letters can be leaped to. I ended up making this leapable radius 2, resulting in a 5x5 square of letters available to the player at any given time.
The player has a 5x5 area of tiles from which to form words |
Green indicates a 5-letter word, red a 7-letter word |
One of the things I liked about this original HUD design was the green and red highlights that indicated which words were 5 letters long and which were 7 letters. This also allowed me to indicate power-up tiles without actually having to make it say "2x" and "3x" on the board, but by having these tiles be the color related to that word length. I did this because I didn't want to obscure any of the letters; the only empty tiles would be the ones that the player has recently grabbed.
Additionally, in Vocabuleaper, you are standing on an empty tile, and when you leap to another word tile, the spot you leaped from remains empty for a certain amount of time (maybe 5 seconds or so). Leaping on a letter tile appends that letter to the end of the current word, and by leaping to an empty tile, you drop your current letter back onto the board. I was never totally sure if having the empty tiles be repopulated with random letters was the best way to do it, since it could cause consternation from the randomness, and also because it makes it nearly impossible to dump unwanted letters off into empty tiles. In WordLeap, the tiles remain empty indefinitely.
Trapped by random letters. My kingdom for a blank tile and a U! |
Part 3b - Vocabuleaper Continues
The goal of the game would be to fill the power bar below the board by completing words, which would bring you to the next level. There is a timer bar to the left of the board that constantly counts down, putting some pressure on the player to hurry up and come up with a word.
Under pressure... |
Even the menus are based on the letter tiles |
Flashy |
Part 4 - WordLeap Emerges
Sometime in 2011, Todd emailed me to ask if I'd like to collaborate with him on an updated version of Vocabuleaper. Seeing as the original game was a game I found to be fun and interesting, I said I'd help him in any way I can. He would be handling the coding aspect (using his slick T3F framework), and I would be focusing on the graphical and design ends.
The title screen, similar to the original but enhanced |
10x10 board and 5x5 leapable area |
Yes, WordLeap actually has a storyline. Now, it's not a complicated storyline, but it's enough of a story to compel the player to keep playing. When Todd asked me to think of a story for WordLeap, various considerations sprung to mind. First, it had to be something that would tie the game together under a cohesive idea. Secondly, it would have to drive the player to complete the game. And third, it would allow for abstract backgrounds similar in visual concept to puzzlers like Lumines or (to some extent) Meteos and Galaxy Wars. This last point would allow for simple yet appealing backgrounds that would scroll by in the distance while appearing somewhat randomized.
With this in mind, I thought the theme of WordLeap should be "seeking enlightenment." The game itself would be set within the mind of the WordLeap character. (Todd and I refer to him as "WordLeap guy" and so I will from here on.) Each word he completes puts him closer to reaching the next stage on the path to enlightenment. By achieving enlightenment, WordLeap guy will be in tune with the entire universe of words and will have total mastery over the domain of vocabulary. Each stage would represent a different step on this journey, from the first stage, "Sojourn," set before a set of rolling green hills; to other stages, like "Conflagration," which represents the destruction of the physical and philosophical with a grim backdrop of ruins that scroll past a fiery sky; to the final stage, "Enlightenment."
Stage 1: "Sojourn" (apologies for the tearing) |
Instead of going with this harebrained and possibly CPU-intensive idea, Todd came up with a clever way to make these random scrolling backgrounds with whatever shapes we wanted to throw in there. This allowed me to make some slick-looking backgrounds that fit in nicely with the themes of each stage, all while seamlessly scrolling. All I had to do was fire up my graphics editor of choice (Inkscape) and make some images and an accompanying text file that described the dimensions of each background slice.
The background segments for level 1 |
Editing levels.ini |
As seen in the preceding images, the background shapes aren't colorized. The color tints for each stage are specified in a plain text file (levels.ini), along with rotation speed and the center point of rotation if needed.
As you can also see, each background slice meets up at the same Y-value on either end. This ensures that the backgrounds will all flow continuously, even between stages. When a level is completed, there is no transition screen of any kind. The backdrop continues to scroll along, with only the background tint changing. I really like this method of handling it, as it kind of goes along with the "continuous journey" aspect of the story and how WordLeap guy will stop at nothing to achieve enlightenment.
Part 4a - WordLeap Cinematics
Another awesome thing Todd developed while working on this game was the cinema system. By using some .PNGs and writing some simple scripts, one can craft some really smooth-looking cinema sequences using this. I did the storyboard graphics for the cinemas, and Todd wrote the scripts to handle all the motion, dialog balloons, timing, etc. I think it really gives the game a nice, cartoon-y vibe that melds with the distinctive appearance of the in-game stuff.
The opening sequence, approaching the Guru's house |
Part 5 - WordLeap Finalized
Since the game isn't finished finished, I'll leave this sparse for now. I plan on covering the different game modes, power-ups, etc., in this part, as well as some of the stuff involved in finalizing the game. Hopefully Todd can contribute some more stuff here.
Part 5a - WordLeap Game Modes
WordLeap has three game modes from which to choose: Story Mode, Casual Mode, and Puzzle Mode. In this section, I'll give a brief overview and some thoughts on each one.
WordLeap's three game modes |
This is the story-driven mode as outlined in the preceding sections. You are WordLeap guy, and your mission is to form as many words as you can so that you can complete the stages, your ultimate goal being to achieve enlightenment. The introductory cinema lays all this out (though not as concisely), where WordLeap guy has a meeting with The Guru, a wizened old wordsmith who spends his days meditating, and asks him for advice on how to stifle the constant din that clouds his mind.
The Guru, his meditation interrupted |
And down the rabbit hole we go... |
Casual Mode
Casual Mode is more or less identical to Story Mode, but it's limited to a single stage, so there is no level progression. Also, there are no power-ups or obstacles that appear, so you focus purely on collecting words in this mode. There is no timer counting down either, so you have as much time as you need. Once you've filled the bottom power bar, the game is complete and your score is entered into the record (and possibly posted to the online leaderboard if it's high enough).
Puzzle Mode
Like Casual Mode, this mode has no obstacles or power-ups. However, the game rules are changed slightly in that you can leap to any of the board's letter tiles at any time, allowing you to create longer words. Also, the empty tiles do not reappear once you've used the letters they contain. The goal in Puzzle Mode is to clear the board of as many letters as possible.
Longer words are easier to compile in Puzzle Mode |
Part 5b - WordLeap Power-Ups and Obstacles
As mentioned before, the original Vocabuleaper game had a sparse selection of power-ups to enhance the gameplay. With WordLeap, Todd decided to add a few more to introduce some wrinkles into the proceedings. There are now obstacles as well, which serve to impede your progress as you lurch toward enlightenment. These obstacles increase with frequency in the later levels so that you don't get overwhelmed when you first start out.
Health Box
The health box returns the player to 100% health. This power-up is extremely useful when the countdown gets close to zero. It makes sense to leave this one on the board until you're close to running out of time.
I'm mixing metaphors here, as far as time and health. Todd and I never really decided what the vertical bar should represent. I'd say it could be both. Since the whole game takes place in WordLeap guy's mind, the amount of time he has remaining before losing his concentration and returning to reality could be considered "health" in some sense. Obviously, it's not an ironclad explanation, but it works for me.
Hourglass
The hourglass pauses the countdown timer until the current word is completed. This gives you a little bit of extra time to build a higher-scoring word.
The Guru
You rang? |
Lasers
What would a video game be without a laser popping up at some point? The lasers fly across a single row or column and will take away a small amount of health if they hit the protagonist. The "!" icon appears, along with the tiles of the affected row/column turning red, to warn the player that a laser is coming
When a bomb lands on the board, you'll have to move to a tile beyond its blast radius to keep from getting hit. The blast radius is helpfully highlighted by red tiles. When the bomb blows up, the letters that get hit by the blast are randomized, throwing another wrench into things.
Spikes
I think these are a nice addition to the game. These only appear in the later stages of the game. Once a spike lands on a tile, if you try to leap on that tile, you'll get poked and lose some health. The spikes remain on the board indefinitely once they've landed (unless you hit one, in which case it turns into an empty tile). This means there are that many fewer letters to work with for WordLeap guy, ramping up the difficulty as he closes in on his ultimate goal.
Part 6 - Closing Thoughts
This has been an extremely detailed look at what went into the development of WordLeap, but it's by no means a complete look. I didn't discuss the profile system or the leaderboards, for instance. I also didn't delve into the coding aspects behind some of the decisions made in the game, since Todd is the one handling that aspect of things. At some point in the future, he might add some thoughts on that.
I think it's a solid, fun game that should please anyone who enjoys words. I really hope whoever plays it gets a kick out of it. That will make all the time we've put into the project well worth it.