Framework for 2D SVG animation jitter

Abstract

It has been nearly half a century since the computer animation was invented and widely used all over the world but there is still great interest in imitating some effects of the traditional animation in modern computer animation. One such effect is the Jitter Effect of the traditional 2D animation that is apparent when a sequence of frames is drawn manually by hands. In this project, an application, called SVG Jitter Application, which can be used to produce images in SVG format with the jitter effect of the 2D Animation, was developed using Java language.

The jitter effect is successfully recreated in computer animation with the use of a type random function specially designed for that purpose. Many constrain such as maximum range of the variation, direction of the variation, value of the variation were taken into considerations while designing the random functions. The results of the random function are applied to the SVG images which are then manipulated using SVG Document Object Model (DOM). A user friendly GUI was also developed in order to enhance the user experience of using the application.

By using the SVG Jitter Application, user can avoid drawing multiple frames to create the Jitter effect and thus saving a lot of design effort as now user needs to draw a single frame by hand. The SVG Jitter Application also supports other functions such as play the generated frames as animation and inspect them individually to ensure their quality. In order to ensure the quality of the application, a usability test was also conducted. The results indicated that the participants were satisfied with the overall experience of the SVG Jitter Application.