Zora is one of the two main characters in our second game,Ā In the Valley of Gods. Quite a few people remarked on Zoraās character design, in particular her hair, when they saw our announcement trailer. Indeed, creating Zoraās hair is a challenging problem for intertwined technical and cultural reasons. I would like to talk about our explorations and aspirations so far, and why itās important to us we get it right by the time we ship.Ā
In 2015, Evan Narcisse wrote an important essayĀ on natural hair and blackness in video games. You should read it. It was the first time Iāve really thought critically about hair and representation in video games, and the yearning in the piece struck me.
Hair is very personal. As an immigrant woman of Chinese descent with atypically frizzy wavy hair, my hair is, to an extent, an outward expression of my struggle with who I am and where I belong (or donāt). I want to love my hair the way it naturally is, but itās never quite simple as that.
So when I first saw the character design for Zora, I had an understanding of what task lays before us as a team. None of us hasĀ Type 4 hair, characterized by tight coils and common among black women. In fact, none of us have even made video game hair before, but we are committed to giving Zora the hair she loves, the way she chooses to wear it, with all the care and effort we can.
Building Zoraās hair will be a continual effort that lasts the whole project. Our first milestone for the hair was getting it in shape for our announcement trailer, when Zora was first introduced to the public. Ā
As a small team without a dedicated character modeler, we hired a couple of specialists to do Zoraās character sculpt. Their task included sculpting a static version of her asymmetric bob so we could evaluate the scale and silhouette of her whole body. We knew the static sculpt would serve only as a placeholder and reference while we figured out a longer term hair solution.
Hair is a complicated combination of geometry, shader work, and texturing, and it requires a very tight and frequent iteration loop to get right. It made sense for us to do it in house even if we havenāt created hair before. The task of modeling āgood enough, first passā real-time hair for the trailer fell to me; the shading and rendering work to our graphics programmer Pete; and the copious texture and oversight work to our art director Claire. We started by investigating what other developers have done.
Real-time hair geometry, as far as I can tell, falls into two broad categories: āhair helmetsā and āhair cards.ā A hair helmet is what I call completely opaque geometry, as one would see on a plastic action figure or Lego figurineāthink Princess Zeldaās hair in The Legend of Zelda: Breath of the Wild. Hair cards, on the other hand, use many sheets of hair strands to portray more free-flowing hair āthink many characters in Uncharted 4. That approach is well suited to hair types that can be abstracted into sheets, which works well for any length of straight hair. There are also hybrid approaches, such as this wonderful tutorial of a game-ready afro by Baj Singh.Ā
Claire designed Zoraās Type 4 coily hair to have a lot of texture and volume, but it also has a ābig-chunky-tubesā structure allowing fluid āfloppyā movement. Neither of the two previous approaches is ideal for Zoraās hair.Ā Ā
The closest in-game hair reference I found isĀ Nadine Ross from Uncharted 4, but on closer inspection Nadine has Type 3 hair with very defined curls, quite different from Zoraās tighter Type 4.
Sometimes the only way to solve a problem isā¦ just by making something, even if it sucks in the beginning. So I started off with a variant of the hair cards approach by making ābig tubesā of three cross-cards to follow the shape and flow of Zoraās hair helmet sculpted by Ted Lockwood. It was important to have some geometry that remotely resembles what we will ultimately create, to test the shader Pete has been writing.Ā Ā
I would work on the hair for a few days at a time whenever I wanted a break from creating the trailerās environments. After two months of wrangling various placements of polygon tubes, flat cards, and cross-cards, as well as bending all their normals as if her hair were a shrub, we had the following result as of October 2017.
Part of the challenge of all this is that not only are we making Type 4 hair, we are making stylized Type 4 hair that evokes Claireās distinct style. It became clear very early that the way Zoraās hair interacts with light would be a key part of the shader work.
Iām not able to go into the technical details of the shader in this post, but we ended up adding individual controls for each type of lighting we wanted the hair to respond to, based on Claireās specific concept art: for instance, light striking from the back, from the side, ambiently, and so on. This got finicky, but taught us a lot and provided enough variation to create the trailer.Ā It will take much more experimentation and iteration for the hair to behave according to the style guide under all necessary lighting conditions, but making the trailer gave us a lot of direction for our next steps.
Right now, we have an intensely stylized back-scatter effect in the hair when backlit, but we still lack the ability to do high-quality rim lighting without relying heavily on post-processing.
We are currently only using alpha-cutouts for the hair cards (alpha sorting is a whole different topic outside the scope of this post) and Iāve been advised by character artists that some number of alpha blend cards for flyaway hairs usually works well.
For the trailer, James rigged Zoraās hair and hand animated the movement, but we plan on applying physics simulation to the hair rig for the shipping game.
There is a long way to go before weāre truly happy with Zoraās hair, but this is a good first step. As the rest of the gameās visuals become more solidified, it will become more clear what we need to tackle next.
theartofmadeline
pixelskylines
turnnoffyourmind
prguitarman
