Creating Loopable Animations By Ryan Bird A loopable animation is any-length animation that starts the same way it ends. If done correctly, when the animation is set on a loop cycle (repeating itself continually), it looks like one continuous animation playing over and over and won t have a visible interruption where the animation ends and then starts over again. Figure 1 shows a character running. In this 160-frame animation, only 16 frames have been animated by hand. Those frames were then placed consecutively several times to create a longer animation. The result appears to be a character running a long distance; but to create it, I only had to hand-animate a small portion. http://blip.tv/play/hvysgtcovqa.html Figure 1. An example of a loopable animation There are many uses for loopable animations: They can be used in 2D and 3D animations, as well as for characters, objects, and environments. They can be utilized for video game animation as well as pre-rendered animated movies. This article discusses several of these uses. Use of Loopable Animation in Video Games In video games, many of the in-game animations rely on loopable animations, because during game play, the controlled character can have a variety of animations that need to play at the touch of an array of button pushes or button combinations. In addition, surrounding characters, objects, and environments need to be able to react immediately to several of the controlled character s animations. One of the best ways to accommodate so many combinations of moves is to use loopable animations specifically, having most if not all of a character s or object s animations start and end from the same base pose. Because it will be seen a lot and be the point of connection for many animations, it s important that this base pose be interesting to look at and able to work with all of the animations. You should establish the base pose before starting the animations. A good idea for establishing base poses is not to make them too extreme or too simple. A pose that is too simple can be easy to connect animations to, but may not look interesting. An extreme pose can be interesting to look at, but can make it difficult to connect other animations to it. Finding a happy medium helps combine an interesting look with a pose that s fairly easy to connect to a variety of animations. Figure 2 shows some base pose examples that could be used for a fightingtype game.
2 Creating Loopable Animations Figure 2. Some examples of good and bad base poses Pose 1 in Figure 2 shows a character pose that s bland and uninteresting. With all the animations starting and ending with this pose, not only will it set a bland tone for the animations connected to it, but it can also become stale. Pose 3 shows a character pose so extreme that connecting many animations to it flawlessly would be extremely difficult (even though it might be interesting to look at as a still image). Pose 2 offers a happy medium between the two extremes. Action Animations in Video Games In video games, when a player presses a button or button combination, an animation for the controlled character or object plays. Whether it s jumping, kicking, punching, running, shooting, or any of a variety of other moves, most of these animations need to start from a base pose, and then return to that same pose after its animation has played. Figure 3 shows how four different action animations can start and end with the same base pose. http://blip.tv/play/hvysgtcozaa.html Figure 3. Four examples of action animations all connected to the same base pose In the example in Figure 3, each animation is the same length for display purposes. Note that this is not the case with typical game animations, and the length can be whatever is appropriate for the animation and game engine restrictions. Not all action animations will be connected to the base pose. Actions like running, walking, flying, and swimming could be their own loopable animations that connect to the base pose through a
Creating Loopable Animations 3 type of connecting animation. Connecting animations start from the base pose and end with a pose from the start of the loopable action. A connecting animation does the same to bring a character back to the base pose. Idle Animations in Video Games One of the more popular and less complex uses of loopable animations for video game characters is what s commonly referred to as idle animations. These animations are typically used for a character that is waiting for a player to take action. They can include things like the character swaying slightly, breathing, looking at its watch, tapping its feet, looking around at its environment, and waving at the player. Idle animations can be used in-game as well as in the game s user interface before the game starts such as when a player is choosing, equipping, or dressing his or her character. Generally, many of a game s idle animations will be used on the characters, often to help save memory and disk space although there are definitely cases where animating video game objects or environments is necessary either to catch the player s eye or to add some ambient motion. A few examples of this could be trees swaying in the wind or a treasure chest opening and closing. In these cases, using small, loopable animations to create these effects can help save precious memory and disk space. Use of Loopable Animation in Pre-rendered Movies The process for making loopable animations for pre-rendered movies is the same as for video games: Start and end with a base pose. The uses and techniques for movies can vary, however. One difference is the length of the animation. In video games, it s all about making sure the file size is within the limits of the game s engine, as well as keeping within the disk space constraints. For pre-rendered movies, animation length and size are much smaller factors. Usually, loopable animations for a pre-rendered movie can be as long or short as desired. Another difference is that unlike video games, loopable animations are usually not the focus of attention in pre-rendered movies. Although there are the occasional loopable actions in a prerendered movie, most of the work usually goes into non-loopable animations. One of the more common forms of loopable animation in pre-rendered movies is what many animators refer to as cycle animations. These animations can include run cycles, walk cycles, fly cycles, swim cycles, and many other loopable animations that are attached to the main characters as well as background characters. Although the bases of these animations are created as loopable animations, many animators will add differences to each cycle for variation and to avoid repetitiveness. For example, an animator may take a run cycle that is looped five times and add a head turn to one of those sections.
4 Creating Loopable Animations Another common use for loopable animations in pre-rendered movies is for background characters. In scenes and shots where there are many characters but the main focus needs to be on one or a few characters, subtle loopable animations can be added to the characters in the background to add life to the scene. Note that I used the word subtle: If the animation for the background characters is too exaggerated or too expressive, it can distract from what the viewer is meant to be focusing on. Making It Work For a loopable animation to work properly, the start of the animation needs to combine smoothly with the end of the animation so that when the animation is looped, there is little to no visible interruption when the animation finishes and starts over. A common misconception when doing this is that if the first frame is the same as the last, then that is all that needs to be done for it to work correctly. That is one of the steps, but there s more to be done. To get the start and the end of the animation to sync up smoothly, the flow of the end of the animation needs to be able to blend into the beginning. This means that once the main portion of the animation is complete, you need to do some tweaking on both the front and the end. Many animation software packages have graphical editors that allow the animator to control the animation curves. These animation curves tell the computer how to blend the motion between one keyframe and another. Blending options can range from a linear transition to easing in or out. In addition, many software packages provide a type of control handle that allows you to manipulate the curves by hand (see Figure 4). Figure 4. The graph editor in Maya* displaying the animation curves for a loopable animation Figure 4 shows a screenshot of the graph editor in Autodesk* Maya*, which you use to control and edit animation curves. The curves shown are for a loopable animation. Notice that the start and stop curves are the same, but the angle of the control handles is not the same. If this animation were played on a loop, there would be visible jarring when the animation ended and started over
Creating Loopable Animations 5 again. To fix this problem, the angles of the start and end control handles need to match up, as shown in Figure 5. Figure 5. Two steps to align the start and end control handles Figure 5 shows how I would fix the problem. I start by horizontally flattening both control handles: This ensures that both control handles start at the same angle. Then, I select both handles and angle them by hand until I get the desired angle. The result gives me a smooth transition between the start and end. The last thing I do is move the last keyframe forward one frame. I do this because if the start frame is exactly the same as the last frame, when they are looped, there is a possibility that a quick stall can appear where the animation ends and starts again. This stall may be unnoticeable or even nonexistent in some animations. However, moving the last keyframe one frame forward helps to avoid the problem entirely.
6 Creating Loopable Animations Making It Look Good Just as important as making sure the loopable animation works properly is making sure it looks good. This is where you need to have a good eye for detail and double-check the animation. Similar to creating a tileable texture for a 3D model, check for things that stick out too much or not enough in a loopable animation. When creating a tileable texture, it s important to stay away from areas of extreme design or color. These extreme areas may look good as a non-tiled texture, but once they are tiled several times, these areas quickly stick out and become distracting. The same goes for loopable animations. Specifically, when you re dealing with a short loopable animation, it is essential to make sure that no areas are more or less exaggerated or expressive than the rest of the animation. These problem areas will stick out the more the animation is looped and can quickly become a distraction. Another thing to keep in mind is timing. A short loopable animation played during a long scene can become notably repetitive. A long loopable animation played during a short scene can be a waste of animation, unless it is used in other scenes. Finding the right balance with timing can make loopable animations useful and visually interesting. Conclusion As with creating any type of art, it s important to double-check your animations. I make it a practice to step away from what I m working on for a while, come back, and look for areas that need to be improved. Doing so helps me to catch things that I missed because I was staring at it too long while I was creating it. Loopable animations make a great addition to an animation portfolio or demo reel. Many studios look closely for this skill, because it can be tricky to do correctly. Like other skills, it can also take a while to nail down. The secret to success is to keep practicing and keep learning. About the Author Ryan Bird started his career in 1996 at Viewpoint Datalabs*, building content for movies, video games, television shows, commercials, the web, and many other forms of media. From Viewpoint, he worked at Microsoft* Games Studio in Salt Lake City as a Character Lead on several sport franchises. He also worked at Sensory Sweep Studios* as a Team Art Director on some of their biggest titles. Ryan now owns and operates his own business, doing modeling, texturing, rigging, lighting, and animation for professional sports teams and other big-name companies.