Project 4: Animate

Date Assigned: Tuesday, 12 May 1998
Date Due: Tuesday, 26 May 1998
Artifact Due: Tuesday, 2 June 1998

Project Description

This project is designed to introduce you to splines and how they are used for animation. There are two parts to this assignment. The first part is to implement several types of curves in a skeleton keyframe animation system that you are given. You can take a look at the sample solution executable, as well.

The second part, due one week after the implementation is due, is to use your system to produce a VRML animation based on the character you developed in Project 2.

Animator Interface

Animator allows you to read in a VRML file and add animation to it. Before attempting to read a VRML file, you should remove all PROTOs, and all PixelTexture nodes - the parser does not handle these. There are two ways to save the animation. The first is to write it back out as VRML. This will produce a VRML file that is augmented with the timers and interpolators necessary to produce your animation. This kind of file can not be read back in to Animator. You should use this to produce your final output once your animation is done. The other option is to save as an "animation". This type of file can be reloaded, but it does not store the original VRML code. To load an animation, you must first read in the VRML file it applies to, then load the animation file. This allows you to, in theory, make changes to the VRML file without losing the animations you have created (more on this below).

To get started, read in a simple VRML file by choosing "Read VRML..." from the File menu. This will give you a two-panel window like this:

The left window shows all the nodes and fields of your hierarchical model using a standard Windows tree control. You can use the left button to expand and collapse the view of this tree. Clicking the right button on an editable field (in the picture I've clicked the "diffuseColor" field under the LOWER_APPEARANCE node) will give you an edit pane in the right window. You can have multiple edit panes open; the right window will become scrollable as necessary.

The right window is where you specify curves to animate a given field over time. Each pane has one or more curves corresponding to the parts of the field. A diffuseColor field, for instance, has three curves, one for each primary color. For each curve you set control points with the left mouse button, and interpolation is done according to the selected curve type. Each curve's type can be set independently. In the illustration I've selected a linear curve for the blue and green components, and a quadratic subdivision curve for the red component.

Right-clicking in an edit pane gives you a menu:

On this menu you can select the curve to edit ("red", "green", or "blue" for this example) and set the type for the currently selected curve ("Linear", "Quadratic subdivision", etc.). The "Close editor" option removes the edit pane (you can get it back from the left window). The "Delete field animation" removes the edit pane and deletes the animation associated with that field. The "Set vertical scale" option opens a dialog box that lets you choose the extents of the y-axis for that field's editor.

Control points are set and moved with the left button, and can be deleted by control-clicking. You can only move or delete the points for the currently selected curve.

The "Set animation parameters..." option on the File menu lets you set the length of the animation in seconds, and choose whether or not the animation loops continuously.

At the top of each edit pane is the "pathname" of that field - the list of all nodes between that field and the root of the scene graph. When you save an animation, each curve is identified by this path name. The "load animation" command looks in the currently loaded VRML scene for each pathname saved in the file. You should be able to modify the VRML file and reload animations, as long as the pathnames are unchanged. If the animation loader can not find some pathname in the current scene, the curves for that pathname are discarded (but other pathnames are unaffected).

Viewing the animation

You can view your animation in progress using Internet Explorer 4. The "Update browser" command on the File menu (or the "U" button on the toolbar) will write a temporary copy of your animation out and send a message to IE4 asking to view it.

For this to work properly, you must do some setup first:

  1. Add the location of the VRMLControl.class applet file to your CLASSPATH environment variable. You can set this by opening the "System" Control Panel and clicking on the "Environment" tab. VRMLControl.class is available on the Projects web page, and it comes in the archive with the skeleton code.
  2. Enable the Java Console within IE4. Choose "Internet Options..." from the View menu, and click the "Advanced" tab. Under "Java VM", make sure that "Java console enabled" is checked - you may have to restart IE4.
  3. Start IE4 and open the Java Console ("Java Console" on the View menu). IE4 sometimes fails to restart applets properly if the the Java Console is not open. You can minimize the window, but you shouldn't close it for browser updates to work correctly.
Once IE4 is, running, you can select "Update browser" within Animator (or click the toolbar button). You should see IE4 pop to the front with something like this:

At the top is the Cosmo VRML viewer. You will notice that in addition to your model (the example is the two-jointed robot arm from lecture), there are two small balls in the scene. The green one is the "go" button, and the red one is "stop".

At the bottom is the VRMLControl applet. The top slider controls the time of the animation - you can drag it back and forth to see your animation at specific points in time.

As the viewpoint moves, the applet will attempt to move the button-balls to keep them in view. You can specify an offset from the automatically-selected positions with the button row of buttons. The six buttons steps the offset along the principal axes, and the slider controls the size of the steps. The label displays the current offset.

The offset will be reset to zero each time the browser is reloaded. To prevent having to move the balls each time you refresh, you can set a default offset by choosing "Set browser parameters..." from the File menu of Animator. Use the buttons to find an acceptable offset for your viewpoint, then set animator to use that offset as the default.

This is one more feature that hasn't been discussed. Shift-clicking in an edit pane will draw a vertical black bar at that time in all the edit panes. It will also cause the time slider to be set at the corresponding time at the next browser update. To erase the time slider, shift-click outside the gridded area of any edit pane.

IE4 occasionally dumps core when it updates. This shouldn't cause you to lose anything; you can restart IE and do browser updates normally. It will also occasionally fail to reload the applet properly. If this happens, make sure the Java Console is open, and shift-click the Refresh button in IE. (It will always fail to reload if the Java Console is not open.)

Required Extensions

Currently, the system is incomplete. You will need to implement some routines for the curve window portion of the interface. So far, linear interpolation and quadratic subdivision are the only curve types implemented. You will add some other useful curve types to the system. Specifically, you must add: Each curve type should work in both wrap-around and not wrap-around modes.

Linear interpolation is how VRML animates. A line segment is drawn between adjacent control points, and the parameter value is evaluated along that line for every time between the two control points. Don't confuse the user-drawn control points with VRML control points. The job of your code is to the take the user-drawn control points, and generate control points for VRML that closely approximate the desired curve.

You should start each new curve type by copying LinearCurve.h and LinearCurve.cpp, and making changes as directed by the comments in those files. You will also need to make slight additions to Curve.cpp and the project's resource files; you will find comments in Curve.cpp telling you what to do.

The main method of each curve type class is called Generate. It takes the minimum and maximum x-extents ("x" in this case represents time in the animation, "y" represents the parameter value), a boolean flag indicating whether the curve is supposed to wrap around, and an array of control points. It should return an array of new points which are endpoints of segments approximating the curve.

For Bezier curves (and the splines based on them), it is sufficient to sample the curve at fixed intervals of time. The recursive subdivision algorithm presented in class may be implemented for an extra bell.

C2-interpolating splines have an extra two degrees of freedom that are unspecified by the control points. You should implement what was referred to in class as "natural" C2-interpolating splines, that is, let the derivatives at the two endpoints be equal to zero. There are other valid ways to handle this, see the bells and whistles section.

Time needs to be monotonically increasing. It doesn't make sense to have something moving backwards in time, or you can think of it that every point in time needs to correspond to exactly one parameter value. Note that for interpolating curves (Catmull-Rom or C2-Interpolating splines), the condition on the x values of the control points does not necessarily ensure that the curve itself will also monotonically increase in x. You should recognize and handle this case appropriately.

Animation Artifact

You will eventually use the curve editor to produce an animated artifact for this project. Each person must turn in their own artifact. We may give extra credit to those that are exceptionally clever or aesthetically pleasing. Try to use the ideas discussed in the John Lasseter article distributed in class. These include anticipation, follow-through, squash and stretch, and secondary motion.

It will behoove you to simplify your VRML model as much as possible before. You must remove PROTOs and PixelTexture nodes; Animator's VRML parser will choke on these. You must also rename any DEF'd nodes whose name begins with an underscore; these names are used internally by Animator. To see if Animator can handle your VRML file, try reading it in and immediately writing it back out. If the new file works, you should be fine. (The files will probably not be exactly the same because Animator re-indents the VRML when it writes it out.) I would recommend removing texture maps, simply because you will be refreshing the browser often while creating the animation and it complex textures will slow you down.

Bells and Whistles

[bell] Use a recursive subdivision algorithm to produce Bézier curves, rather than just sampling them at some arbitrary interval. For an extra whistle, let the user control the flatness parameter.


[whistle] Enhance the requred spline options. Some of these will require alterations to the user interface. Some suggestions:


[bell] Implement a "general" subdivision curve, so the user can specify an arbitrary averaging mask.


[bell+whistle] If you find something you don't like about the interface, or something you think you could do better, change it! Any really good changes will be incorporated into Animator 2.0.


Before going crazy with bells and whistles for the implementation part, keep in mind that the animation is worth 10% of your final grade (almost as much as the project), so you might want to get started early.