Jump to main content

Power Play: How Does Animation Timing Affect Your Perception of Game Action?

1
2
3
4
5
127 reviews

Abstract

"Pow!" Wow, what an awesome punch that character has! Ever wondered what goes into making a punch look good in a video game? Or any other character motion sequence, for that matter? Try this science fair project for a firsthand look at how art and timing can create memorable game action.

Summary

Areas of Science
Difficulty
 
Time Required
Average (6-10 days)
Prerequisites
None
Material Availability
Computer with internet access
Cost
Very Low (under $20)
Safety
No issues
Credits

Ian Slutz, Video Game Designer

Sandra Slutz PhD, Science Buddies

  • ScratchTM is a trademark of the Massachusetts Institute of Technology.
  • Microsoft® is a registered trademark of Microsoft Corporation.
  • Excel® is a registered trademark of Microsoft Corporation.

Objective

The goal of this science fair project is to evaluate how changing the timing between three different animation poses affects how you perceive the quality of a video game character's punch.

Introduction

When a character does something on screen, the game makers want you, the player, to register some kind of opinion about the action—even if it's a subconscious opinion. For example, a character who is running away from a monster should look like he or she is running fast, a dancer leaping in the air should look graceful, and a fighter delivering a knock-out blow should look like he or she has a strong, powerful punch. But using animation to convey the feel of an action might be more difficult than you think.

An animation is made up of several different poses. These poses are still pictures of a character at a given moment. When the poses are displayed on screen quickly, one after another, it appears as though the character is moving. You may already be familiar with this concept if you've ever made a flip book, or even thumbed through the pages in a comic book quickly. Changing the length of time for which each pose is displayed on the screen affects the viewer's perception of the action. For example, if you make a flip book of a girl walking and you thumb through it slowly, it'll appear as though she's strolling, but if you flip through the same book very quickly, the girl will appear to run. In this example, a shorter display time per pose makes the action appear to happen more rapidly.

In video games, the length of time for which a pose is displayed is measured in frames. Each game has a frame rate. The frame rate is the number of times per second that the image on the screen is refreshed, or updated. Frame rates vary from game to game, but two of the most common frame rates are 30 frames per second and 60 frames per second. For this project, you'll use a 60-frames-per-second rate, so each frame will be equivalent to one-sixtieth of 1 second.

In this project, you'll examine how the number of frames each pose in a punch animation is displayed for affects your perception of the punch. First, think about how many poses there are in a punch. Try getting up and moving around the room throwing pretend punches (and no, you can't practice on your sibling!). What is the minimum number of motions you think can be used to convey the action of a punch? To complete this project, you'll use a program that has a punch animation sequence composed of four poses. Figure 1, below, shows images of the individual poses. The first is an idle pose where the fighter is in a position suggesting that he is ready to fight, but his fists are still low down. The second is a windup pose, where the fighter draws his arm back to get ready to throw the punch. The third is a hit pose, where the fighter's arm is fully extended, as if his fist has made contact with the target. And the fourth pose is the finish pose, where the fighter's fists are back close to his body, but still high up, relative to his shoulders, as if he has just finished retracting his arm after the punch. You'll systematically change the frame count (number of frames for which a pose is displayed on the screen) for the windup, hit, and finish poses and evaluate how that affects how powerful the punch appears.



Video game character Ryu in four different poses, idle, windup, hit and finish

Figure 1. In this project you'll use sprites of the character Ryu from Street Fighter Alpha 3 to evaluate how frame count for individual poses in a punch animation sequence affects perceived power of the punch. You'll use four different poses: an idle, a windup, a hit, and a finish pose.



Terms and Concepts

Questions

Bibliography

These resources will give you more background information about frame rate:

For more information about standard deviation, try these resources:

These resources will introduce you to Scratch:

Materials and Equipment

Disclaimer: Science Buddies participates in affiliate programs with Home Science Tools, Amazon.com, Carolina Biological, and Jameco Electronics. Proceeds from the affiliate programs help support Science Buddies, a 501(c)(3) public charity, and keep our resources free for everyone. Our top priority is student learning. If you have any comments (positive or negative) related to purchases you've made for science projects from recommendations on our site, please let us know. Write to us at scibuddy@sciencebuddies.org.

Experimental Procedure

Scratch Project Note

This project idea was written using Scratch version 1.4, which is available at the Scratch 1.4 download page. A Science Buddies tutorial for Scratch 1.4 is available on our Scratch User Guide and additional tutorials are available on the download page. The project can be modified to work with other versions of Scratch. Information about the most recent version of Scratch is available at the MIT Scratch website.

