September 1, 2020

The Art of Face-Plant Adventures

A post mortem

Eight years ago we released Face-Plant Adventures to the now defunct Xbox Live Indie Games (XBLIG) channel on Xbox 360. The game was a Dream Build Play 2012 finalist that made it to the top 20 of the challenge (of ca. 200 submissions) and hit the marketplace in September that year. It was generally well received in playtest and peer review on the App Hub as well as in reviews on gaming websites/blogs and in Let's Play videos after release. Overall, it received mixed ratings on indie gaming blogs and polarized players, who either really loved or strongly disliked it, mostly divided by the title's difficulty. A classic 2D platformer, it featured hand drawn graphics, an original soundtrack, an adventure mode with 11 action packed levels to explore, unlockable medals and awardments, three difficulty settings and online rankings for speed runners to compare their best times.

Xbox Dashboard of best rated indie games

Among 3311 titles released on XBLIG in Germany, Face-Plant Adventures ranked on place 119 in the top rated list before the service was closed for good in September 2017. While it sold only slightly more than 200 copies, we still consider it quite an accomplishment to have finished this project to at least some acclaim and to have had a game out on a game console, if only for a limited time.

The Beginnings

“At the very beginning, I intended to develop a remake of The Great Giana Sisters, but a better, enhanced version with new levels and better graphics”, Peter, responsible for coding and overall technology used in the project, explains his inital idea. When I joined him, he had already developed a basic level editor with XNA and recreated the first level of Giana Sisters that I could use to experiment with the tools that Peter had implemented until then.
Screenshot of The Great Giana Sisters
Screenshot from the original C64 version of Giana Sisters (Source: Wikipedia)

After getting to grips with the tool set, I suggested to rather create our own IP and a game that would blend classic platforming with the gameplay mechanics of more modern platformers rather than to rehash someone else's game. Curiously, that same year, an official Giana Sisters remake/spiritual successor was published for the Nintendo DS and later ported to several other systems. The first year or so we focused mostly on improving the level editor, enhancing it with additional functionality and fixing bugs, before we got to fleshing out the actual game.

Game and Level Design

