Course notes for November 6

In this week's course notes, I refer to some earlier things I've done in Java. To see these examples, you might want to use a browser such as Firefox that will let you install and run Java applets.

Forward Kinematics

Often we want to create hierarchical mechanisms, such as this balancing mechanism that I showed in class. These hierarchically structured mechanisms generally use forward kinematics, in which transformations form a tree structure that descends from a single root.

an class we implemented a swinging arm, as a simple example of forward kinematics.

Given a matrix object m that has methods to implement translate, rotate and scale, as well as the ability to maintain an internal stack of matrix values via push() and pop() methods, the swinging arm is implemented via the following code: 
   m.push();
      standardView(.5,.5,0,0,.5);
      m.translate(-.5,2,0);
	 m.push();
         m.rotateZ(sin(3*time));
         m.translate(0,-1,0);
	 m.push();
	    m.scale(.1,1,.1);
	    unitCube();
	 m.pop();
	 m.translate(0,-1,0);
	 m.rotateZ(.5 - .5 * cos(3*time));
	 m.translate(0,-1,0);
	 m.push();
	    m.scale(.1,1,.1);
	    unitCube();
	 m.pop();
      m.pop();
   m.pop();

For clarity, I implemented the above example using push and pop methods. But if you want to create a system that allows users to put together their own object hierarchies, you are better off using explicit objects.

In such a scheme, each object would have its own matrix transformation, and would also maintain a list of child objects. The transformation of a child object would be relative to its parent, thereby forming a tree of object nodes.

Animation over time -- key frame animation

When creating animations, it is often convenient to specify values only at certain frames, and then use smooth curves to interpolate values at the frames between these key frames. In-betweening with ease curves which start and stop with zero derivative, such as 3t2-2t3 produce natural looking interpolations.

I showed an example of this in class: a hand that can be animated by setting key frames.

To show different animations of the hand, type "a1" or "a2" or "a3" followed by the space key. You can also read the on-line instructions on that page to learn how to vary the key-frame animation.

Inverse kinematics

Inverse kinematics is the opposite of forward kinematics. In an inverse kinematic system, you start with the location of an end effector (such as a hand or a foot or a robot gripper), and the system needs to figure out the corresponding chain of intermediate matrices from the root of the object hierarchy.

There are two common approaches to inverse kinematics, general N-link IK and special purpose 2-link IK. The N-link approach requires an iterative solver, whereas the 2-link approach has a closed form solution, with no need for iteration.

To talk about 2-link IK, consider the case of an leg, where the locations of the hip and ankle are known, and we need to find the location of the knee.

To make the math simpler, let's assume a hip located at the origin [0,0,0], an upper leg of length A and a lower leg of length B. If the ankle is located at some point P, we want to find the knee location Q.

As we discussed in class, knee location Q can lie anywhere on the circle of intersection between two spheres: The sphere of radius A centered at hip location [0,0,0] and the sphere of radius B centered at ankle location P.

To pick the best point on this circle, we need to specify an aiming direction D that says which way is "forward" (since knees generally point forward).

What we need is a function that computes Q, given A, B, P and D. I've implemented, in Java, a solution to exactly this, with copious comments. That solution is posted here. Feel free to use and adapt my algorithm.

I use 2-link IK in my on-line example of man and woman characters that walk on a grid. In that example, you can pull on the arm or leg of a character to see the 2-link IK in action. All of the positioning of torso, shoulders and hips are done by higher level procedural decisions, in response to the general position of the hands and feet, rather than by using multi-link IK.

Conveying emotion

People are pre-disposed to see emotion in characters, so even a very simple character can be expressive, if it has recognizably human traits. I showed this in class with an example of my simple character Polly, made from only six vertices.

Luxo lamps and flying fish

Possibly the most influential short film in the history of computer graphics was John Lasseter's Luxo Jr. One of the many reasons that film worked so well was that Lasseter applied the techniques of traditional animation that had been developed for hand-drawn animation over the course of the previous century.

My on-line desk lamp interactive desklamp shows some of these principles in action. The lamp moves entirely in arcs, not in straight lines, always eases in and out when changing its focus of attention, and uses slower movements for its larger parts near its root (the base of the lamp) while using quicker and more decisive movements when moving its head.

My on-line interactive fish is a modification of the desklamp. It uses the same animation armature that drives the desklamp, but in this case the armature is invisible. The human eye is so good at detecting patterns that people respond to the non-linear movement of the fish character, recognizing the sense of intentionality in its non-linear movements.

The facial expressions of the fish are done via procedural mesh animation, which I will plan to go over in more detail in next week's lecture.

Walking and stepping

To implement advanced algorithms such as walking we need to do things "from the ground up", by building algorithmic mechanisms that figure out foot placement, given a path for a character to walk along. I will be talking about this in more detail next week, but meanwhile I showed some examples for inspiration.

My brown shoes demo shows control of a foot stepping algorithm through a number of useful higher level parameters. The movement model always produces a valid foot stepping movement. Varying parameter values changes the style of that movement.

I also showed an interactive demo of two characters dancing, built on top of this same parameterized foot stepping, as well as other parameters to control posture and body position. I'll go into more detail about how this is implemented in next week's lecture.

Boids

There is an entire sub-field of computer animation devoted to swarms and particle animation. One historically important example of this was Craig Reynold's Boids, which he first published in 1987. This technique for simulating herding and flocking behavior showed convincingly that a few simple procedural rules can create the impression of compelling group and social behavior. This technique was famously used in the 1992 feature film Batman Returns, and has since become a staple of the movie and game special effects industry.

Homework

There are many topics in movement and animation that we have not yet covered, including details of walking algorithms, path planning, collision avoidance, physics-based dynamically driven movement, and general particle systems (to name just a few).

Meanwhile, we have covered forward kinematics in sufficient detail that you can now implement hierarchical models. For next week's class, I would like you to demonstrate a hierarchical object system. Each geometric object should possess a transformation matrix and a list (possibly empty) of child objects, forming a recursive tree structure. The transformation of each child object should be relative to its parent.

You can go in two general directions with this assignment: (1) you can create a key-frame system, as in the hand example I show above, and use that to create a short animated film, or (2) you can implement responsive behavior for your scene that responds to the user's mouse or keyboard input in interesting ways. If you are feeling ambitious, you might want to do both: create an animated film that is modified by user input.

You should not use my Matrix class -- you should define your own. By now you should have all the necessary matrix operations already defined in the course of having implemented earlier homeworks.

Also, I would like your hierarchical models to extend the WebGL modeling and shading work that you've already implemented.

Note that in my examples I am making use of my own "draw lines conveniently" library file g.js, but you won't need that file, since you will be applying all this to your own WebGL models.

If you are feeling ambitious, for extra credit you can re-implement, in JavaScript, the on-line implementation of 2-link IK I describe above. This will allow you to produce much more interesting character movements. For example, it will allow you to directly position the hands and feet of animated characters.

As usual, you are also welcome to define your own direction for extra credit.