If you are new to Scratch and would like some basic instruction before starting this project, we recommend the free, online Scratch tutorial series from the Raspberry Pi Foundation.

Installing and Getting Started with Scratch

  1. To start this science fair project, you should go to the Scratch download page at Scratch 1.4 and follow the instructions there to download and install Scratch for free.
  2. Once Scratch is installed, click the Power Play file needed to complete this project.
    1. Save the file with the name Games_p024_PowerPlay.sb.
    2. When you are ready to start your project, use Scratch to open the file.
  3. Once the Games_p024_PowerPlay.sb file is open, click the "Enter Presentation Mode" button in Scratch. In Presentation Mode, the character will be larger and the action will be easier to see and evaluate.
    1. The "Enter Presentation Mode" button is located in the left-hand corner, directly underneath the white screen where the sprite is displayed.
  4. To get a general idea of how the fighter's punch looks, play around with the number of frames (in this case, each frame is one-sixtieth of a second) for which each pose is held.
    1. Press the spacebar to watch the fighter throw his punch.
    2. The length of time for which each pose is held is controlled by a slider on the screen. See Figure 2, below. Experiment with moving each slider to 0, 30, or 60 frames. This is the equivalent of not seeing the pose at all, seeing it for half a second, or seeing it for a full second.
    3. Evaluate whether the punches look good or bad. Are they jerky or smooth, real or fake, weak or powerful? Note all observations in your lab notebook.


Screenshot of the program Scratch with adjustable frame counts for Ryu's windup, hit and finish animations

Figure 2. In Presentation Mode in Scratch, you can adjust the frame count for each pose using the sliders, and then view the resulting punch by pressing the space bar.



Collecting the Data

Now that you have a general idea about the range of how good or bad a punch can look, depending on the timing of the animation poses, you're ready to collect your detailed data.

  1. Put the frame counts for each pose at these starting settings:
    1. Windup Frame Count = 24
    2. Hit Frame Count = 12
    3. Finish Frame Count = 8
  2. Hit the spacebar to view the punch. You'll need to decide how "good" the punch is. Since judging an animation's quality is subjective and qualitative, you'll break up the evaluation into three different 1–10 rating scales to make the assessment more precise and quantitative.
    1. First evaluate the smoothness of the animation on a scale of 1–10, where 1 is very jerky and 10 is very smooth.
    2. Next, evaluate how real the animation looks. Is it the kind of punch you'd expect a professional boxer to throw during a boxing match? Use a 1–10 scale, where 1 is very fake and 10 is very real.
      • If you aren't familiar with boxing, and need some examples of what a fake punch might look like, try these settings for the windup, hit, and finish frames:
        • No windup, goes straight into the punch: 0, 12, 8
        • Punching arm hangs out in the air too long: 24, 40, 8
    3. Lastly, evaluate how powerful the punch appears using a 1–10 scale, where 1 is a punch that looks very lightweight and weak, whereas 10 is a punch that looks very heavy, powerful, and damaging.
    4. Note: You may need to view the punch several times to make your evaluations.
    5. Calculate the overall quality score for the punch by adding together the scores from each of the three rating scales.
      • The worst punch possible would have a quality score of 3.
      • The best punch possible would have a quality score of 30.
    6. In the spreadsheet program, make a data table to keep track of the frame counts for each pose, the score you give the punch on each of the three rating scales, and the overall punch quality score.
  3. Examine how the number of frames for which the windup pose is played affects the quality of the punch.
    1. Increase the windup frame count by 2 and re-evaluate the quality of the punch using the method outlined in step 2. Remember to record your data in the spreadsheet.
    2. Continue to systematically increase the windup frame count by 2 and re-evaluate the punch quality until the frame count is at 60.
    3. Reset the windup frame count to 2 less than its starting value (in the case of the windup pose, the starting value is 24 so it should be reset to 22 frames). Repeat the same quality assessment procedure outlined in step 2.
    4. Continue to systematically decrease the windup frame count by 2 and re-evaluate the quality of the punch until the frame count is at 0.
    5. Note: Do not change the frame counts for either the hit pose or the finish pose during these evaluations.
  4. Reset all of the pose frame counts to their starting positions listed in step 1.
  5. Using the same method outlined above for the windup pose, examine how the number of frames the hit and finish poses are played for affects the quality of the punch. In the end, you should have three sets of data:
    1. One where the windup frame count varies from 0 to 60, while the hit and finish frames remain at 12 and 8, respectively.
    2. A second data set where the hit frame count varies from 0 to 60, while the windup and finish frames remain at 24 and 8, respectively. Start with the hit frame count at 12 and evaluate for higher (up to 60) and then lower than 12 (down to 0) frame counts.
    3. A third data set where the finish frame count varies from 0 to 60, while the windup and hit frames remain at 24 and 12, respectively. Start with the finish frame count at 8 and evaluate for higher (up to 60), and then lower than 8 (down to 0) frame counts.
  6. On two additional days, repeat steps 1–5 so that you have three trials for each data set. By doing each trial on a separate day, you're more likely to have the data capture the range of your true impressions of each punch.

