The Many Faces of Tove


In recent week's blog-posts we've discussed Tove's design and her animation set-up. This week, we'll be talking about her facial set-up to give you an insight into how it works. As with the other blog-posts we'll try not to get too technical so it's a good read for all!

We talked in previous weeks about taking liberties with anatomy, and how we slide Tove's head up and down her neck to allow us more compression and range when creating animations for her body.

You'll be pleased to know that this is not the only outlandish liberty we take with anatomy! In fact (brace yourselves), when Tove blinks her entire head gets squished! It scales down as she closes her eyes and springs back up to normal size when she opens her eyes again! If you take a look at the early facial animation test GIF at the top of the blog-post carefully, you'll be able to see this 'squish' in action. As this 'head squish' needs to be animated in conjunction the facial animation (rather than with the body) it's included as part of the facial animation layer in Unity.

This is not the only element on the head that we scale (steel yourself for more horrors), we actually also squish her eyes! We use this subtly every time she blinks but it can be used in a more extreme fashion when she's shocked or looking suspiciously at something. We also have the ability to scale each eye's iris and pupil, again to give us the opportunity to reinforce shock (by shrinking them down) or ramp up 'cuteness' (by scaling them up).

Now both of these are pretty subtle, you probably won't have noticed it at first glance. You might ask 'So why bother?', well I'll tell you.  It's the layering up of touches like this that move her away from being a rigid CG shell (which was something we were very keen to avoid) and give her a more squishy and pliable feel, even if you don't know why.

Now, if we look at the underlying structure of her head and how it's constructed it might differ from some other game characters.

When we were doing early animation tests we decided to look at the stop-motion animated films of Laika, such as Paranorman, Boxtrolls and Kubo. These stop-motion films use real world models to animate rather than CG models in the computer (this is broadly true, but the Laika films do actually contain many CG elements). In these films they have hundreds of different 'face masks' each with a slightly different expression that the stop-motion animators swap each frame to gradually animate the faces of the characters. If you skip to 0:45 in the following BBC Click feature you'll see what I mean...

Of course our game isn't stop-motion (we're working in CG), but we decided to take a similar approach with Tove, at least for the lower part of her face to give it a little more charm. She has a number of lower face masks, each with a different expression. When we want her to change expression we simply hide one and show another, simple! We've got a number of these 'face masks' already made and we'll add to the library as we go.

We could have set these up as blend-shapes, meaning that they would smoothly interpolate and transition from one face shape to the next. However we first tried a simple swap, a 'pop' instantly going from one face shape to the next, to see how it felt. It looked great, we liked the 'crunchiness' of it and it stopped it feeling mushy. This approach also has the added bonus that we can take liberties with the geometry topology of each mask (which would would have had to maintained using blend-shapes).

That's where we leave the Laiki comparisons and forge our own path. The rest of her facial features are actually 'floating', they're not 'sewn' into the rest of her head as is traditionally done with 3D game characters (at least the ones I've been involved with in the past). The 'eye units' (comprising of eyeball, iris, pupil and upper/lower lids) are simply sunken into each socket. Each eyebrow, and even her nose, can slide around on the surface of her face. This approach might not be possible if your characters were textured in the traditional sense, but as the characters in Röki are flat shaded it works just fine...It's almost like we planned it! ;)

This hybrid approach seems to be working out very well for us; The floating animated elements and the stop-motion style masks swaps complement each other well and also make Tove look a little different from the crowd which is pretty cool. I'm sure we may make some tweaks as we go but we're pretty chuffed with the set-up we have and the performances we're able to get of her.

That's it, we hope you've enjoyed this series of blog-posts about Tove, until next time.


Alex & Tom.



We'll be sharing a neat-o breakdown of Tove's facial set-up for #ScreenshotSaturday this week so keep your eyes peeled for that :)

Alex Kanaris-Sotiriou