Saturday, November 21, 2009

Visual Clarity in Character Design (Part II)

Saturday, November 21, 2009 36
In Part II we'll consider the key characteristics discussed in the first entry--silhouette/scale, color/patterns, and materials/detailing, and see if we can't make an existing set of less than optimal characters "read" more clearly in gameplay situations.

The very gothic Jericho Team.

For candidates, I looked no further than a game I had finished playing just recently: Clive Barker's Jericho.
It was not well received and mostly for good reason, but there are some inspired concepts running through it. It's ideal for our purposes because you control a larger than average team of six characters, and it's tactical enough that identifying characters different squad members at a glance makes a difference.

Hanne Lichthammer, an undead Nazi boss character in the game, seen out-gothing the Jericho team by a wide margin.

Trouble is, the game revolves around a decidedly goth-leaning, melanin-challenged (even the black man of the team is ghostly pale) supernatural special ops team with a fondness for shades of black.
With the exceptions of Delgado (the big chain-gunning fellow) and Church (the small-framed ninja), this is a large group of friendly characters that are difficult to tell apart in combat and/or low light levels--both of which recur regularly, often together.
Here's a collected image of the original characters and their names, so you know who I'm referring to for the rest of the article:


Where to begin? Many of the problems with the team extend further than just visual appearance and into their broad, even offensively stereotypical characterizations.
Delgado is the sass-talkin' latino, Father Rawlings is the deep fried southern preacher-type, Black is the militant lesbian sniper, etc.
(I think the game interesting enough that the follow-up to this entry will be a full-fledged design sketch.)

For now we'll stick to their appearances: in keeping with the gothic, spooky ambience befitting a Clive Barker game, the entire team is pale and black clad. This ends up as a significant issue in two ways.

The call is coming from inside the crypt.

First off, from the point of view of player investment and interest, these six characters are a hard sell--they walk into this hellish landscape overpowered with magic and arms, imminently well-qualified to deal with the problem, and the game mechanics as well as fiction hold that the team can both resurrect members and resupply them with ammunition indefinitely--so why do they need my help at all?
What's horrifying about these gothic sulks having to deal with the end of the world, aren't all their own apartments furnished in the same style as the oozing rivers of blood and hellscape they now traverse? In other words, the team seems to be lacking dramatic contrast to their environment. Far from being put out and suggesting fear and terror as appropriate responses, they seem at home.

Second, even if I did feel invested in the obnoxious stereotypes, I often have trouble seeing them at all, certainly in telling them apart at a glance. A few of them are attired in shiny black catsuit-type material, which improves their visibility somewhat in low light conditions, but not enough to be helpful. Most of the characters are designed with a kind of runic filigree covering their suits, presumably as a replacement for lack of shape or form differentiation, but it's none too successful.

At left is a sample palette of the game's environments, derived from pixelated averages of a few representative screenshots.
The game is heavily atmospheric--fog, smoke, fire predominate to good effect. Mounds of sloughed off rotting flesh and rivers of blood show up as with any self-respecting time-fragmented hellscape, so the general palette of the game tends to run to warm, flesh and earth tones, and generally very dark.
While thankfully the Jericho squad isn't wearing blood-red catsuits, which really would make for unfortunate camoflage, the black suits don't really help visibility, especially for the extended sequences shrouded in darkness (perfectly appropriate for a horror game).

So as we begin, we'll identify the specific issues we wish to solve: shape/silhouette differentiation (for when color information is not present), visibility of material and detailing in warm colored and low light situations, and finally player sympathy/horror game appropriateness of the character designs.

First things

The temptation for me as an artist is to get to drawing and painting characters immediately, but this isn't actually that helpful when I could end up with a lot of wasted time for a redesign of such a large team of characters. So we'll stick with a consciously simplified approach--not only does it keep artists from pouring too much effort into a design before it's well considered, but it's simple enough that little or no drawing ability won't stop someone from using the same process.
We begin with a simple diagrammatic layout of the team divided into their control squads, Alpha and Omega.


Like the L4D color comparison in the first entry, I'm using simplified representations for the characters in order so I do not distract myself with painting and rendering too early.
A well drawn character can mask design flaws that don't manifest themselves until it's too late--the model and texture are done running around in the game. Revisions at that point are extraordinarily expensive in money and man-hours; far better to squash as many problems before they ever happen when revisions are as cheap as the point of an eraser, the point of a pencil.

Scale

So now we've got three men, three women in simple outlines. The scale relationships of the team originally are a good starting point, so we'll stay fairly consistent to the original team designs.