Analyzing the Data

  1. For each of the data sets, calculate the average punch quality score across the three trials, and the standard deviation. The standard deviation is a statistic describing how much variation there is among the different trials; the greater the standard deviation, the larger the differences between the trials. Most spreadsheets, like Microsoft Excel, have a function to calculate standard deviation. Consult the help menu of your spreadsheet program and the references in the Bibliography for more information about standard deviation and how to calculate it.
  2. Make an XY graph for each of the data sets. The frame count for the pose being evaluated should be on the x-axis. The quality scores should be on the y-axis.
    1. On each graph, plot the average quality scores and the standard deviation for those scores.
  3. Use your graphs to answer these questions:
    1. From one trial to the next, was there a lot of variability between your perception of what the punch quality score should be? Was the variability uniform across the three poses? Was the variability uniform across the range of frame counts or did it increase or decrease dramatically at different points?
    2. Are the shapes of the graphs similar or different? What does this tell you about the importance of each pose in the total quality score? Does one pose appear to be more important than the others or are they all equal?
    3. Looking at your graphs, can you pick out what the best frame count for each pose is? Is there a single value or a range for each pose?
    4. Using your data, what are the frame count settings for the best overall punch you can make using the poses you were given?
icon scientific method

Ask an Expert

Do you have specific questions about your science project? Our team of volunteer scientists can help. Our Experts won't do the work for you, but they will make suggestions, offer guidance, and help you troubleshoot.

Global Connections

The United Nations Sustainable Development Goals (UNSDGs) are a blueprint to achieve a better and more sustainable future for all.

This project explores topics key to Industry, Innovation and Infrastructure: Build resilient infrastructure, promote sustainable industrialization and foster innovation.

Variations

  • Judging how good an animation looks is subjective, but just how much variability is there between individuals? Try the experiment above with several of your friends. Is there more variability within a single person's punch quality ratings or between the ratings of several people?
  • How many poses are necessary to portray different actions? Try using Scratch to put together different animation sequences, like running, jumping, throwing a ball, performing a ballet twirl, etc. You can download sprites from the Internet, use your own drawings, or even use photographs of you and your friends in the various poses. What is the minimum number of poses needed to convey the action? Do more poses make the action look better?

Careers

If you like this project, you might enjoy exploring these related careers:

Career Profile
If you've ever watched a cartoon, played a video game, or seen an animated movie, you've seen the work of multimedia artists and animators. People in these careers use computers to create the series of pictures that form the animated images or special effects seen in movies, television programs, and computer games. Read more
Career Profile
Computers are essential tools in the modern world, handling everything from traffic control, car welding, movie animation, shipping, aircraft design, and social networking to book publishing, business management, music mixing, health care, agriculture, and online shopping. Computer programmers are the people who write the instructions that tell computers what to do. Read more

News Feed on This Topic

 
, ,

Cite This Page

General citation information is provided here. Be sure to check the formatting, including capitalization, for the method you are using and update your citation, as needed.

MLA Style

Science Buddies Staff. "Power Play: How Does Animation Timing Affect Your Perception of Game Action?" Science Buddies, 23 Aug. 2023, https://www.sciencebuddies.org/science-fair-projects/project-ideas/Games_p024/video-computer-games/timing-character-animations. Accessed 19 Mar. 2024.

APA Style

Science Buddies Staff. (2023, August 23). Power Play: How Does Animation Timing Affect Your Perception of Game Action? Retrieved from https://www.sciencebuddies.org/science-fair-projects/project-ideas/Games_p024/video-computer-games/timing-character-animations


Last edit date: 2023-08-23
Top
We use cookies and those of third party providers to deliver the best possible web experience and to compile statistics.
By continuing and using the site, including the landing page, you agree to our Privacy Policy and Terms of Use.
OK, got it
Free science fair projects.