How to Make Bouncing Ball Videos in Your Browser (60-Second Tutorial)

A bouncing ball video is, at its core, three things stacked: a physics simulation people find pleasant to watch, an audio track that punctuates each collision, and a vertical 1080×1920 MP4 you can drop straight into TikTok. None of those steps require a real video editor. This guide walks through the whole flow inside BounceArena, from the moment you open the editor to the moment a finished MP4 lands in your downloads folder.

The fastest way to learn the tool is to ship one bad video. Don’t worry about going viral on the first export — worry about getting all the way through the loop once. The rest is iteration.

Step 1 — Pick a mode that fits your idea

The editor exposes eight simulation modes, each with its own physics rules and visual signature. Before you touch a single slider, pick the one that matches the shape of the video you want.

• Classic — a single ball bouncing inside a slowly rotating polygon. The default for “satisfying loop” content. Good first export.
• Accumulation — balls spawn and accumulate on each collision until the container shatters. Builds tension; works exceptionally well with rising music.
• Versus — two or more contestants race or fight; last one standing wins. Ideal for prediction comments and audience polls. (Also feeds the most engagement, in our experience.)
• Destruction — the ball chips away at destructible blocks. Reads as a mini-game; good for retention because viewers wait for the wall to fall.
• Drawing — the ball traces patterns as it moves, leaving permanent ink behind.
• Trail Expansion — the ball’s trail grows over time and reshapes the play space.
• Spirale — a circular variant where the ball bounces along an inward spiral.
• Escape Holes — the container has rotating gaps; the win condition is “ball escapes.”

If you’re brand new, start with Classic or Accumulation. Both are forgiving, both look great with default settings, and both have an obvious climax that reads on a phone screen.

Step 2 — Set the duration first, not last

Most beginners pick a mode, then iterate on physics, then realize the climax lands at 47 seconds and have to redo everything. Skip that loop.

Decide your target duration before you tune anything else. The two durations that matter:

• 15 seconds — the free tier ceiling, also the floor for short-form algorithmic boost on Reels.
• 60 seconds — the TikTok Creator Rewards eligibility threshold. Below 60, your video isn’t paid for views, full stop. If monetization is the goal, every export ships at 60 seconds.

Set the duration in the sidebar, then start tuning physics. The seed search (later) will look for a seed that lands the climax inside that window.

Step 3 — Tune the physics

The physics sidebar exposes the controls that actually matter and hides the ones that don’t. The four to focus on:

• Gravity — higher values make the ball “fall faster.” Pumping gravity is the cheapest way to add visual energy. Watch out, though: too high and the ball tunnels through thin walls before the engine can resolve the collision. The simulation runs at 60fps with adaptive substeps to prevent this, but extreme gravity values still feel jittery.
• Restitution (bounciness) — values near 1.0 produce perfectly elastic bounces; values around 0.7 are realistic; below 0.5 the ball loses energy fast and the clip ends in a dead pile. For a 60-second video, sit between 0.85 and 0.98.
• Ball count — Classic uses one. Accumulation and Versus scale up to dozens. More balls = more collisions per second = more audio events. Don’t crank this past 100 for a phone-first audience; the eye loses track.
• Container rotation speed — slow rotation reads as “premium” on social. Fast rotation reads as “chaotic.” There’s no right answer; pick one and commit.

Don’t touch every slider on the first run. Move one. Re-watch. Move the next.

Step 4 — Add audio that maps to collisions

The audio engine is what separates a bouncing ball video from a screen recording of one. It runs entirely in the browser via Tone.js and supports two modes:

1. Mapped scale — every collision plays the next note of a musical scale (piano, xylophone, bell, glass, pop, kick). The ascending pattern gives the brain a “we’re building toward something” cue.
2. Sliced track — upload an audio file, pick a slice length (e.g. 200ms), and each collision advances playback by one slice. The ball plays the song one bounce at a time. This is the technique behind every “ball completes a song” video you’ve scrolled past.

For your first export: pick mapped scale, set it to piano, set the scale to C major. It’s the safest default and almost always sounds correct. Get fancier on export #5, not export #1.

If you upload your own track, make sure you have rights to use it — TikTok’s commercial sound library is the safest path; pop hits are not. The BounceArena commercial license covers the rendered MP4, not the music you imported into it.

Step 5 — Run the seed search

Here’s the lever new creators systematically miss: the seed search. Every simulation in BounceArena is deterministic — the same seed produces the exact same video. The seed search spawns up to 8 parallel workers (capped by navigator.hardwareConcurrency) that hunt for a seed where the mode-specific target event lands inside your duration window.

What “target event” means depends on the mode. For Accumulation, it’s the moment the container shatters. For Escape Holes, it’s the ball escaping. For Versus, it’s the elimination of all but one contestant. The search runs headless — no rendering — and stops at the first frame the event fires.

Set the search range to [55s, 60s] and let it run. In a couple of minutes you’ll have a list of seeds whose climax lands on beat with a 60-second post. Pick one. Now you have a video where the audio-visual climax lands at the perfect moment, every time.

This is the single biggest difference between a video that goes viral and one that quietly sinks.

Step 6 — Export the MP4

Hit export. The render pipeline:

1. An offscreen canvas re-runs the entire simulation with the chosen seed.
2. Each frame is encoded via WebCodecs (VideoEncoder).
3. Audio is synthesized separately from the recorded collision log (workers don’t run Tone.js).
4. Both tracks get muxed into an MP4 by mp4-muxer.

You don’t need to know any of that. What matters: the file ends up in your downloads folder, with no server roundtrip, no queued render, and no upload to a third party. The whole job runs on your laptop’s silicon.

A 30-second 1080p export typically takes 20–40 seconds on a modern Mac. A 60-second export, around 50–80 seconds. Slower devices take longer; the encoding time scales roughly linearly with duration.

Step 7 — Post

Drop the MP4 into TikTok’s “Upload” tab. Don’t add their built-in music — your audio is already baked into the file. Use the description for keywords, not the video. Post within an hour of a peak-traffic window for your geo (most US-targeted accounts post 7–9pm local).

Then make another one tomorrow.

Common first-export mistakes

• Cutting at 14 seconds. If you want monetization, you need 60. Always 60.
• Cranking gravity to 11. Looks chaotic on a phone screen. Reads as “made by a child.” Stay around the default + 20%.
• Skipping the seed search. This is the single move that separates an export with a flat ending from one with a satisfying climax.
• Uploading a copyrighted track. TikTok will mute your audio inside an hour and the video reads as broken.
• Iterating on the wrong slider. The four that matter: gravity, restitution, ball count, duration. Everything else is polish.

Where to go next

Once you’ve shipped one export, the next questions are usually: “what makes one of these go viral instead of die at 200 views?” and “how much can I actually earn from this?” We covered the first in 10 things that move the needle on bouncing ball videos, and the second in TikTok Creator Rewards in 2026: real earnings, real math.

The point of this tutorial isn’t to make a perfect first video. It’s to close the loop: idea → export → posted. Once you’ve done it once, the second time is faster. By the tenth video, you stop reading guides like this one.