An example of cutout animation using Tupi
The following is a review of our experience producing an animation exercise using Tupi. The basic idea was to test this tool creating a short film to find out the potential of its features and also to learn its limitations.
In a few words, the cutout technique consists in building your characters using mobile and interchangeable parts like a puzzle. In that way, one arm is an independent object of the body and it can be moved rotating it over the shoulder point or even replacing it with other image of the arm in a different position, depending on what you want to do.
The same technique was used for the head movements, the character walk cycle, etc. We believe that Tupi is a good tool to make cutout projects because you can enlarge, shrink, rotate and move each piece of the scene, including the backgrounds and the "over-layers" (the parts of the stage that are between the viewer and the character). All these transformations allow you to play with fewer pieces and plenty of different possibilities within the limitations of the cutout animation.
To make the pieces of the character, we used a vectorial authoring tool called Inkscape (http://inkscape.org). Each part was saved as a SVG file and then imported into Tupi from its library interface.
The character close to the big red asterisk on the bottom left of the image above consists of the parts marked with the smaller asterisk. Following the same order, the character is 'rebuilt' into the Tupi workspace. Depending on the complexity of the character and its position the number of pieces may vary.
Note: The Figure 1 is just a partial set of the parts used in this exercise.
The two images above correspond to 'arms' positions of the character ready to be exported as SVG files from Inkscape.
Now, let's take a look at this video of 5 minutes, showing some steps of the animation process for our project using Tupi. Pay close attention to how the animator handles the pieces of the character to create the illusion of movement:
To compose the backgrounds, we chose some photos previously manipulated with the Gimp application (http://www.gimp.org/). In some cases the images were divided into layers (to create some over-layers like the glass table in one of the scenes). Each background was saved as a PNG file and then imported into Tupi.
To synchronize the character expressions with its voice we used the Jlipsync application (http://jlipsync.lamhauge.dk/). With this tool you can calculate the timing, in terms of frames, of every silence and every letter of the voice recording. The interface has a preview with standard shapes of mouths to verify that the movements are consistent with the voice being played.
The spreadsheet data was copied and pasted into Inkscape, then exported to a PDF file for easy reference along the animation process.
The original voice recording was enhanced using the Audacity application (http://audacity.sourceforge.net/). Additionally, we created a small loop with the ambient sound to cover the previous seconds to the character's introduction.
Finally, to combine all the scenes generated with Tupi and the sound layers (voices, ambient noise and background music) we used a video editor called Pitivi (http://www.pitivi.org/).
We would like to say that during this exercise many improvements were made to the Tupi source code in order to enhance the user experience. For that, we thank the animation team's feedback and support.
Note: We are confident that in future versions, Tupi will be a great alternative as "paperless" software.
If you have questions or comments about this article, please don't forget to visit our forum. All questions are very welcome!