Cole is the "medium" female, Jones the "medium" male, Delgado the largest of all characters, Black the tallest of the females. We'll make Rawlings a narrow, vertical form, while Church is the diminutive ninja form. Like so:


If it seems simple, that's because it is, but take the time, foundations are critical.
It's also instructive to do this kind of designing with all characters visible on a sheet--small as it is, this workflow reinforces the necessity of cross-checking all the character designs against each other as much as possible.

Silhouette


The biggest change here is giving Black a sort of Ghillie suit/dress, instead of the black catsuit that appears in the game (and makes her look very similar to Cole). Otherwise, most of what I'm paying attention to here is a simple factor of how much skin is visible. Something tells me tacti-shorts are right out when rethinking a supernatural tactical response team, so I'm mostly looking at collar cuts and sleeve lengths.
Though it's not pronounced at this stage, I'm already thinking of exaggerating Cole's augmented reality visor's scale in order to giver her more of a Daft Punk head silhouette (added bonus of hugely reflective helmet), whereas Jones gets a high, protective collar, almost like a bomb technician. Rawling's duster/great coat remains largely unchanged.
(There's evidence the development team ran into these issues, as the concept art for Church doesn't have the large suit cut-out panels. Either they realized the difficulty of recognizing the characters in the dark or needed some sex appeal--or both.)

Patterns and Colors


Knowing that most of the game's environments are in ruddy/earth tones, I swung to the complementary color on the wheel: green. Olive drab, more specifically. I considered this in tandem with my problem with the game fiction and player identification issue: even if there are potentially world-ending supernatural threats out there, I have a hard time believing that the government would actually give decent funding for their super secret "Department of Occult Warfare" were it to exist.

This gave rise to the thought of a second-rate secret force, a kind of discount BPRD: what if the team didn't get all the latest gear and an unmarked Blackhawk helicopter to deliver them to jobs? Still saving the world, but without commensurately magical budgets, because who would honestly believe them, anyway?
Certainly would help make the team less invincible-seeming, more personable, and helps free me from having to straightjacket all of the characters into the same vaguely high tech gothsuits.

I'll explore these concepts later, but for now it means that the characters end up more irregular military-looking, rather than pale and black everything. The black character in the group gets to actually be black, a small kindness.

I've also given the different squads identifying armbands with associated colors. Here again is some surprising vestiges of discarded decisions from the original team: if you look closely at the set of six original character designs, you'll notice that only the Omega squad (bottom row) have red armbands.
Looking at the original Mercury Steam concept art for Delgado (above and right), you can see a blue armband. I can only infer at some point, Alpha squad had blue armbands to go with Omega's red armbands, but in the continuing quest for true gothification, these were discarded, with the assumption that you only needed armbands for one of the teams, making the other team distinct by nature of having no armbands.

The fact that it took partway through writing this very article to discover that Omega squad only had the red armbands should be proof enough that this is less than successful. I can only think that the earlier thought of red and blue-coded squad armbands was the better choice, and in my redesign it is one I have reinstated.

Summary


Here's an animated .gif of the above stages, showing that it doesn't take a lot of time or even drawing ability to take a large group of characters and make them distinct from each other. And if you are an artist, it's a smart step to take before you launch into fully-detailed sketches. Time is money, or rather time is what you're wasting toward the end of the day when the art director comes over, sees what you've drawn, and asks for a complete revision.

Finally, the completed concepts, with accompanying revision notes (reference the laughably game guide-esque Wikipedia entry character bios for comparison, before they get scrubbed):


Cole
I made sure to exaggerate her defining feature, her helmet. Otherwise, her stance is the other major defining feature of her silhouette.
Instead of the nervy rookie presentation, Cole's bulbous augmented reality helmet (retrofitted 60's astronaut equipment as it happens) keeps her at a quiet remove from the rest of the team. Her modified FAMAS rifle scope feeds into the helmet HUD; it's 5.56 rounds are shared in common with Delgado.
Poise: shoulders back--professional and assured, high rifle carry.

Jones

Jones is reconfigured as a player surrogate, the most "normal" character for a shooter player; gear trappings like that of a modern soldier or PMC.
Though still a telepath, he treats his power with a matter of fact sensibility (reminiscent of Miles on Lost). He carries an old school M14, which can share rounds with Black's sniper rifle.
Poise: hunched combat glide of a trained, experienced modern soldier.

Delgado

