Frame Rate and Timing for Animation, Done Properly
Learn how to choose the right frame rate, when to animate on ones or twos, how to avoid late conversions, and how to deliver for film, broadcast and web.
Getting frame rate and timing for animation right means making two decisions early and sticking to them: the number of frames per second the piece is produced and delivered at, and how many of those frames each drawing, pose or keyframe occupies. The first is a technical agreement with the edit, the broadcaster or the platform. The second is a creative choice about how the motion feels. They are tied together, because a hold of two frames means something different at 24 frames per second than it does at 60.
This matters to anyone commissioning or producing animation: marketing teams dropping an animated segment into a live-action edit, in-house designers building interface motion, agencies delivering one spot to television and social channels at once, and animators who want their spacing to survive the trip to the final export. When the rate is wrong, the symptoms are familiar. Motion stutters on pans, text judders on scrolls, frames are dropped or duplicated, audio drifts out of sync over a long piece, and a carefully timed gag lands a beat late.
The guide below is organized around the questions people actually ask when they run into these problems, from the basic choice of rate to the harder cases of fractional rates, conversions and multi-platform delivery. Each answer starts with the short version and then gives the detail you need to act on it.
What frame rate should an animation be produced at?
Produce the animation at the frame rate of the edit or platform it will finish in, and confirm that rate in writing before a single key is set. In practice, that usually means 24 fps (or 23.976) for film-style and cinematic work, 25 fps for projects finishing in PAL regions such as most of Europe, 29.97 or 30 fps for projects finishing in NTSC regions such as North America, and 60 fps for screen recordings and fast interface motion.
The reason to decide early is that frame rate is not a setting you can change cleanly at the end. Every keyframe, every hold and every piece of motion blur is calculated against a specific time base. Change the time base and the animation software has to either invent frames, throw frames away or stretch the whole piece in time. None of those options preserves the timing the animator chose.
Who decides the rate?
Whoever owns the final timeline decides. If the animation is a segment inside a documentary, a corporate film or a commercial, the editor's sequence settings are the authority, and the animator matches them. If the animation is the whole deliverable, the destination decides: a broadcaster's technical specification, a cinema deliverables list, or the platform where it will play. Broadcast technical recommendations, such as those published by the European Broadcasting Union's technical department, exist precisely so that producers and channels agree on these parameters before production rather than arguing about them at quality control.
What to ask for at kickoff
Ask for the exact sequence settings, not a rounded description. "Thirty frames" can mean 30 or 29.97; "twenty-four" can mean 24 or 23.976. Ask for the frame size, the pixel aspect ratio, whether the timeline is progressive or interlaced, and whether timecode is drop-frame or non-drop-frame. A screenshot of the editor's sequence settings panel removes all ambiguity, and it takes the editor thirty seconds. If you are scoping a new piece, put the frame rate in the statement of work alongside duration and style; our guide to scoping animation projects covers the other decisions that belong in the same document.
What is the difference between frame rate and timing?
Frame rate is how many images the viewer sees per second; timing is how many of those frames a movement takes and how the frames are distributed across it. Frame rate is a container. Timing is what the animator puts inside it.
A useful way to think about it is in durations rather than counts. At 24 fps, each frame lasts about 41.7 milliseconds. At 25 fps it lasts exactly 40 milliseconds, at 30 fps about 33.3 milliseconds, and at 60 fps about 16.7 milliseconds. A head turn timed at 8 frames takes a third of a second at 24 fps but only about 0.13 seconds at 60 fps. If a scene is timed in frames and then played back at a different rate, every action speeds up or slows down, and the relationship to sound, dialogue and music breaks.
Timing versus spacing
Animators separate timing (how many frames an action occupies) from spacing (how far the subject moves between each of those frames). Two actions can both take 12 frames and feel completely different: one with even spacing that looks mechanical, and one with frames bunched at the start and end that eases in and out. Spacing is what easing curves in After Effects, Blender or Cinema 4D control, and what a hand-drawn animator plans on a timing chart. If you want the traditional notation for this, our article on animation timing charts walks through how charts encode both.
Why the two decisions are linked
The frame rate sets the smallest unit of time an animator can work with. At 24 fps the finest adjustment is about 42 milliseconds; at 60 fps it is about 17. That finer grid is why interface designers like high frame rates for small, quick transitions, and it is also why a 60 fps project can feel strangely smooth and weightless if the animator times it the way they would time 24 fps work. Changing the container changes what the contents feel like.
When should you animate on ones, twos or threes?
Animate on ones (a new image every frame) for fast action, camera moves and anything that must look fluid; on twos (each drawing held for two frames) for most hand-drawn character work; and on threes or longer holds only as a deliberate stylistic choice. Animating on twos is a long-standing hand-drawn convention: at 24 fps it gives 12 new drawings per second, which reads as smooth for most character acting while halving the drawing count.
The choice is not only about budget. Twos give motion a slightly crisper, more graphic quality that many audiences associate with classic hand-drawn work. Ones feel more fluid and are almost always needed for fast motion, because a fast action on twos has large gaps between drawings and starts to strobe. Many productions mix the two within a single shot: a character's body on twos while a quick hand gesture or a camera pan runs on ones.
| Hold pattern | New images per second at 24 fps | At 25 fps | At 30 fps | Typical use |
|---|---|---|---|---|
| Ones | 24 | 25 | 30 | Fast action, camera pans, liquids, 3D and most motion graphics |
| Twos | 12 | 12.5 (one frame held for three each second) | 15 | Hand-drawn character acting, cut-out and stylized 2D |
| Threes | 8 | About 8.3 | 10 | Limited animation, deliberately choppy stylization, background cycles |
| Fours and longer | 6 or fewer | About 6 | 7.5 | Stop-motion looks, stylized "stepped" motion, anticipation holds |
The awkward arithmetic of twos at 25 and 30 fps
Twos divide neatly into 24, which is one reason the convention grew up around film. At 25 fps, a pattern of twos leaves one odd frame every second, so animators either hold one drawing for three frames each second or accept a slightly irregular rhythm. At 30 fps, twos give 15 drawings per second, which looks a little smoother than 12 and costs 25 percent more drawings for the same duration. If a studio quotes on a "per second of animation" basis, the frame rate changes the drawing count and therefore the effort. Our guide to frame-by-frame animation covers how that effort is planned in practice.
Myth: Animating on twos is a shortcut that makes animation look cheap.
Reality: Twos are a style and a craft convention with a long history in hand-drawn work. What looks cheap is inconsistent holding: drawings held for random lengths to save time, or fast actions left on twos where they need ones. Use holds deliberately, shot by shot, and document the choice so every animator on the project follows it.
Holds in 3D and motion graphics
Software-driven animation defaults to ones, because the computer interpolates every frame. Stepped or "on twos" looks in 3D are created deliberately, often with a posterize-time effect or a stepped interpolation mode, to imitate a hand-made feel. If you do this, apply the step before motion blur is calculated, or you get smeared blur on frames that are supposed to be crisp holds. Treat the stepped look as a style decision recorded in the style frame sign-off, not a render optimization.
Why do 23.976 and 29.97 matter, and how do they differ from 24 and 30?
They matter because an animation rendered at 24 fps and dropped into a 23.976 fps timeline, or 30 into 29.97, does not match exactly: the difference is about 0.1 percent, which is invisible on one shot but produces repeated or dropped frames, audio drift and timecode mismatches over a full piece. The fractional rates exist because of how color television was engineered in NTSC regions, and they persist in much of the video world today. Standards bodies such as SMPTE define these rates and the timecode conventions that go with them.
The exact values are 24000/1001 (about 23.976) and 30000/1001 (about 29.97). Camera menus, editing software and delivery specs often round them in conversation to "24" and "30", which is where the trouble starts. A client who says "thirty" may mean either. The only safe answer is to ask for the exact number, or to look at the sequence settings yourself.
What the 0.1 percent does over time
Over one minute, a 0.1 percent speed difference amounts to about 0.06 seconds, roughly one and a half frames. Over an hour it is about 3.6 seconds. For a short animated insert that is conformed shot by shot, the editing software will usually resample and either duplicate or drop an occasional frame to fit, which shows up as a small hitch on smooth pans. For a long piece with a continuous music track or voiceover recorded to picture, the mismatch shows up as audio that gradually slides out of sync.
Drop-frame timecode is not dropping frames
Drop-frame timecode, used with 29.97 fps, skips certain frame numbers (frames 00 and 01 at the start of every minute, except every tenth minute) so that the timecode clock stays aligned with real elapsed time. No images are removed. Non-drop-frame timecode numbers every frame consecutively and gradually drifts away from wall-clock time. Both are valid; they just need to match between the animator's renders, the edit and the delivery spec, or timecode-based handoffs and reviews point at the wrong frames.
Insight: The fractional-rate problem is almost never a rendering problem. It is a communication problem that becomes a rendering problem later. Agree on the exact number (23.976 or 24, 29.97 or 30) and the timecode mode in writing, set every project file and render preset to it, and check the first test render's properties in the edit before approving any further animation.
- Name render presets with the exact rate, for example "1080p 23.976 ProRes", so nobody guesses.
- Check audio sample rate (usually 48 kHz for video) at the same time, since audio and picture drift together.
- Re-check after any software update or template change, as defaults can silently revert.
What goes wrong when you convert frame rates at the end?
Converting at the end forces software to invent, discard or stretch frames, and every method damages the timing the animator chose. That is why converting frame rates as the last step is one of the most common and most avoidable mistakes in animation delivery.
There are four broad ways to change a frame rate, and each has a characteristic failure:
- Frame duplication and dropping. The software repeats or skips frames to fit the new rate. Going from 24 to 30, one frame in every four is shown twice, which creates a regular stutter on pans and camera moves. Going from 30 to 25, one frame in six is discarded, which can drop a key pose or a single-frame accent.
- Frame blending. The software mixes neighboring frames to create in-between frames. This hides stutter but produces ghosting: double outlines on hand-drawn lines, soft text and muddy edges on crisp graphics.
- Optical flow or motion-estimated interpolation. The software analyzes motion and synthesizes new frames. This can look impressively smooth on live action, but it tends to fail on flat-color animation, overlapping shapes, text and anything with holds, producing warping and melted edges.
- Speed change (conform). Every frame is kept and the playback speed changes, for example playing 24 fps material at 25 fps, which makes it about 4 percent faster and shorter. Picture is untouched, but duration changes and audio must be sped up too, which raises pitch unless it is corrected.
Pulldown for 24 into 29.97
Traditional broadcast workflows move 23.976 fps material into 29.97 fps video with 2:3 pulldown, spreading four film frames across five video frames using interlaced fields. It is a well-understood method, but it introduces a characteristic cadence that some viewers notice on slow pans, and it complicates later editing unless the pulldown is removed cleanly. For animation, the cleaner path is almost always to produce at the rate the delivery needs, or to deliver a progressive file at the native rate and let the broadcaster's workflow handle any required conversion under their own specification.
Mixing rates inside one sequence
A related mistake is building a sequence from animation made at different rates: a logo sting built at 30, a character segment at 24, and screen captures at 60, all placed into a 25 fps timeline. Each clip gets converted by a different method, and the result has inconsistent motion from shot to shot. If assets arrive at mixed rates, conform them deliberately one by one, choosing the method per clip, and review each at full speed before locking the edit.
Is a higher frame rate always better for animation?
No. A higher frame rate makes motion smoother and gives finer timing control, but it also changes the character of the motion, increases render and storage costs, and can make stylized or cinematic work look like video rather than animation. Assuming higher frame rates always look better is one of the mistakes to avoid.
Sixty frames per second genuinely suits screen recordings, software demos, fast interface transitions and gameplay-style content, where the viewer is tracking small, quick movements and any stutter reads as a performance problem. For character animation, explainers with a hand-made feel, and anything meant to sit inside a cinematic edit, 24 or 25 usually looks more appropriate and is cheaper to produce.
Pros
- Smoother tracking of fast motion, scrolling text and interface elements
- Finer timing resolution: about 17 ms per frame instead of about 42 ms
- Less visible judder on horizontal pans and scrolling tickers
- Matches the native capture rate of many screen recordings and devices
Cons
- Two to two and a half times as many frames to render, review and store
- Hand-drawn work on ones at 60 fps multiplies drawing effort sharply
- Can look "video-like" and lose the weight of cinematic or character work
- Must be converted down for 24, 25 or 30 fps edits, reintroducing conversion problems
How to decide
Ask three questions. Where will this play, and at what rate does that destination run? What kind of motion dominates: fast, small, tracked movement (favor higher rates) or acting, weight and stylization (favor 24 or 25)? And will this ever need to be cut into a lower-rate edit? If the answer to the last question is yes, producing at 60 and converting later is usually worse than producing at the edit rate from the start. For motion that lives only on websites and apps, our piece on frame rates for web animation goes deeper into browser-rendered and video-based options.
How should motion blur relate to the frame rate?
Motion blur should represent the length of time each frame's "exposure" covers, so it has to be calculated at the delivery frame rate; blur set up for one rate looks wrong at another. Motion blur settings that do not match the frame rate are a common and easily fixed mistake.
Most animation and compositing tools borrow the film concept of shutter angle. A 180-degree shutter means each frame shows motion blur covering half the frame's duration, which at 24 fps is about 1/48 of a second. This is the look audiences associate with film. A 360-degree shutter smears across the whole frame duration and looks soft and dreamy; a small angle such as 45 or 90 degrees gives crisp, staccato motion associated with action sequences.
Where mismatches come from
- Rendering at one rate and conforming to another. Blur baked in at 60 fps is only about 1/120 of a second long at a 180-degree shutter. Played in a 24 fps edit with frames dropped, motion looks strobed, because each frame's blur is too short for the gaps between frames.
- Adding blur after a stepped hold. If an animation is held on twos and blur is calculated across the hold, the held frames show blur for motion that is not happening. Blur should come from the movement between drawings, not across held frames.
- Different blur settings in different tools. A 3D render with a 180-degree shutter composited with 2D elements at a 360-degree setting produces layers that move with visibly different textures.
A practical default
Unless there is a stylistic reason to do otherwise, use a 180-degree shutter equivalent across every tool in the pipeline, calculated at the delivery rate, and keep motion blur samples high enough that fast movements do not show banding. For work handed between studios or departments, write the shutter angle and sample count into the technical notes that accompany the files; our guide to delivering animation source files shows where that information belongs.
What frame rate should web loops and social uploads use?
Use the frame rate the animation was produced at, and keep web loops at the same rate as the source so the cycle closes cleanly. For uploads, YouTube's help documentation recommends uploading at the same frame rate the content was recorded at, rather than converting it first, and most other platforms behave best under the same approach.
Web loops, such as hero animations, background videos and product demos on a landing page, deserve special care because any timing error repeats every few seconds. A loop authored at 30 fps and exported at 25 will either drop frames or shift the loop point, producing a visible hiccup at the seam. The fix is simple: author the loop at the rate it will be encoded at, make the loop length an exact number of frames, and check that the first and last frames join without a repeated or missing pose.
Getting loop length right
Choose loop durations that divide evenly into the frame rate and into any held cycles inside the loop. A 4-second loop at 30 fps is 120 frames; if a walk cycle inside it runs 24 frames on ones, it repeats exactly five times. If you change the loop to 25 fps, it becomes 100 frames, and the 24-frame cycle no longer divides into it, so the seam breaks. Plan cycles and loop lengths together, the same way you plan them on a storyboard; our practical guide to storyboarding for animation covers how to annotate timing at the board stage.
Social platforms and variable frame rates
Screen recordings and some phone footage use variable frame rates, which can confuse animation and editing software. Before building animation over this material, convert it to a constant frame rate that matches the project, and do it once at ingest, not at export. Deliver social cutdowns at the project's native rate, at the aspect ratios each platform expects, and let the platform's own processing handle the rest.
How do you deliver one animation for film, broadcast and web?
Pick a single master rate based on the most demanding destination, animate and render once at that rate, and create each alternate version with the one conversion method best suited to that destination, reviewed at full speed. Delivering one animation for film, broadcast and web is also one of the clearest signals that it is time to bring in help from specialists who handle conversions regularly.
Worked example (illustrative)
The following example is illustrative, not a real client project. A company commissions a 45-second hand-drawn 2D brand animation. It will play as a pre-show spot in cinemas, on broadcast television in a PAL region, and on the company's website and YouTube channel.
| Destination | Required rate | Approach | Frames for 45 seconds | Duration after delivery |
|---|---|---|---|---|
| Cinema master | 24 fps | Native: animated and rendered at 24 | 1,080 | 45.0 seconds |
| PAL broadcast | 25 fps | Speed conform: same frames played at 25, audio pitch-corrected | 1,080 | 43.2 seconds |
| Web and YouTube | 24 fps | Native: upload the master's rate as recommended | 1,080 | 45.0 seconds |
At 24 fps on twos, the 1,080 frames need about 540 drawings, with fast moments on ones pushing the real number somewhat higher. The team chooses 24 fps as the master because the cinema version is the most demanding and because twos divide cleanly into it.
For broadcast, the choice is between speed conforming and a true frame rate conversion. Conforming plays every frame 4 percent faster, so the spot runs about 43.2 seconds instead of 45. The picture is untouched, with no dropped drawings or blended frames, but audio must be sped up by the same 4 percent and pitch-corrected, and the broadcaster's slot length must be checked, since a 45-second slot now needs 1.8 seconds of extra material or a revised edit. The alternative, duplicating one frame each second to stretch 24 to 25 while keeping duration, introduces a visible hitch once per second on pans, which the team rejects.
In this illustrative case, the better answer turns out to be neither conversion: because the broadcast slot is exactly 45 seconds and the music is custom, the studio re-renders the broadcast version natively at 25 fps from the project files. The animators retime the three shots with camera pans on ones and accept the odd 25th frame in the twos sections. That costs extra time on a handful of shots, but it produces the cleanest result for the destination with the strictest technical checks. The decision is only possible because the project files were organized to be retimed; a flattened 24 fps render would have left conversion as the only option.
What to deliver
- A mezzanine master at the native rate in a high-quality codec, clearly labeled with the frame rate in the filename.
- Destination-specific versions, each labeled with rate, resolution, timecode mode and audio format.
- Technical notes listing the conversion method used for each version and who approved it.
- Project files and render presets archived so a future version can be re-rendered rather than converted; our guide to archiving animation projects covers how to keep them usable.
How do you test timing before it is too late to fix?
Render short test clips at the delivery rate and watch them inside the real edit, on the real playback path, at full speed, before any shot is approved. Timeline previews in animation software often skip frames, cache at lower resolution or play back at whatever rate the machine can manage, so they are not a reliable judge of timing.
Testing in context catches problems that no settings panel shows: a rate mismatch that the editor's software silently converts, motion blur that looks wrong against live-action footage, a pan that strobes on a particular display, or a hold that feels long once music is added. It also gives reviewers the version of the animation that audiences will see.
- The editor's exact sequence settings (rate, frame size, timecode mode) are recorded in the project brief.
- Every animation project file, composition and render preset uses the same rate.
- The hold pattern (ones, twos, mixed) is documented per shot or per style, not left to individual animators.
- Motion blur is set to an agreed shutter angle and calculated at the delivery rate.
- A 5- to 10-second test clip with the fastest motion in the piece has been rendered and dropped into the real edit.
- The test clip has been watched at full speed on the target display, not scrubbed.
- Clip properties in the edit confirm the rate matches, with no automatic conversion applied.
- Audio is checked for sync at the end of the longest continuous section.
- Web loops have been played through several cycles to check the seam.
Reviewing timing with clients
Client reviews are where timing notes often go wrong, because feedback such as "make it snappier" or "slow that down" is hard to translate into frames. Review from files at the delivery rate, use a review tool that shows frame numbers or timecode, and ask reviewers to note the exact frame. If a note concerns timing, respond with a retimed test clip rather than a description. Our guide to reviewing animation with clients covers review structure and tools in more detail.
What to look for on the test clip
Watch horizontal pans and scrolling text first; they reveal stutter and judder fastest. Then watch the quickest action in the piece for strobing, which suggests either a hold that is too long for the speed of motion or motion blur that is too short. Finally, watch held poses for unexpected blur or tiny jumps, which usually point to a conversion step somewhere in the chain.
When should you bring in outside help with frame rate and timing?
Bring in help when animation stutters in the final edit and the cause is not obvious, or when one animation must be delivered for film, broadcast and web at once. Both situations reward experience with conversion methods, delivery specifications and pipeline setup more than they reward effort.
A stutter that survives an obvious fix, such as matching the sequence settings, usually has a less obvious cause: a nested composition at the wrong rate, a pre-rendered element from an earlier version, variable-frame-rate source footage, an automatic conversion in the editing software, or a codec setting at export. Tracking these down is quicker for someone who has seen them before. Multi-destination delivery involves trade-offs, like the conform-or-re-render decision in the example above, that are cheapest to make at the start of production, not after the master is finished.
What a good partner will ask
- Where will the piece finish, and what are the exact technical specifications for each destination?
- Is this a segment in a larger edit, and if so, can they see the editor's sequence settings?
- What hold style suits the brief, and where will the piece need ones?
- Will the project files be delivered and archived so versions can be re-rendered later?
If they do not raise these questions at kickoff, treat that as a warning sign. Our guide to choosing an animation studio lists more questions worth asking, and the MediaScaleUp team produces 2D animated videos with frame rate, holds and delivery versions agreed in writing before production begins.
Verdict Frame rate and timing are cheap to get right at the start and expensive to fix at the end. Confirm the exact rate of the edit or destination, produce and render at that rate throughout, use holds as a deliberate style, set motion blur at the delivery rate, and test in the real edit before approving shots. Treat higher frame rates as a tool for specific kinds of motion, not an upgrade, and when one animation has to serve film, broadcast and web, plan the conversions before the first frame is animated.
Where this comes from
- SMPTE — Frame rate standards
- European Broadcasting Union — Technical recommendations for production
- YouTube Help — Recommended upload encoding settings
The figures and practices above come from the sources listed.
Working on something like this?
We take on Motion Graphics & Animation work for teams who want it done once, properly. Tell us what you are building and we will tell you honestly whether we are the right studio for it. Start a project.
Where to go next
Spotted something wrong? Report an error on this page. We correct on the page and say what changed.