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
