cs7496: Project 4

Morph Animation

by Matthias Grundmann

more details and projects can be found at my homepage


Matthias Grundmann
grundman[at]cs.tum.edu

Project 4

This project should demonstrate a deformation of a image as well as a morph between two images. I used the cubic-fit version of Jareks mesh-warp and tweaked a little bit to give it realtime performance. I don't use the cg version, cause I didn't like the global nature of it.
I used a sample movie and pictures from Elastic Reality for inspiration, it is the 'president-warp'. This warp is rather complicated, because, you see a clear silouhette, the silouhettes differ very much, and the drawing have lots of patterns that could be easily destroyed in the blending step and there are elements in one picture you don't see in the other.





Usage

There are two different modes implemented, a twister mode, which is best suited for global deformations, and which was used to make the cartoon morphs and a bezier curve mode, inspired by Avid's Elastic Reality from 1999, which allows to control the movement very easy but also accurate. You can switch between both modes by pushing the button on the right.

Getting started

To see the bezier warp in action, press 'x' to load, 'c' to build the constrains and 'a' to animate. Switch the different views with 'p'.

Twister mode

Click somewhere to add a new twister gizmo. Now you can move it by draging the center or change the orientation with the blue handle. You can also change the area of interest, where the decay is applied. The decay is modeled by the cos-square function given by Jarek's paper.
Shortcuts:

Bezier-mode

The Bezier-mode is more sophisticated and the main part of the program. Click the 'new curve button to create a new curve. Place the control points with the mouse and hit enter to add the curve and backspace to dismiss it. Afterwards by clicking on the 'adjust curve' mode you can adjust the tangents and the control points, or add new points by clicking on the highlighted mid-points. You can also add anytime control points (not related to any curve) by just clicking on the image. You can drag them to their destination. Switching between source and destination can be obtained by hitting 'p'. To use the bezier-curves, press 'c' and the curves will be sampled based on the curve distance and the specific control points will be introduced. Shortcuts:

Additional

Remarks

I didn't try to get the same warp only with twister or only with bezier-approach, cause I think both techniques are very different and the one is much better suited for global deformation while the latter gives one exact control one need for warping. Cause the techniques differ so much, the program lacks of the demanded 'one-button-solution' to animate the whole A1-A2-A3 cycle, it just that my data-structures and the logic differ a lot for both approaches. That's why I sticked the images for the 3 animation together and created a video. (I also used more iterations for this) But I hope the additional bezier-feature compensate for this.

Movie Cinepak encoded (8MB)
Movie Indeo 4.5 encoded (3MB)
And the original sample movie from a Elastic Reality tutorial, the quality they are able to produce is just awesome.
Original movie (2 MB)

The applet

To view this content, you need to install Java from java.com

Source code: smile bezier button cg gaussianquad newton p3d twister

Built with Processing