Dev Blog - Animations and Wrist Codex

Bi-weekly blog post

Hello! This blog post will be a little different than usual. We are preparing the Admiral Tier demo that takes place in 2 weeks and are currently working a few more hours than usual to get everything done. Rest assured; we are not crunching inhuman hours! We’re just spending a little extra time to get everything ready in time. This is also why this blog post arrived a bit later than usual, apologies!

As usual, remember that GIFs do not load on mobile!

Dawn sprites

We finally began working on player sprites! While working on this we could not resist to also add a Chasecam, allowing you to see the action from third person.

One of the goals we’ve set from the beginning is to give Dawn the exact same animation fidelity as any enemy in the game. Meaning that most of her actions will have proper animations to go along with it. If you jump, you will see her perform a jumping animation. If you toss a grenade, she will play a grenade toss animation. We’re making good progress here! The gif above is still largely WIP, but it’s fantastic to finally have an actual player sprite instead of a cardboard cutout from her concept art.

While on the subject of animation, let's dive deeper into how we achieve that

Animation

Ever since we’ve shown our first bits of gameplay footage, we often received praise for our ‘’low FPS animation’’ style that is used in Selaco. Today I’d like to dive deeper into how animations are done.

It is no secret that id software used clay models to get sprite references for most of their sprite work. They would sculpt the models, pose them, take digital scans then clean them up by hand using digital software. Our approach is actually not that different, except we rely on 3D models instead of clay. Allow me to explain!

Given that we use 2D sprites for our enemies, we did not want our animations to look too perfect and clean, which certainly helps given how none of us have a proficient background in animation. Rendering animation at a lower resolution certainly helps, but when using advanced animation tools things can quickly become ‘too perfect’, which is not what we are aiming for. We are trying to achieve a 'stop-motion' style of animation where it becomes obvious that it's done by hand and not improved / touched up by interpolation algorithms and what not.  Usually when animation is done using 3D, many different techniques are used to get seamless motion. Like keyframe blending and Controllers. This applies to most games out there, including indies. For Selaco however, we use none of these techniques. Every single frame of animation is posed by hand with no blending in between!

I don't have much of a background in animation, so this was a huge challenge for me. We made use of the aforementioned animation tools in the past, but I was never quite satisfied with the results. After doing our frame-by-frame posing method in the similar vein as id software did back in the day, I finally started to appreciate how the animations looked in-game. Still smooth as hell, but it feels more hand-made and less overly perfect, which made the low FPS Animations look very artificial.

To give everything a more sprite-like appearance we need to remove as much perspective from the image as possible, otherwise the sprites will look way off when seen in-game, like legs not properly touching the floor. This is an easy one! We simply replace the Perspective camera of Blender with an orthographic camera. This removes all the depth from the camera, making the whole thing seem flatter.

With the animation ready to go and the camera being set in place, we can begin rendering! We use a custom Blender script that plays and renders the entire animation we have created, while taking 8 ‘pictures’ from multiple angles. This allows us to get all the sprite angles as a series of PNG’s while also automatically assigning the correct naming convention into the file.

We have all the data we need and could start moving them into the correct SPRITES folder so the engine can read them, but we're not done yet.

The models are designed with sprites in mind, however, a straight render from Blender is not often convincing enough. We still need to apply some changes in photoshop to make it blend better with the game world. Everything in Selaco is colorful and bright, so we need to color-grade the sprite to match it.

Default

Edited

The next concern is the amount of lights on Dawn's armor. As you can see in the screenshot below, Dawn has bright lights on her armor. If a bright object on the sprite is not properly lit in-game, the whole thing starts to feel fake. We need to find a way to illuminate these bits in the game engine to ensure that these parts of the armor pop.

To do this, we use a technique called ‘Brightmapping’, color data for GZDoom to decide what parts of the sprite should be brightened up. This allows it to glow ingame and make sure it lits up accordingly in the darker areas of Selaco. To get brightmap data, we turn off all the lights in Blender, set the Ambient Lighting down to 0 and make the glowy parts of her armor Emissive and amplify it ever so slightly to get a powerful Bloom effect. Then we repeat the same Sprite batch rendering step and get a whole new set of images This will result in a black silhouette where only the emissive data is shown.

When this is all done, the animation can be added in game! [The color artifiacts are due to the GIF's color limitations. These are not in the game!]

Wrist Codex

To close this blog post, here is a sneak peak of the Wrist Computer working in-game. The Wrist Computer is far from completed, but will function as a powerful information device that allows you to retrieve emails from other people, get information about the enemies you've encountered, find information about the current Invasion Tier (which we will dive into later!) see Level Completion or even read some miscellaneous about Selaco as a whole; it's origins, the brands involved with the game world and much, much more. 

Ken Coghlan, our dedicated writer, is going to have a lot of fun with this and hopefully the players will appreciate the amount of background lore we are providing in the Wrist Codex. The Wrist Computer is a prime example of just how powerful CockUI is going to be!

That's it for this week. A different type of blog post than usual. Let me know if you prefer to see more ''making of'' stuff moving forward. By the next blog post we'll show a new enemy type called The Enforcer, probably our most heavily armored unit yet which we are really stoked about. Stay tuned!

As usual, none of this would have been possible without you guys. Thank you so much for your support with this project. See you in 2 weeks! ❤

- Wesley de Waart