New Graphic Style

I have always lacked much of an artistic sense, especially in visual imagery. My screen layouts are brutally functional without a wasted pixel. But over the last two weeks I’ve been working with Alvaro Gonzalez, who boasts much better visual sense than I have. His ideas have taken us in the direction of comic book style art. This is the perfect answer to the photorealism that dominates the 3D face displays. The comics style brings panache to the screen layout. 

As part of this, Alvaro has proposed a new layout that provides a significant amount of background. I had been designing them for 480h x 640h, with probable display size of 360h x 480, but the new layout shrinks them down to 240h x 320v, which is just barely big enough to permit the emotional expressions to work. This new layout is much more appealing than my engineering-oriented layout. 

I don’t feel comfortable showing off our preliminary sketches, because they are quite tentative and I expect much to change, but the intent is definitely to make something that looks more like panels in a comic book than grids on a computer. And that in itself is a huge step.

The basic face display technology is now operational; to give you an idea of what it can do, here is a skeletal image showing the capabilities of the technology:


These constitute the mobile portions of the face; the immobile portions are in a “base face” that underlies these mobile features. 

Here’s another way of grasping the technology: there are two basic data structures: actors and expressions. An actor has the following attributes:

int[]  eyebrowThickness = new int[6]; 
int[]  eyeThickness = new int[10]; 
int[]  upperLipThickness = new int[8]; 
int[]  lowerLipThickness = new int[8]; 
int[]  browThickness = new int[4]; 
int[]  jowlThickness = new int[4]; 
int[]  orbThickness = new int[4]; 
int[]  dimpleThickness = new int[3]; 
int[]  noseThickness = new int[6]; 
int[]  noseShapeX = new int[6];
int[]  noseShapeY = new int[6];
int[]  verticalOffsets = new int[FaceExpression.FeatureCount];
int  faceWidth
int  baseX, baseY
int  innerEyeDroop, outerEyeDroop;
float  mouthWidth
int pupilSize;
baseFace, upperTeeth, lowerTeeth, iris; // These are PNGs drawn by an artist
String myName;
public Color hairColor;
public Color lipColor;

An expression constitutes a set of facial features whose specified positions communicate an emotion. A facial feature is a set of points in a 2D space joined to make a line, which is thickened by the thickness values for the actor being portrayed. This is an important aspect of the design: some elements are unique to each actor, and some elements are unique to each expression. In general, the shape of each facial feature is defined by the expression, and the size of that feature is defined by the actor. There are 9 facial features: eye, eyebrow, brow line, orb line, nose, jowl, upper lip, lower lip, and dimple.

Now that the basic display system is settled, I am ready to begin work on the editor. This will permit the artist to specify each of the many emotional expressions that we’ll want to provide for use in the game.