Welcome back Morlocks! We continue with the third installment of our series about creating our new iClassics: H.P. Lovecraft’s “The Colour Out of Space”. After the script process, character creation, and illustration and final color, the next step is the animation of the interactive elements.

Once the illustrator has finished all the illustrations, separated by layers and cut, they take them to the animation and programming team. At this point, the whole creative team meets to analyze each page and define what kind of animation and interaction will be made for each one of them. We analyze both technical aspects (detect if the artwork is well prepared or needs tweaking, how to set up the assembly to achieve the desired effect, etc…), creative aspects (the speed of the animations, what elements need to be animated and how they contribute to the story or even the performance of the characters). Once all these aspects are clear, the first pieces of animation begin to happen.

Normally, most animations have two states: the resting state, which gives “life” to the illustration (such as the slight movement of wind from tree branches or the breathing and blinking of a character) and the interaction, which is the action that triggers the user to touch the screen. For the animations we use the program Spine, developed by Esoteric Software, usually used for the animation of games in 2D. An iClassics production has a very different concept from games, but with imagination and many hours of trial and error, you get really spectacular effects and animations. To animate previously segmented illustrations, animators generate a skeleton that corresponds to the character or object to be animated. This skeleton is composed of different bones to which the pieces of the illustrations are linked, thus giving motion to static images.

During this process, a Mesh is generated by hand, that allows adding deformation and volume to the illustrations, thus permitting the characters to move naturally, breathe, or have facial expressions, etc. At this time, the characters and scenes can even be constructed in a tridimensional way.

Another recurring effect is the generation of 3D effects starting from 2D (parallax) illustrations, by separating the layers at various levels and thus generating depth when moving the device.

The final touch on many of the animations, in regards to the setting, is given by adding particles and light effects: For example, explosions, fires, candles, dust particles, rain, snow, insects, smoke, and fog can be obtained with them. It is a laborious task, because each particle has to be refined in texture, transparency, tone, quantity, gravity or time of life, so that it generates the desired effect and integrates naturally into the scene.

And this, in short, is the animation process of an iClassics production (we could go for ages about the many effects and techniques used, but that would lead to an entire conference). In all this process, magic is achieved by the programming team, who save our lives when the animation tools are short, ingeniously making the artistic madness make sense. In addition, they make sure devices can withstand the resources and the user experience is satisfactory. In the next post we will talk about a very important aspect in iClassics: the design and layout. Cthulhu Fhtagn!