In terms of controls and feel of gameplay, we were aiming at something between N+ (or the original N game) and Splosion Man, although our game has been compared more often to Super Meat Boy in reviews, probably because the latter was simply more popular at the time we released our game. (I won't deny that Super Meat Boy became an influence, too, though.)

Regarding the level design, we tried to maintain the classic linearity as seen in e.g. Giana Sisters but also open up the game world to leave room for exploration. The idea was to give players bigger (but still linear) levels that would have smaller levels branching off in some places that players would access by exploring. This approach was intended to be applied mostly to the second half of the game when players had unlocked all of Florence's skills.
Screenshot of the oddworm games editor.
The oddworm games editor.

Unfortunately, a major bug popped up late in development that basically destroyed this hub level and its smaller branches. Due to the impending deadline for the Dream Build Play contest, I decided to ditch the approach and the hub level altogether and just rebuilt the smaller levels from scratch, which would have to stand on their own now (although some ideas of the hub level ended up being used in the game's penultimate level "Mirao's Edge"). This explains the uneven length/size of levels throughout the game, with larger stages in the beginning and rather small levels in the second half, something that some reviewers have rightfully pointed out. I believe only one reviewer mentioned that all the level names are allusions to other video games, which is quite obvious except maybe for some of the anagrams. For example, "Aigan" is an anagram of "Giana" because the introductory level "Aigan Fields" is actually a recreation of Giana Sisters' first stage.

The Visual Art Style

I've always admired my brother's talent for drawing. He's always been really good with just a pencil, a sheet of paper and his imagination. As a kid he used to draw a lot of comic book heros, either creations of his own or interpretations of DC and Marvel characters. For a time, I would receive a special drawing colored with crayons or felt pens every year for my birthday and I always used to think to myself that it was a shame that his talent wasn't put to better use. 
So when we decided to create our own unique IP for our first game, of course I asked my brother, if he would be interested in designing the game world and its characters.

Watercolor painting of Florence in the woods
The adventure begins.
His approach would favor actual physical drawing tools over digital ones. "Everything started with pencils, from the sketches to the final drawings, all on sheets of paper. Then I scanned my work and colored it with my drawing tablet on PC", Marcel explains his process.

Landscapes of Plantylon

"When I started drawing some backgrounds, I thought about what setting they should have. At first I wanted to create a real looking but dreamlike world. Some kind of deformed reality. So I had to find a coloring style that would fit this setting. The first idea was to color the pencil drawings like a watercolor painting. I tried many different digital brushes and ways of coloring. I got the best results with wet brushes and a low density. The problem was that these big brushes work best, if they have enough room to unfold, but most frames on our sprite sheets were rather small, therefore I decided to use simple brushes instead." For many of the larger background items such as the sky, hills and rocks, a watercolor look was retained, though. As most levels have a depth of field effect added to them, the difference in coloring styles is not very obvious.

Single frames of watercolored background hills.
Parts of hills used for background layers (above) and what they look like in a level (below).
Screenshot from a level with watercolored hills in the background.

Obviously, Marcel was generally striving for a hand-drawn look of the visuals and most levels actually look like paintings in motion. The following images show the transition from his original pencil sketches on paper to the digitally edited images that ended up in the game.

From pencil drawing (above) to colored image used in the game (below).

Eerie one-eyed worms inhabit the grassy hills of Plantylon.

The dreamlike quality of the visuals was achieved by adding some truly weird plants and creatures (or parts of them) to the landscape. With huge, colorful mushrooms, tentacles and one-eyed worms growing out of the ground, Marcel realized his vision of a twisted reality, something right out of a strange fairy tale.

Sketch and colored version of a background asset.

More sketches of plants. Only the first six ended up in the game.

In many aspects, the final game turned out to be far away from the initial vision we had for it. Many ideas and designs did not make it into the game due to time constraints on Marcel's side as well as the deadline for Microsoft's Dream Build Play contest we were determined to participate in. So in order to be able to finish the game by the deadline, the scope had to be reduced significantly.

Originally, landscapes were supposed to be more varied with several settings and backgrounds and a more diverse flora. In level design, I tried to compensate the lack of assets with distinct settings for lighting and coloring for each of the levels. There were only three sets of floor tiles available to me and players could see them used on different layers throughout all of the levels. What was the floor on the gameplay layer in one level would be a wall in the background in another one, because I had to get the most out of these few frames of graphics. Lighting and coloring of the levels not only helped to set a certain mood and atmosphere, but also slightly veiled the fact that the same assets were being used over and over again in every level. Generally, the lighting throughout the levels was supposed to transition from day to night, but with the ditched hub level and new level structure for the second half of the game, I forgot about this at some point and didn't follow through with the idea.

A hazy dawn in the Aigan Fields.
A sunny late afternoon in Aquablox.
Entering the Wart of Darkness at dusk.
Night has almost fallen during the misty Cave Race.

Considering the limited amount of assets, the game still turned out to be visually diverse by making full use of functionality Peter had built into the level editor. With several options such as scaling, depth of field, fog, general world lighting, light occlusion as well as independent tinting (coloring) of each of the 15 parallax layers, it was possible to come up with visuals beyond the scope of the original assets.

One effect I would end up using quite often was a distortion effect, which I tweaked until I had something that very much resembled water. I used the effect for water flowing out of pipes, for roaring waterfalls and for ponds in which Florence could swim.

A plant needs proper watering, doesn't it?

Peter enhanced the water by creating a nice particle effect for rising air bubbles. From a gameplay perspective, the water not only serves as an environment for the swimming skill. When flowing over surfaces it also drags the player along with it, possibly into hazards. And speaking of hazards: the gory death animation of Florence with blood spatter and an explosion of leaves also consisted of a particle effect that Peter created in the Mercury Particle Engine.

A gruesome death for a plant.

Inhabitants of Plantylon

Unlike the flora of the game world, its fauna turned out to be rather empty. Due to the aforementioned time constraints, almost none of the enemies planned for the game got finished. Therefore, players only find lots of ghastly goo crawling over floors and walls in the environment as well as spitting plants located on walls and ceilings that shoot even more goo at the player.

Orange goo will stun the player while green goo kills them right away.

Apart from the ever-present goo, spikes (a staple of the genre) pose another threat in the environment. Next to stationary spikes placed in many inconvenient places, there are also moving platforms that have spikes attached to them that turn navigation in confined spaces into a dangerous affair. While these do their job at giving players a decent challenge, it would have been much nicer to also have actual enemies to interact with. Below are two enemy designs that give an idea of what creatures would have looked like but ultimately did not make into the final game.

Sketches of a worm enemy.
An odd looking worm.
A creature with mace-like fists.
This fella called Spike-Fist was supposed to have a spinning attack, which sure would have hurt Florence a lot.

Next to these "walkers" we also wanted to implement jumping and flying enemies and while Peter had already provided them as game objects in our editor, sadly we didn't have any animated graphics to visualize them in-game. One enemy type we put in nevertheless was the "stalker" as a boss in the last level of the game. Floro, Florence's evil twin-sibling, tries to prevent our hero from collecting the final golden leaf by chasing Florence through a tiny dungeon with narrow corridors and only little space to evade or attack Floro. We simply re-used Florence's sprite sheet for Floro, turned it red and scaled it slightly bigger to create this adversary. The scenario was a last-minute decision and compared to the rest of the game this level is rather weak from a design point of view. But I really wanted to have at least one real enemy in the game and one last obstacle to overcome before players would conclude the experience.

Hurting and defeating Floro by jumping on their head is tricky due to the confined space. Luring them to more open bits of the level is the key to beating Floro.

An Unlikely Hero

Floro being an evil version of Florence meant things came full circle because intially, Florence was actually supposed to be an enemy. Originally, Marcel had designed the character to become the goo-spitting plant players see many times in the game. The hero character we used in the early stages of development never quite seemed to fit the setting of the game, but when Marcel showed me the design for the spitting plant something immediately clicked with me and I knew that we had found our real hero. (Marcel has also immortalized himself with this character design: Florence's mouth is a scan of the artist's actual mouth.)

After the decision to turn this creepy and funny looking plant into our hero, Marcel had to make up his mind about animating our plantagonist: "I tried the character with and without legs first but it just didn't look right. In the end I found it best to rather make him like a squishy ball that I would deform to visualize different movements." One of the animations he created represents the character tumbling from high up and hitting the floor face first. Florence being a rather quirky type anyway, this gave us the idea to name the character after this "flaw" and so "Florence Face-Plant" was born.

The artworks below show further character sketches. The bottom one was later turned into the cover art that was used on the market place and in the game library of the Xbox 360. Peter also used the image as a background in the main menu.

Soundscapes of Plantylon

Sound effects and music came into play rather late in development because my top priority was to get the gameplay and levels finished in time. But starting with audio this late also meant that most of the game could serve as inspiration for the music tracks. The soundtrack comprises five tracks, each about two to three minutes long. I kept the playtime short so that we would not exceed 50MB for the entire game, which allowed us to sell the game for 1$ on XBLIG (Microsoft had three price tiers for XBLIG depending on overall filesize of a title.)

I started out with "Horizons", the track that introduces the first level "Aigan Fields". Initially, it only consisted of a basic beat and the bassline but the vastness of the fields and wide horizons in the level called for some spherical synth-pads that support the dreaminess of the landscape. The eerie flora and the quirky plantagonist inspired the slightly off-key tune that kicks in later. The ambient track was intended to be accompanying in the background rather than drawing too much attention, its repetitiveness designed to get players in a state of flow.

The track's theme is shared by the other three tracks used during gameplay, all of which feature variations of the same bassline and tune but serve to create different moods. The wide open and dreamy nature of "Horizons" yields to a denser and darker tone in "Caves", a track played mostly in "underworld" levels such as "Amira Caverns", where the beat gets heavier and saggy and the thickened bassline leaves no room to breathe, too. A sense of suspense and rush is conveyed in "Hunted", where the style shifts from Ambient to Drum'n'Bass to create a feeling of urgency driving players forward in auto-scrolling and fast rail sections of levels such as "Cave Race".

I used the same theme for all the gameplay accompanying music so that I would be able to create sound effects in the same key, which meant they would sound like additional instruments on the music tracks. Most of the sounds e.g. for walking, sliding and collecting tonally fit to each of the four songs. For example the bell sound that's played when a clock collectible is picked up consists of six in-key notes (one of which is played randomly on each pick-up), which almost always harmonize with the music and might even produce a fitting melody. I just liked the idea that the entire game world and the player's actions correlate with each other and would make up these consistent soundscapes. It was also a first foray into interactive sound design for me (if only a minor one) that I extended to the main menu as well.

(On a side note I'd like to mention that I haven't created all of the sounds used in-game myself. As mentioned in the game's credits, some effects have been taken from, a great resource for Creative Commons Licensed sounds. I didn't know how to create some of the more realistic sounds such as water flowing, purling or splashing and therefore resorted to this very useful database.)

The main theme played in the main menu is an upbeat synthie-rock song. Its "bouncy" melody in the verse is played with a synth lead that's slightly reminiscent of quacking or croaking and seemed a perfect fit for Florence's melodic introduction. The electric guitar heard throughout the song and in the refrain is an actual guitar recorded for this track, whereas all of the other sounds were created with VST plugins and arranged in Cubase.

Selecting any menu item or entry in the menus plays back one of eight notes from the song's main melody in the correct order so that users can actually play along with the song and create their own version of it. I've always enjoyed this kind of interactivity in other games that did this because it makes navigating the menus a fun experience, too, and not just necessary means to get to the gameplay.

Menu and User Interfaces

The title screen.

Peter made sure that our game's menus adhered to the requirements of Xbox Live Arcade Games, not because we had to but they made sense and were very user-friendly. He also designed the slick visuals that established the quirky nature of the game right away and let our hero appear in a shining light with the character artwork on a green background supported by a nice radial effect. In general, there is a lot of movement in the menus with black bars scrolling left and right at the top and bottom of the screen and the selected entry on a page bouncing to the right and scaled bigger to catch the user's attention. The previously mentioned sound effects for navigation and selection further support this very dynamic menu design.

Players can track their progress for each level via the level selection.

Unfortunately, Microsoft did not grant XBLIG the same features as Xbox Live Arcade Games (XBLA) such as achievements and leaderboards, which is why indie developers came up with surrogates. Peter implemented an in-game achievement system that we called "Awardments" instead, which were just as fun to unlock but sadly would never show up on a player's gamer card. The Awardments screen in the main menu provided players an overview of our ten "fake" achievements and which ones they had unlocked already. For the online rankings - our surrogate for actual leaderboards - Peter integrated an open source solution with a peer to peer approach: players needed to be playing the game and be online at the same time so that data could be exchanged between consoles and rankings would be updated. Obviously, a rather limited approach that only worked for some weeks after release when enough people were still playing the game.

Some reviewers pointed out the many options available in the main menu. Peter had gone the extra mile and provided some neat, convenient functionalities: next to standard settings for audio and controller vibration, the settings screen offered the possibility to adjust the safe zone for screen margins as well as a brightness slider. Players could also decide to switch the ghost of their best level times on and off and pick either English or German language, although we removed the latter for the final peer review to speed up the process (which didn't work at all). All of this was topped off with the integration of a jukebox that allowed audiophiles to listen to the game's soundtrack from within the menu.

I think it was this attention to detail that contributed a lot to the overall polished impression our game made on people. Even reviewers who didn't enjoy the game admitted that it generally was a solid, well-made title.

In the End

So what was it like developing our first game and what have we learned in the process?

Peter: “Overall, it was a lot of fun. Occasionally, some of us felt frustrated when the game didn’t make as much progress as expected but it was great to see the game slowly growing into what it became.”

Marcel: “Although I’ve been drawing pictures ever since I learned how to hold a pencil, I had never worked on a game project before, which has very specific requirements when it comes to creating sprite sheets etc., so first I had to learn to adjust to those requirements. I am used to composing pictures myself, but for the game I had to create all these jigsaw puzzle pieces that Kai would put together to compose the levels. This approach to drawing was completely new to me.”

The final release trailer.

It was hard for us to find enough time to work on the project as we all have day jobs and could only work on the game in our sparse spare time. In general, we have learned that you need a clear vision and a manageable scope for your game. Each team member has to focus on the goal and contribute equally or the team’s motivation will suffer. Having a rough time schedule with deadlines also helps a lot, if you don’t want the project to go on forever and keep in control of the overall progress. Participating in a contest such as Dream.Build.Play contributes to getting things done as this is some “external” pressure you wouldn’t have otherwise. And the feedback you get from this is invaluable, too, be it positive or negative, because it can boost your motivation and help you improve things you haven't noticed before. “It felt great to be a Dream Build Play finalist because after all, we seem to have done something right with the project”, Peter reminisces about the contest. So while Face-Plant Adventures may not have been exactly the precision landing you'd expect from a precision platformer, we also haven't completely face-planted with our debut project in the end.

No comments:

Post a Comment