Show a body, and put it straight
A body is shown wrong — a foot collapsed, an axis bent — and then, in the same picture, put right. It is the strongest before-and-after there is, because the eye judges it with no words. Here is how the insole advert does it, and the three ways we can do it ourselves.
The part to look at
Two beats, four seconds in total. Everything else in that advert is a shoe being scratched and hosed. These two beats are the whole idea.
Beat one. A line drawn on real film. Nothing is animated here except a black line laid over an ordinary shot of a heel. The line bends where the ankle rolls in. As the heel settles onto the insole, the line becomes vertical. The proof is the drawing, not the footage.
Beat two. A drawn leg, an axis, a support that rises. Same camera, same leg, same size on screen. A red dotted axis runs from the calf to the floor. An orange arrow grows under the arch, the support thickens, and the axis stands up. Three things move and they all say one thing.
The trick, named
Four devices. Each one is cheap, and each one can be lifted on its own.
One frame, one change
The camera does not move and the body does not walk away. The subject stays exactly where it was, at the same size, so the only thing the eye can compare is the fault. A cut to a new angle would destroy the whole effect.
A line carries the verdict
Bent is wrong, straight is right — nobody needs to be told. The line does the arguing, and it works on real film as well as on a drawing. Note it is one single line, not a diagram: two lines would already need a caption.
The cause is shown pushing
The support does not appear finished. It grows, under the exact place that was collapsing, with an arrow in the direction of the push. The product is not next to the fix, it is the fix, in the same frame.
The travel up the chain
The camera then climbs: foot, knee, pelvis, spine. A small fault at the bottom becomes a whole-body matter at the top. This is what turns an insole into something worth buying — and it is done purely by moving the camera up a still model.
The climb, and the look that carries it: skin turned to dark glass, bone left bright inside. It reads as an examination rather than an advertisement, which is exactly the point.
We can already do it. Move the slider
Nothing here is a video, a photograph or a 3D file. It is a drawing in the page, about forty lines of code: one axis, one leg built around that axis, one support that grows. Drag it, and the body is put straight.
What is really happening. The leg is not a picture of a leg. It is a single line — the axis — with a body drawn around it. Bend the line and the whole leg leans, the foot rolls, the shadow shifts. Straighten it and everything returns. One number drives all of it, which is why this costs nothing to animate.
Why it convinces. Because the support is what moves the line. The blue block grows under the inner edge, the arrow shows the push, and the axis stands up as a consequence. Cause and effect in the same picture, no caption needed.
Three roads to make it ourselves
Choose by what the shot has to do, not by what is most impressive. The first road covers most of what we need, and it is free.
| Road | What it is good for | What it takes | Cost |
|---|---|---|---|
| RecommendedDrawn in the pageThe demo above | Anything on one of our own pages: a body, a spine, a queue, a crooked process. Exact, repeatable, and it can follow the scroll or a slider so the reader performs the fix. | An SVG whose shape is generated from one number, animated with motion.dev or plain CSS. Already in the studio's kit. | Free. Minutes. |
| A line over real filmBeat one | Proof shots. A real foot, a real person, a real screen — with our line drawn on top. Far more credible than any render, because the footage is not ours to fake. | Footage, then an SVG overlay driven by the video's own time, or the line drawn in an editor. The hard part is holding the camera still. | Free, plus the filming. |
| The ghost body in 3DBeat two, and the climb | The advert's exact look: dark glass skin, bright bone, the camera travelling up the chain. Worth it only when the subject really is anatomy. | Blender with Z-Anatomy, a free 3D atlas of the human body (CC BY-SA 4.0, built on BodyParts3D). Two poses, one morph between them, glass shader on the skin, glow on the bone. Rendered on the rented computer. | A few centimes of computer time per shot. One long afternoon to set up, then cheap forever. |
| Ask an AI for the video | Ambience only — a body walking, a foot in a shoe, light and dust. Skip it for the fix itself. | It cannot straighten a named part on cue, and it will not keep the same body from one shot to the next. The one beat that matters is the one it cannot do. | Pennies, and a wasted afternoon if used for the wrong shot. |
Where we use this, beyond bodies
The grammar is not medical. It is: show the fault in place, keep the frame still, let one line carry the verdict, then make the fix visibly push. Everything we build has a crooked version of something.
A process put straight
A citizen's path drawn as a bent line through five offices, then the same line straightened by a single window. Same beat, same slider, no anatomy at all.
A form that snaps into place
Fields scattered and repeated, an axis through them bent; the rule arrives and the fields align. This is the honest picture of what our work actually does.
The reel, kept
The advert page carries exactly one moving thing: this sixteen-second loop. It is kept here whole, because the beats above are half a second each and the page it came from will change.
- Source
- shopalignee.com — VitaSoles product page, taken 14-08-2026
- The file
- An animated image, 226 by 316, 200 frames at 12 or 13 a second, about sixteen seconds
- Note
- The page sells a shoe today, not the insole the address names. The reel is the same creative either way, and it holds both beats
- Frames kept
- The two beats, the climb up the chain, the bones of the foot, the pressure map, the foot on the insole — in
body/assets/