A DEN Postmortem #3 : Diary of the devs

Here is the third article in a series of 5 devoted to the creation of DEN.

Witten by Nicolas Liauthaud from La mécanique du plastique right after the end of the Ludum Dare #38 Game Jam.

This article is dedicated to the pixel-art style and the realisation of the animation.

Den postmortem #3 : pixel art animations

In parallel to illustrating the environment for Den, we had to make little frightened animated men. As we never did pixel art animations in such a short time, we rapidly realized that our habitual creation tools weren’t adapted to produce quick rough sprite animations. A quick search lead us to Piskel, a browser-desktop-opensource-freedom app that is probably an obvious tool for a lot of you, but were a amazing discovery for us.

Onion skin, layers, realtime preview, shortcuts, auto color palette, local saves and all-featured imports/exports. It took us a few minutes to embrace it.

PM-31
PM-32

The men animations are 32×32 pixels, in 8 colors. There is three runcycles, an idle, a fall, a fall reception, a cornered idle, a shouted when cornered reaction, a standing up and taping code.

Two tips were used for the runcycle : the arms were separate layers, allowing three quick variations onto one base. And taking advantage of the limited details, only the half of a run cycle is made : the character always use its left foot. It creates a pretty much fluid cycle for 5 frames 🙂

The implementation were pretty straightforward. Every states are based on a few inputs (mainly velocity, vertical velocity and desired velocity), the runcycles are switched using a randomized parameter on an enter state of a StateMachineBehavior. The run animation speed is connected to the character velocity, which is slightly randomized for every character.

PM33PM34

We often duplicated frames in Piskel in order to have a direct control on the animation structure and rhythm. As a result, the files contains multiple data that could have been stripped away. It wouldn’t be the most efficient way to make the spritesheets, but in these time conditions and with the microscopic weight of the animations, doing that way allowed us to integrate the animations in one click, without any retouching in Unity.

pm35PM36

For the head bang animation, for simplification’s sake we choose not to animate the recoil by hand but to tween directly the head position, using parametrical animations driven by AnimationCurves. Some missing time for debugging led us to some spectacular dismemberments possibilities in the release.

PM37