Tail of a Tailorman

The concept that we chose, aptly named ”Suit ‘Em Up”, is about a tiny tailor. He’s been tasked to fight off evil bugs before they munch up his favorite suit!

Given the concepts focus on tailoring and fabrics, our minds we’re instantly drawn towards early 1900′s. With this, an idea regarding the visual design was born in the mind of our dear lead artist; namely that of early Disney cartoons.

Researching this a bit narrowed our visual guidelines down to a few main concepts. These included so called rubber-tube limbs, only using black and white (shaded and not shaded) to describe form and separation, as well as ”bead” eyes or ”pie” eyes. we also discovered that the various background components were almost never as dark or light as the foreground objects (probably an effect of the backgrounds being shaded, which would take too much time to do on the moving objects). This also helps the viewer, or in our case player, to easily realize which parts are of importance or interactive and which are static.

Once this had been determined, we started to think about how to go about this style and designing the main character (Let’s call him Bob.. no… Charles! Charles is better!).

Guidelines provided by the concept document are as follows: Charles is one heck of tailor! He wears a tux, has the mightiest facial hair and, of course, a crossbow. To this we decided to add a top hat to further max out his level of style.

We had at this point also decided that Charles was no ordinary tailor, but rather one of many tiny helpers, sewing suits by direction of a ”normal” human tailor. As such, the decision was made, to give Charles a more animal-like appearence.

Add some rubber-limbs , gloves, and those very special eyes, and Voila! A star is born! We decided that Charles was to be a rather peculiar being, and to that we needed a very memorable and unique walk (You can see a preview of this in the image above) . As our lead artist had studied 2d animation previously, we decided to let him have the role of lead animator, while I was to take care of cleanup. I had worked quite extensively with Adobe Illustrator on previous, personal projects, and so I felt very comfortable in that role!

Once Charles exaggerated walk-cycle had been sketched out by the lead artist/animator, I took the spritesheet he had created and, using Illustrator, started with the most ”revealing” frame to get a good design before continuing with the rest.

As you can also see, Charles doesn’t have any arms. This is not due to some extra fancy element of the game’s mechanics, but was later added in code, using OpenGl!

In the end the animation turned out great, and really portrayed the character that at least I had imagined. One thing I really wish that Illustrator would have, and something which absence slowed progress down by quite a big, is that of a Timeline, similar to the one in Photoshop. Due to the lack of this, the only way to preview the finished animation was to implement it in the game and, at a very slow framerate, watch each frame change to see that everything flowed correctly.