Learn Three.js - Third Edition

Morphing and skeletal animation

When you create animations in external programs (for instance, Blender), you usually have two main options to define animations:

• Morph targets: With morph targets, you define a deformed version, that is, a key position, of the mesh. For this deformed target, all vertex positions are stored. All you need to do to animate the shape is move all the vertices from one position to another key position and repeat that process. The following screenshot shows various morph targets used to show facial expressions (the screenshot has been provided by the Blender Foundation):

• Skeletal animation: An alternative is ...