Stop-Motion Basics: Frame Extraction and Assembly in the Browser
Stop motion is photography as animation: move a clay figure a few millimeters, take a photo, repeat a few hundred times. This guide walks through a full short film using a phone and browser tools — extract frames for reference, then assemble your own photo sequence.
Principle and spec: stop motion is just low-frame-rate video
The principle is simple: photograph the scene after each small movement, then play the photos at 8–12 frames per second and objects appear to move on their own. Cinema runs at 24 fps; stop motion deliberately uses fewer frames for its signature choppiness.
Start at 8 fps: fluid enough to read as motion, cheap enough to actually shoot. A 30-second film at 8 fps means roughly 240 photos — that is the cost model of stop motion, where length equals patience.
Set the spec before shooting: output orientation and frame rate determine how you compose every single photo. Changing spec mid-project effectively means reshooting.
Shooting discipline: stillness is the life of stop motion
The phone must be absolutely fixed: tripod, mount, even a stack of books — anything that keeps it motionless for the entire shoot. One bump shifts every frame together and the whole film wobbles; this is the most common accident in the craft.
Lock the light too: turn off lamps that change, curtain off daylight. Natural light drifts with time, and frames shot an hour apart will visibly jump in brightness. Indoor artificial light is safest.
Export photos with sequential numbered names (001, 002, 003…) so filename order equals time order. Save and name as you shoot; do not rely on reconstructing order from the camera roll later.
The tool chain: extract frames to study, assemble to produce
Use the video-frame-extraction tool to study references: pull keyframes from a stop-motion film you admire at fixed intervals and observe its frame rate, movement size and framing. Intervals from 10 seconds down to 0.2 seconds cover the rhythms you need to study.
Assemble your own sequence with the image-to-video tool: set each image to show about 0.1 seconds (roughly 10 fps) and output MP4 — the film exists. The tool also normalizes image sizes along the way.
After assembly, review pacing: too fast means lengthen per-frame duration (re-synthesize only, no reshooting); too slow means drop some middle frames. Because the material is independent photos, rhythm adjustments cost nothing.
Movement design: small steps, continuous, reversible
The classic beginner error is moving too far per frame — a hand jumps from left to right in one frame. Move a small step each time; slow is fine, because smoothness comes from frame count, not distance.
Design from the end state: to move a figure from A to B, pose B first, then decompose backwards into intermediate steps. Compare each photo with the previous frame and confirm the delta is reasonable before shooting it.
Plan for interruptions: place a small out-of-frame marker at the break point, and when resuming, take one test frame to confirm the composition has not drifted. Shoots spanning days are normal; resumability beats heroics.
Sound and packaging: voice and effects bring it alive
Frame-accurate sound effects are half the charm: footsteps and collisions aligned to each move transform the watch. Locally, assemble a soundtrack afterward by merging or mixing the animation with an effects track.
No effects library? Use your mouth — vocal sound effects are a stop-motion tradition, not a compromise. Record the track and splice it against the picture.
Post-process by purpose: MP4 for social feeds; for sticker or GIF contexts, take the best few seconds through the video-to-GIF tool, controlling width, frame rate and color count to fit platform limits.
Going further: from single scene to narrative
Keep the first film at 15–30 seconds, one scene, one action — the goal is a complete run through the pipeline. Chasing narrative before the pipeline is stable almost guarantees an abandoned project.
Then add difficulty in layers: multiple fixed positions (really just separately-shot segments joined), character dialogue (a two-frame mouth open/close loop), scene changes (swapped backdrops). Each layer builds on a stable previous layer.
Archive stop-motion projects differently from ordinary video: the photo sequence itself is the raw material. Keep project folders (project/001-240) alongside the film — future rhythm changes cost zero reshooting.