Post feature Report RSS Creating High Fidelity 2D Art & Animation

VHEL, from an artistic standpoint, has been in development well over 6 years now. Throughout that time, many different variations of familiar characters, environments, and objects, have been created.

Posted by on

Creating High Fidelity 2D Art & Animation

VHEL, from an artistic standpoint, has been in development for well over 6 years now. Throughout that time, many different variations of familiar characters, environments, and objects, have been created. However, when working in an environment where graphical limitations are more so based upon personal preference and/or techniques, it's very easy to have one design you like one minute, and ultimately replace said design for another that's "better". This type of "do it over until it looks nicer" formula is a prevalent factor in many game titles. Being an indie game, however, VHEL cannot compromise in areas that demand constant reiteration that can be otherwise fatal to development. In addition, having a storyline with so many characters demanded a better approach to allow for more convincing character models. As so, VHEL needed a very specific art style that was focused more on gameplay awareness, dynamic details, simplicity, and, of course, artistry. After many experiments, a new style was created known, internally, as "gradient mapping".


(From left to right: Khana ver.8, Khana ver.12, Khana ver.16, and Khana ver.19)

The first attempts with gradient mapping were less than stellar, if not at all visible. The art quality was poor, and adjusting to the idea of "static color shaders" wasn't all that appealing. Overtime, however, I improved the technique and started to notice how much better the art was, and could become, with radical results almost every single time. The problem here was never so much that I didn't know what I wanted, or even my ability to draw (though a refined focus, especially on cubism, helped), but rather, the process to make characters very interesting was very methodical. Up until version 11, I didn't have a solid hold on the technique. I needed a master blue print so that each character could be drawn with as little confusion as possible.

In development, VHEL's art goes through 5 different phases:

Rough -> Tebinri -> Gradient -> Matching -> Final

Each phase has it's own criteria for success. What's interesting is that this list of "what to do's" help maintain visual consistency throughout all game visuals, as well as eliminate any unnecessary visual stylings that have no significant importance gameplay wise.

User <br /<Posted Image
  • Rough - A general idea. This sets up the basic design for characters, objects, and environments. This phase also allows for multiple irritations of the same desired piece.
  • Tebinri - Also known as "hand-shaping", a refined version of a rough. Interior areas to a piece are cleaned and basic shapes acquire a solid figure and silhouette. Individual shapes are separated, colored coded, grouped, prioritized, and allocated. If the general shape to a piece is common to another finished or near finished piece, then this phase must continue on until the general silhouette is unique for gameplay reasons. Animation test are also done during this phase to make sure a piece can flexibly move from frame to frame. The term "tebinri" refers to the way characters animate on the 2D image plane, with a near 3D like quality, using both hand crafted animations and static symbols.
  • Gradient - An advance form of gradient filling used to create dynamic color patterns, shadows, and highlights, from a predetermined color palette, without the use of real-time, lighting acclimation, provided by a game engine. As shown in the image above, gradients are effectively mapped onto a surface, and given either a soft or hard transparency. Harder gradients are useful for creating rough surfaces like clothing folds, while softer gradients work well on smoother surfaces like skin, water, and shadows. All colors are paralleled to match a desired tone and hue, maintaining a consistent feel and vibrancy. Symbolized shapes that layer in sequence are also given dynamic gradient shadows and/or wrinkles. Wrinkles are used to add emphasis to clothing folds and skin textures, giving character silhouettes much needed depth along the 2D image plane. Shadows are also used near the terminator to create depth, allowing dominate colors of a lower vibrancy to generate higher visual interest. Every color used, as aforementioned, is slightly reddened to give the impression of warmth and create visual consistency. All gradients bleed into cooler shades -- NEVER pure black.
  • Matching - Taking a gradient filled piece and comparing it to other completed pieces. Making sure that a gradient finished piece matches up with other completed pieces is the most important step. If characters lack the same consistent details, gradients, shapes, colors, shadows, contrast, and general vibrancy, then the previous 3 steps have failed to be completed correctly. Enhancing the look to a piece may require silhouette comparisons, height and width cropping, gradient retooling, and cross-examination of previously used techniques.
  • Final - All necessary artwork is completed and ready for animation uses. Due to the complex nature of gradients, it’s vital to continuously animate every desired action for a piece until all needed motions are possible. This phase may be superficial at times if a new technique is introduced for a newer piece later down the line (mind you, newer techniques should only support or help improve the first 3 steps). During these scenarios, it’s best to affirm the worth of a technique, how effective it is, the amount of time needed to apply said technique to every other piece, to maintain consistency, and also take into consideration of any and all possible gameplay uses or interferences.
Post comment Comments
JustDaveIsFine
JustDaveIsFine

I like it!

Reply Good karma Bad karma+3 votes
ciastoludek
ciastoludek

A W E S O M E

Reply Good karma Bad karma+2 votes
LPFreak
LPFreak

Yep, you're great artists.

Reply Good karma Bad karma+2 votes
TucoBenedicto
TucoBenedicto

I really love the art style.

Reply Good karma Bad karma+2 votes
Post a comment

Your comment will be anonymous unless you join the community. Or sign in with your social account: