Ben Infinitely Presents DSDN232

In keeping with his pugnacious tenacity and Carrollian roots, my protagonist shall henceforth be known as Buster.

Buster began life as Frame Walk Cycle (Left) in Inkscape. I used the same vector points for each frame in his animation, aside from a glimpse of a second coat tail in the right walk frame, in order to maintain consistency of form and volume across frames. I may not have succeeded perfectly, but consistent volume is one of the vital principles of animation. (Disney made the rules in the 1930s, and they have never been beaten: http://en.wikipedia.org/wiki/12_basic_principles_of_animation)

Left Stride:

This three-quarter perspective reveals all vital details of Buster’s physiology. His gold buttons, his terrifying moustache, the grip on his net, etc.

Right Stride:

Here we see the reverse, where almost all of Buster’s details are obscured and only his back is visible. Note, however, that the face behind his moustache is still unseen. It might almost be a wig. A true rear shot would reveal the fact that he hasn’t really got a head.

Jump:

Buster in flight, demonstrating the flexion of his various extremities. Is there anything more hilarious than a fat man jumping ten feet into the air? Perhaps not. Similarities to Mario were first observed at this stage.

Level Design:

This is a shot straight out of Inkscape (which, for the record, is a free package similar to Illustrator; I like it better, especially now that I know where it puts the recovery files when it crashes in the space of a single heartbeat - I may have lost a handful of mouse clicks during the entire project). I developed all the scenery and level props in one file, to the same scale and palette and style, then split them up into individual object files. Inkscape saves in SVG format, which Flash cannot read; it was necessary to open each SVG in Illustrator and convert them to AI format. That took a while.

Final Game:

Here stands Buster upon an XML-encoded rock. I was a little concerned about the detail of the overgrowth, but it turns out the game runs fairly well even with all that stuff in there. I had prepared a set of drastically-pruned props in Inkscape, but they proved unnecessary.

The astute will discern that Buster’s colours are a little more blocky in the game than in the development shots. In particular, his net is completely golden. Apparently Illustrator doesn’t believe in making holes in things. Fortunately, because of the consistent use of assets, this is a consistent change and there’s no weird flickering or any of the other possible results.

So Buster is free to run around his playground, swiping ineffectually at flying fish with his net. He’s quite the metaphor.

With a goal in mind, I set out to develop my portly, appealing, yet misguided character and his unusual environs.

My first experiments reduced the character to the essentials: a belly replete with the signs of privilege, represented solely by a mustache, net in hand. While some kneading was necessary to create a properly expressive character, these early designs set the direction of the design.

However, the person is only one-half of the character. The other half is the net, the system whereby the character actually interacts with the world. I spent some time getting the net right, adding accouterments and trying different apertures. Ultimately, I used a cross between a tennis racket and a cane to further reflect themes of upper-class consumption, with the ‘Rosebud’ aperture simulating a mouth. (Very psychological.)

Here I settled on a final character design, including the bits we never see (like the back of his head), and started planning animations.

As you can see, I went through a lot of thought on the run animation attempting to fill it with energy. I ultimately went with a bouncy style of run, where the lower body jacks up and down while keeping the head more or less level. Utterly unrealistic, but fun to watch. You’ll also note much discussion of ‘popping’ and ‘secondaries’. Popping is where a curve reverses itself, and is great for adding emphasis to a movement. Secondary animation is, basically, the floppy bits - things like hair and cloth that drag behind the body and take some time to catch up. Secondary animations look great, and make the most of a character’s detail. In this case, I’ve got a tie, moustache, coat tails, and fishing net to play with, distributing movement all over his body. Even his belly has a certain amount of secondary motion.

Here I started discussing palette and exploring visual elements for the scene. I quickly decided to move from red through green to blue as the scene receded - a classic style, but it works. The colours separate visual elements quite nicely.

Lots of visuals which never made it into the final version. I’m quite fond of the legs of a giant stone bird - very Baba Yaga. It also tied into the notion of hidden life-forms within the level.

Speaking of hidden life-forms… the Annotated Snark (an exhaustive guide to the subtleties of nonsense) features a sketch of a boojum at one point, which has the look of a sort of sinister and bloated seal. I decided to build one into the level. And then I decided to build the level out of blocks. Then I decided that this was silly, and that I should instead design a level then build the necessary parts to realise its geometry. So I did.

More level design, including the level boundaries. The majority of the level is actually part of the background, with a few solid tiles atop it forming an inescapable bowl - a sort of demonstration playground. I’m also designing the ‘mid-ground’ (MG), the parallax zone that separates foreground from background. You can see the barnacle-ridden stones and sun-baked sands giving way to an exotic, almost fungal scene.

Finally, of course, there has to be something to catch. (I didn’t code a catching system, so ultimately the quest is quixotic; I find that a fine metaphor in itself.) Because Victorian gentlemen do not operate well underwater, and fish do not operate well on airy platforms, I had to create a sort of flying fish - a desirable object. It wound up as a ball with gills and wings. The gills look a bit like angry eyes from a distance, which is alright I suppose.

Palette test, using primitive forms to establish the mood of the scene. You can see that Buster is already drawn here - I finished the character before starting on the scene, which upon reflection was a mistake. He’s a riot of colours, compared to the restricted palettes of the scene. Fortunately, he stands out fairly well, but further work would be better done with fewer colours.

I’ve been vocal about the dangers of overfishing for many years, so what better subject for this project? Unfortunately, it is difficult to construct a narrative around a fish. Both the realistic (you and one million of your nearest friends are caught and carried off) and the absurd (one fish versus the world in an Epic Of Revenge) lack something.

Instead, I decided to reframe the narrative in terms of the consumer. One person catching many fish, until there are none left. The player may be challenged by the level design, but the ultimate challenge is their own greed. This is a pleasing and situational narrative.

How to portray such a character? His defining characteristics are hunger and complacence; he assumes that his greed will always be satiated. A stout, old-fashioned and wealthy gentleman seemed a good choice.

http://blog.law.cornell.edu/tbruce/category/legal-infosphere/

The Monopoly Tycoon is an excellent starting point. He’s old-fashioned, dapper in his own way, and has a certain expressiveness about him. And check that moustache. What he’s not, however, is particularly rotund or rounded; he’s a sleek New York caricature. I wanted something with more heft to it.

(xxxHolic by CLAMP)

Japanese studio CLAMP, known for their immensely willowy figures and wispy aesthetic, should be the last place to look for fat characters. (The human figure is about 7 heads tall. Heroic depictions go for 8 heads; fashion designers sometimes dare 9 heads, producing slim, lanky figures. CLAMP goes all the way to 11.) However, you’ll notice that they round out their work with cute and fluffy little mascot characters. These mascots are vigorous and bouncy and full of delicious bendy mass and floppy bits, perfect for appealing animation, and a perfect inspiration for the general forms of my character.

And now, the 19th century.

A self-destructive hunter after dubious prey? Surely literature has examined this, time and time again. And indeed, I now began to think of one of my old favourites. You’re probably thinking, “Moby Dick, a tale of obsession at sea, whalers and harpoons!” Well, that’s a great idea! But I’m not thinking that. I’m thinking about The Hunting Of The Snark, by Lewis Carroll. In this epic nonsense poem, a group of people set to sea to hunt a Snark, whatever that is. Nobody is really sure. The Bellman leads a crew including a Baker, a Butcher, a Billiard-Marker, a Barrister, a Banker, a Beaver, and a Boots. The whole expedition is rather inept, and in the end it turns out that the prey is more dangerous than the hunters.

http://ebooks.adelaide.edu.au/c/carroll/lewis/snark/index.html

The original woodcuts of Henry Holiday are beautiful and certainly provide some iconic caricature, but the sheer detail is prohibitive in a Flash project. Being black and white, I can’t even draw palette inspiration.

However, the Snark in art does not end with Holiday. In the 1980s, Mike Batt composed a musical based upon the poem, which remains one of my favourite pieces of music. Imagine Simon and Garfunkle being crushed in an avalanche of jazz and homicidal brass and John Hurt and you’re halfway there. The original CD release, which my family was fortunate enough to possess, came with beautiful cover art by Patrick Woodroffe.

http://www.patrickwoodroffe-world.com/hunting.htm

A crisp reproduction of this painting is great - it captures the sandy, barren nature of the poem’s setting and injects it with typical Carrollian whimsy (you may be able to see the pale, blobby creatures staring innocently up from the lower left corner).

So if Carroll was able to set his pampered, intemperate, privileged protagonists upon such a bleak and peculiar shore, why should I not try to do the same? This informed the rest of my design process, to the point where I ultimately designed a Snark Hunt as a broader metaphor, within which overfishing is a mere subcategory.

Jumping on platforms can be challenging, doubly so if the viewpoint decides to wander off into the sky. Why does it do this? I do not know; I did not write the code. So far as I can tell, the default Engine 1.3 code moves the viewpoint when the player character is near a border - but sometimes it gets confused and moves the wrong way, and when it tries to fix matters, it just compounds the problem by charging headlong in the wrong direction.

I wound up replacing the whole thing, cannibalising Ben Jack’s original code for parts. I don’t know exactly how it works, but who does? The commented-out code should pinpoint the section of EngineMain.as to look for, near the end.

                /*
                if(!characterClip.inboundsX())
                    {
                        var pos_x:Number;
                       
                        pos_x = _character.GetWorldCenter().x * RATIO;
                       
                        pos_x = stayX - pos_x;
                       
                        background.lastX = x;
                        x = pos_x;
                        background.currentX = x;
                       
                        background.scrollTo(pos_x, background.y);
   
                    }
                    else
                    {
                        var pt:Point = this.localToGlobal(new Point(characterClip.x, characterClip.y));
                        stayX = pt.x;
                    }
                   
                    if(!characterClip.inboundsY())
                    {
                        var pos_y:Number;
                       
                        pos_y = _character.GetWorldCenter().y * RATIO;
                       
                        pos_y = stayY - pos_y;
                        background.lastX = x;
                        y = pos_y;
                        background.currentX = x;
                        background.scrollTo(background.x, pos_y);
                    }
                    else
                    {
                        var pt2:Point = this.localToGlobal(new Point(characterClip.x, characterClip.y));
                        stayY = pt2.y;
                    }
                    */
                   
                    //CUSTOM
                    var pt:Point = this.localToGlobal(new Point(characterClip.x, characterClip.y));
                    stayX = pt.x;
                    stayY = pt.y;
                   
                    var pos_x:Number;
                    pos_x = 225 - _character.GetWorldCenter().x * RATIO;
                    background.lastX = x;
                    x = pos_x;
                    background.currentX = x;
                   
                    var pos_y:Number;
                    pos_y = 300 - _character.GetWorldCenter().y * RATIO;
                    y = pos_y;
                   
                    background.scrollTo(pos_x, pos_y);

Notice the lines defining pos_x and pos_y; they use the numbers 225 and 300 respectively. These offset the character from the upper left corner, and are specific to the 550x400 resolution, placing the character in the lower middle screen. A different Flash stage resolution will require different constants.

Note also that removing ‘225 -’ and ‘300 -’ inverts the camera. It’s weird but fun, like the computer gods are abandoning the character as he rushes off to do something.

See also: Can games be art?, What is Art anyway?, and other useful questions.

Rather than answer the question definitively, and thus render myself a target for perpetual scorn like Ebert, I thought I’d compare two titles and raise some ideas. My subjects shall be Bioshock and Defcon.

Bioshock is an immersive shooter set in an Objectivist paradise-turned-hell beneath the ocean. It aspires to be a critique of Objectivism and derived capitalist exploitation. Certainly, much of the game content involves the ruins of a realm where capitalism ran wild, but is this actually part of the game? I’m not sure it is. They say “show, don’t tell” in books and film; and Bioshock certainly presents you with a lavishly-rendered vista of consequences and greed. But none of this is the player’s doing. In fact, the player is months late on the scene, and everything is already there. Your agency is primarily to shoot insane monsters.

In comparison, Defcon is a minimal little game. There is a world map with lines for coasts and dots for cities. You can zoom in and out. That’s about as good as the graphics get. The game goes like this: You’re a continental bloc. Every few minutes, the Defcon counts down from 5 to 1. Each new count unlocks a few more offensive options, from submarine movements to bomber launch, until at Defcon 1 you can launch nukes. A nuke can take out enemy military assets such as interceptors or missile silos, or halve the number of people in a city. The goal is to have the most citizens left at the end.

Video here. AI players, so you don’t get an idea of where players tend to look during play, but you should get the idea.

I would argue that, of the two, Defcon is far more effective as art, because it makes the player complicit in its statement. The player chooses who to kill, who to protect, and who to leave unshielded. And it’s gut-wrenching to play, and get to the end and exult in the fact that only two hundred million of your people died, and then think about what that means.

Bioshock is like an art gallery: it presents art to the player, in the form of recordings or conversations or shattered buildings. In Defcon, it’s your own actions that have the most sublime results, and I think that makes the game itself art.