cycle sec


"Parrot" key frame (12 frames) Loop spline based animation from the Rome project. Set new animation cycle. Use your fingers or mouse to control the model (hold shift key or use mouse wheel to zoom it). Canvas is matched to your browser window.

More animated models from the Rome project.








and chow, bunny, flamingo, parrot. In these models colors are blurry a bit due to per face material conversion into per vertex one in the scripts (and from textures into per face colors earlier as I think).

Keyframe animation

For the keyframe animation all frames (from 10 for the fox to 26 for the eagle models) are stored in the aPos attribute. The attribute aPos2 has displaced frames. Then to obtain animation in the vertex shader the linear interpolation with the weight a(t) (uniform) is used
   vec4 pos = mvMatrix * vec4(mix(aPos2, aPos, a), 1.);
   vec4 rotNorm = mvMatrix * vec4(mix(aNorm2, aNorm, a), .0);
As since indexed faces (gl.drawElements) are used, therefore the total point number in all frames is limited by about 64000.

Surprisingly all animal models have the same vertex number (494) and face indexes (only point positions are changed), therefore in all animations one subdivision (i.e. 1970 points are used). For some birds (e.g. parrot and flamingo) N = 2 subdivisions are used (5010 points).

Every subdivision increases 4 times number of points and faces. Therefore even for one subdivision model is "compressed" 4 times and smooth normals are generated accurately.

Little dolphin game

Little dolphin dolphin is gathering garbage to save corals

Skeleton animations

  1. Key frames enlarge animation size quickly. For complex movements skeleton animation suits much better. We can use 3D modelers to learn skeleton animation.
  2. Building the Game: Part 3 - Skinning & Animation by Brandon Jones.

Contents   Previous: Loop subdivision spline surface
updated 25 Apr 2013