Delgado is still the heavy weapons man, but stripped of both the distractingly overt power armor and stereotypical mannerisms. While the onyx sheath on his right arm was interesting, his former man-portable minigun was distracting and over-powered. The whole get-up distracted from his humanity, any sense that he might actually be vulnerable to attack.
Delgado pulls the glove off his right hand to unleash his pet fire spirit. He carries a vintage Stoner 63 machine gun.
Poise: casual swagger, nerves of steel.

Black

Black retains the coarse manner, but ideally without the ill-timed and obnoxious barks. She's unhappy that she couldn't plan ahead with a hell-colored Ghillie suit--though even in the infernal backdrops of Al-Khalil, once her Ghillie suit is zipped up and hooded she makes for a hard target. She sports a bolt-action CZ 700 sniper rifle, which means she can share .308 ammunition with Jones, but he's not likely to get any of long-distance-balanced handloads short of begging.
Poise: crouching, furtive gait of a sniper out of position.

Rawlings

Father Rawlings is redesigned as a non-combatant--as glorious and hideous as his double deagling was before, it makes more sense with his priestly vows and deepens tactical considerations that the healer/resurrector of the group cannot directly defend himself.
He's considerably moodier and sardonic, less drawling southern; the missions of Team Jericho have initiated a long "dark night of the soul" for the priest.
Poise: hunched and glowering.

Church

Church is still the ninja of the group but with a more elegant strain to her bearing. As a blood scribe, she wears a mysterious tattoo covering much of her back. She carries the coffin-magazined Italian Spectre M4 submachine gun, in addition to her katana.
Poise: strictly ninja.


As the modified dossiers suggest, another update will feature a wider critique of Jericho and a matching illustrated design sketch.
I feel as though I haven't explained my re-design choices all that well in terms of justifying their enhanced visual clarity, but this entry is getting quite a bit too long already--what say you?

Monday, November 9, 2009

Visual Clarity in Character Design (Part I)

Monday, November 9, 2009 16
With the release of Left 4 Dead 2 coming up, let's talk about visual clarity in character design. Valve has learned quite a bit about doing it right in recent years, so it's worth dissecting a few of the lessons they've learned.

We'll start with some background, and then cover three main concerns: silhouette/scale, color/patterns, and materials/detailing. In another update, we'll apply these lessons to less than successful character designs in another existing game and see what we come up with.

The L4D Survivors before and after major reworking, after Turtle Rock Studios' absorption into Valve proper.

Valve's visual bravura arguably dates to Half-Life 2. But HL2 was more of a breakthrough in terms of memorably drawn characters, rather than a variety of pragmatic concerns we'll be discussing here--a single player game with invincible/high health friendly NPCs is not the same as designing for team/co-op multiplayer.
By pragmatic, I mean the kinds of things that have a direct impact on gameplay. For this, we'll look at Team Fortress 2.

Players may remember that TF2 was originally--circa 1998 or so--going for a more realistic visual and gameplay style (seen at left).

Thankfully while in development, in they were soundly swooped by a number of different games, most notably the Battlefield series of games.

TF2 was ultimately redesigned closer to the original Quake mod roots of the game, but with a clean, stylized look harkening to the work of classic 20th century commercial illustrators.


