.avif)
Freevisuals
A bounce effect is one of the most requested motion graphics techniques among newer After Effects users, and also one of the most commonly built the hard way, through dozens of manually placed keyframes trying to approximate a physical bounce that never quite feels convincing. Expressions solve this considerably more elegantly, generating a genuinely physical seeming bounce from a small amount of code rather than painstaking manual keyframing. This guide walks through three genuinely useful bounce expression variations and when each one actually fits a specific animation need.
Bounce expressions in After Effects use a small amount of JavaScript based code to simulate a naturally decaying, physical bounce automatically, removing the need to manually keyframe an increasingly subtle series of oscillations by hand. This post covers three genuinely distinct bounce approaches, a simple overshoot bounce for a single settling motion, a repeating decay bounce for multiple diminishing oscillations, and a velocity based bounce that reacts specifically to how an object was already moving before the expression takes over. It also includes a genuine video walkthrough, answers to frequently asked questions about applying and adjusting these expressions, and practical guidance on choosing the right variation for a specific animation.
By Jack Wright, Founder, Freevisuals. Updated 2026.
A convincing bounce involves a specific, physically informed pattern, an initial overshoot past the resting position, followed by a series of progressively smaller oscillations that gradually settle to a full stop. Recreating this pattern manually with keyframes requires placing and adjusting a genuinely large number of individual points, each with its own precisely tuned timing and easing, and even careful manual work often still reads as slightly artificial compared to a properly built expression driven bounce.
Expressions solve this by calculating the entire decaying oscillation pattern mathematically from just a few input values, elasticity, amplitude, and frequency among the most common, letting you adjust the overall character of a bounce by tweaking simple numbers rather than repositioning dozens of individual keyframes by hand. This also makes bounce effects considerably easier to adjust after the fact, changing a single value instantly updates the entire motion rather than requiring you to manually readjust every individual keyframe throughout the animation.
The most basic bounce variation applies to a layer with a single existing keyframed movement already in place, adding an automatic overshoot and settle on top of that base animation once it reaches its final position. This kind of expression typically references the layer's existing keyframe timing directly, calculating additional motion that continues briefly past the final keyframed value before settling back to rest, simulating the natural momentum an object would carry past its intended stopping point before gravity or friction brings it fully to rest.
This variation works particularly well for UI style animations, a button or graphic element settling into its final position, or any motion where a single clean overshoot and settle communicates a sense of physical weight without needing multiple visible bounces. It tends to read as more subtle and professional than a more elaborate multi bounce effect, making it a genuinely versatile default choice for general purpose motion graphics work where a bounce is desired but should not dominate the overall animation.
Before applying any bounce expression, it genuinely helps to understand how expressions work at a basic level first. Watch Learn After Effects Expressions For Beginners for a foundational walkthrough of how expressions attach to properties and respond to changing values. This is worth watching specifically because bounce expressions build directly on these fundamentals, seeing how a simple expression like wiggle behaves in real time gives you the underlying intuition needed to actually understand what a more complex bounce expression is doing, rather than just copying code without genuinely grasping why it produces the motion it does.
The second variation produces a more elaborate, visibly repeating bounce, multiple distinct oscillations that each grow progressively smaller before the motion finally comes to rest. This variation typically incorporates a decay factor specifically, a value that reduces the amplitude of each successive oscillation by a consistent percentage, mathematically recreating the diminishing bounce pattern a real physical object displays as energy gradually dissipates through each successive impact.
This more elaborate bounce suits situations where the bouncing motion itself is meant to be a genuinely noticeable, central part of the animation rather than a subtle finishing touch, a cartoon style character animation, a playful logo reveal, or any context where an exaggerated, clearly visible bounce reinforces a specific energetic or lighthearted tone. Adjusting the decay factor directly controls how many visible bounces occur before the motion settles, a higher decay value producing fewer, more sharply diminishing bounces, and a lower decay value producing more numerous, more gradually diminishing ones.
The third and most sophisticated variation calculates its bounce behavior based specifically on how fast a layer was already moving at the moment a keyframe transition ends, rather than applying a fixed, predetermined bounce regardless of the underlying motion's actual speed. This produces genuinely more physically accurate results, since a real object's bounce behavior naturally depends on how much momentum it actually carried into the moment of impact, a fast moving object should bounce more dramatically than a slow moving one reaching the same final position.
This velocity based approach requires slightly more sophisticated expression code than the previous two variations, typically referencing a property's velocity at a specific point in time directly within the expression's calculation, but the resulting motion reads as noticeably more convincing for animations where the underlying movement speed genuinely varies across different instances, a reusable bounce effect applied across multiple layers moving at different speeds, for instance, where a single fixed bounce amount would look mismatched applied uniformly across all of them.
Selecting between these three variations comes down largely to how prominent and physically accurate you need the bounce effect to actually be within your specific project. For subtle UI polish or a single clean settle, the simple overshoot variation typically provides everything needed without unnecessary complexity. For clearly visible, stylized bounce effects meant to draw genuine attention, the repeating decay variation offers more dramatic, readily noticeable motion. For situations demanding genuine physical accuracy, particularly reusable effects applied across layers with varying underlying speeds, the velocity based variation provides the most convincing, adaptable result despite requiring more setup effort upfront.
It is worth resisting the temptation to always reach for the most sophisticated variation by default, since the added complexity of the velocity based approach is not always necessary, and a simpler expression that is easier to understand, adjust, and maintain later often serves a project better than an unnecessarily elaborate one applied purely because it is technically more advanced.
A frequent mistake involves applying a bounce expression to a property that does not have a clear, stable resting value for the bounce to settle toward, producing motion that never fully comes to rest or behaves unpredictably. Ensuring your underlying keyframed animation reaches a clear, stable final value before the expression's bounce behavior takes over generally resolves this. Another common issue involves setting elasticity or decay values so extreme that the resulting bounce either barely registers as a bounce at all, or oscillates so dramatically that it reads as visually chaotic rather than physically convincing.
Testing bounce expressions with moderate initial values before pushing toward more extreme settings helps build an intuitive sense of how each specific parameter affects the resulting motion, making it considerably easier to dial in a specific desired feel once you have a working baseline to adjust from rather than guessing at extreme values from the very first attempt.
Beyond the core elasticity and decay parameters, timing plays a genuinely significant role in how convincing a bounce effect ultimately feels within the context of a specific project. A bounce that resolves too quickly can feel abrupt and easily missed, while one that lingers too long can start to feel indulgent or slow down an otherwise fast paced sequence. Matching bounce duration to the overall energy and pacing of the surrounding content, a snappier, shorter bounce for quick, high energy social content, and a more drawn out, gradual bounce for slower, more deliberate storytelling, helps the effect feel like a genuine, considered part of the project rather than a generic default applied without regard for context.
This kind of contextual calibration is worth revisiting specifically whenever reusing a bounce expression across genuinely different projects, since a timing setting that felt perfectly balanced in one specific context may feel noticeably mismatched once applied without adjustment to a project with a meaningfully different overall pace and tone.
Bounce effects rarely exist in complete isolation within a finished animation, and understanding how they interact with other motion techniques helps produce more cohesive, considered results. Pairing a bounce expression with a subtle secondary rotation, particularly for organic or character based animation, can add an additional layer of physical believability beyond what the bounce alone provides. Layering a bounce on top of an already eased primary movement, rather than applying it to a purely linear base animation, tends to produce a more naturally integrated result, since the eased approach into the bounce's starting point already establishes a sense of gradual, physical motion the bounce itself can then build on convincingly.
For character animation specifically, combining bounce expressions with squash and stretch techniques, briefly compressing an object's shape at the moment of impact before it springs back to its normal proportions, can add considerable additional visual weight and energy beyond what a bounce expression driving only position or scale alone would achieve on its own. This kind of layered, multi technique approach represents a genuine step beyond a single isolated bounce expression, drawing on the broader vocabulary of classical animation principles to build motion that reads as considerably more alive and physically grounded.
Since bounce expressions involve genuine code, syntax errors are a common early obstacle for editors newer to writing or modifying expressions directly. After Effects typically flags an expression containing an error with a distinct warning indicator directly in the Timeline panel, along with a specific error message describing what went wrong, missing punctuation, an incorrectly referenced property name, or a mismatched set of parentheses are among the most frequent culprits behind an otherwise reasonable looking expression failing to function correctly.
When troubleshooting a broken bounce expression specifically, working through the code systematically from the beginning, checking that every opening parenthesis has a corresponding closing one, and that every property reference exactly matches the actual name of the property being referenced, resolves the majority of these errors relatively quickly. For genuinely persistent issues, temporarily simplifying the expression down to a minimal working version and then gradually reintroducing complexity piece by piece helps isolate exactly which specific part of a longer expression is actually causing the problem, rather than trying to debug an entire complex expression as a single, undifferentiated block.
Well built bounce effects pair naturally with the kind of polished, considered motion work our own After Effects templates library is built around, giving you a strong foundation to layer expression driven refinements on top of. Our free LUT library is also worth pairing with any motion graphics project needing a consistent color treatment across animated elements. For premium templates and additional creative assets, Motion Array and Envato are both worth browsing, and for music to pair with a lively, energetic bounce driven animation, Artlist and Epidemic Sound are both genuinely strong options.
No, bounce expressions typically build on top of an existing keyframed base animation, adding the automatic overshoot and settle behavior once that base motion reaches its final value, rather than replacing keyframes as the primary way of establishing an animation's core movement.
The simple overshoot variation is generally the most approachable starting point, since it involves fewer adjustable parameters and produces a subtle, broadly useful result without requiring a deep understanding of velocity calculations or decay mathematics.
Yes, expressions can generally be copied and pasted across multiple layers, though results may need individual adjustment per layer depending on each one's specific underlying motion, particularly for the velocity based variation where the bounce behavior is meant to respond to each layer's own specific speed.
This usually indicates the underlying decay or elasticity values are set too high relative to the expression's other parameters, or that the base animation the bounce is built on top of does not reach a sufficiently stable final resting value for the expression to settle toward.
No, though both are commonly used together. A wiggle expression produces continuous, randomized motion without a specific settling point, while a bounce expression is specifically built to simulate a decaying oscillation that eventually comes to a genuine, stable rest.
Bounce expressions turn what would otherwise be tedious, imprecise manual keyframing into a fast, easily adjustable, physically convincing effect, and understanding the genuine differences between a simple overshoot, a repeating decay, and a velocity based approach gives you real flexibility in matching the specific bounce to whatever a particular animation actually calls for. Starting with the simplest variation that achieves your intended result, rather than defaulting to the most elaborate option available, tends to produce cleaner, more maintainable projects while still delivering genuinely convincing, natural feeling motion.
As with most expression driven techniques, genuine comfort comes through repeated use across real projects rather than through memorizing the underlying code alone, and revisiting these three variations across a range of different animation contexts is the fastest path toward developing real intuition for which specific bounce approach a given project genuinely calls for.
Now, if you're aiming to add a bounce to any layer, the bounce expression is your go-to. At first glance, it might seem intricate, but there's no need to be daunted by its complexity. Here's a breakdown of what you need to know:
It's essential to note that while the bounce expression is a remarkable tool, it's not a replacement for understanding the fundamentals of creating a bounce. It's perfect for layers that require a simple bounce, but mastering the art of animation goes beyond this.
Bounce expressions are widely used for animating text in creative ways:
Example Use: A title sequence where each word “lands” with a slight bounce as though affected by gravity.
In interface animations, bounce expressions mimic real-world physics to make interactions feel more intuitive and enjoyable:
Example Use: In a mobile app prototype, a tap on an icon causes it to bounce and scale slightly before returning to normal.
For logos, bounce effects can make animations look polished and memorable:
Example Use: A company’s circular logo bounces as it “drops” into view during the opening of a promotional video.
Objects like balls, boxes, or abstract shapes frequently use bounce expressions to simulate real-world physics:
Example Use: A bouncing ball animation to demonstrate kinetic energy in an educational video.
Bounce effects can make data animations more engaging:
Example Use: In a financial infographic, bars in a bar chart bounce slightly as they grow to their final heights.
For animating 2D or 3D characters, bounce expressions help simulate:
Example Use: A cartoon character jumping with a subtle bounce upon landing to add believability.
Bounce expressions help transitions feel more fluid:
Example Use: A transition between video sections where sliding panels bounce slightly upon arriving in their positions.
Example Use: A coin in a game design demo bounces up and down after being collected.
Here’s a common bounce expression for Position or Scale properties:
amp = 50; // Amplitude of the bounce
freq = 2; // Frequency of the bounce
decay = 3; // How quickly the bounce stops
n = 0;
if (numKeys > 0) {
n = nearestKey(time).index;
if (key(n).time > time) {
n--;
}
}
if (n > 0) {
t = time - key(n).time;
v = velocityAtTime(key(n).time - thisComp.frameDuration / 10);
value + v * amp * Math.sin(freq * t * Math.PI * 2) / Math.exp(decay * t);
} else {
value;
}
.avif)
.avif)
.avif)
.avif)
amp: Controls how high or large the bounce is.freq: Determines how fast the bounce occurs.decay: Sets how quickly the bounce effect fades out.