We see the particular stamp of Moby Francke's visual style, which from an outsider's perspective seems to be the strongest artistic voice on where TF2 would end up, visually. (I have no doubt this greater movement toward visual clarity in character designs was due to others artists as well, but Francke's work seems the single best artist at the company I can point to.)
Prior to his work on TF2, witness his Counter-Strike: Source model sheets (below and to the right).

While the character designs had already been more or less decided with the mod version of Counter-Strike, notice the presentation of the model sheet itself. Major shapes and silhouettes are emphasized over detailing or texture.

This is a crucial concept governing much of the successfulness of TF2: a clean, uncluttered, "readable" look. The CS:S models are not hugely different from the original CS characters, but they are an iterative improvement and a step toward what would become TF2.

Below, one of Moby Francke's character designs for TF2. Same presentation for the model sheets as for CS:S, but with the style of the game he's able to work in more memorable silhouettes. Simply by considering the various TF2 characters with relation to each other you can reverse-engineer most of these lessons--but let's talk about them more in detail.



Silhouette/Scale

Even some of the most casual players are probably aware of silhouette design issues. This is perhaps the single most important factor when designing any videogame character. Look below--do you have trouble identifying any of the characters below solely by their silhouettes?
With TF2, Valve realized that the more quickly the player needs to identify other characters and act on that information (friend or foe, what class the other player is) the more important it becomes. The demands of a hardcore, team-based competitive multiplayer game helped drive the visual style for TF2 to not only be attractive, but also transparent to the needs of the gameplay. This transparency would be honed and show up again with L4D 1 and 2.



Character designs can be placed on a spectrum from the naturalistic (L4D) to stylized, to the almost completely abstract (say, Space Invaders). Above, these characters are all nominally human, but their silhouettes vary wildly. The more stylized the game, generally the more wiggle room you'll have to play with in terms of defining through silhouette.

Scott McCloud's Understanding Comics has a very useful lens to consider this concept--the "Pictorial Vocabulary"--that applies equally as well to videogames as it does to comics. (A more detailed version with examples of this is available here.)


As games become more abstracted either up or to the right of this triangle, the more dramatic the differences in silhouette (may) become. Game mechanics tend to track similarly, though it is not strictly correlated. (There are a lot of games with somewhat realistic graphics but highly abstract mechanics and world.)
Start with a normal human silhouette, think about the various different messages it sends--height, weight, gender, age; the interrelations of shapes (held weapons also count a lot for unique silhouette), the character's most common postures, style of animation, etc. Silhouette is one of the most identifying factors so long as the character in question is not significantly occluded visually, or they can be clearly discerned from the background.


It's worth noting that for L4D, silhouette will also communicate important information like being gravely wounded--once a player has very low health they transition to the stooped, wounded stagger in place of a normal gait.

The natural corollary to silhouette is scale. A silhouette may identify a character well, but introduced together with scale variation, a character's readability is boosted considerably. With L4D, all characters are realistically scaled/silhouetted human characters (no giants, no dwarves, and no spikey anime hair) and yet the characters are all well differentiated on these grounds.


Color/Patterns

This is one of the least appreciated aspects of good visual character design. Clear, simplified application of color and pattern can be one of the best ways to create well differentiated characters--and it is here that arguably the L4D character designs are strongest.


Let's look at character concepts for both L4D1 and L4D2. Then consider the color schemes, divorced from all other aspects besides color by applying them to the same Lego minifigure-like template. Players familiar with them will have no trouble naming all 8 characters:


Simple, strong combinations of colors in different arrangements can by themselves create memorable, easily differentiated characters that can be IDed by the player under duress reliably, which is the holy grail for functional character design.



Materials/Detailing

Out of all concerns, materials and detailing are some of the most difficult to explicate, but still crucial to overall presentation. Material choice--say, a glistening bright shine on armor or a weapon vs. a matte finish--can go a long way, especially when other information isn't available to the player.
Extremely low-light conditions will strip players of color information, leaving only silhouette cues and in many cases not even that. Extremely reflective materials, on the other hand, will still "read" differently than matte ones in low light. (Which is part of why most real-world military firearms feature some manner of matte finishing, parkerizing and the like--so they won't reflect sharply in the dark.)

The associated problems here are why we've got the single biggest crutch for videogame character design: glow-y bits. Everyone from Sam Fisher to Marcus Fenix can orient themselves easily in a pitch-dark room, thanks to gratuitous glow-y bits. Your future power armor design lacking that necessary punch, or clarity? Glowing tech-bits are every lazy s.f. concept artist's best friend.

The slippery slope.

Detailing is a sort of catch-all description for other concerns too numerous for the scope of this article, including the overall visual complexity of a character. As such it should be considered carefully, as should the overall visual complexity of your game, as it relates to your gameplay.
Marcus Fenix and the other COGs in Gears of War are deceptive cases: with careful deployment of certain techniques, in combination with more overt ones such as glow-y bits, you can still maintain fairly good legibility--even if tastefulness remains elusive.

Color-overlay shaders reveal a breakdown of basic visual clarity in UT3.

But it can be tricky--Gears of Wars' near sibling Unreal Tournament 3, despite a very similar aesthetic, fails almost completely in terms of clarity of visual design. Busy, techy character designs against busy, techy backgrounds mean that in team games, characters and vehicles (!) at mid-to-long distances are overlayed with a red or blue shader shell, in order that they're readily perceptible at all.

I apologize if some of these concepts aren't fully explained, but with Part II we'll be applying all the lessons to some existing designs in another game. In the meantime--what are your favorite examples of visually successful and spectacularly unsuccessful visual designs for videogame characters?

Further viewing: Illustrative Rendering in TF2 Presentation
 
gausswerks: design reboot. Design by Pocket