Videos That Edit ThemselvesAuto-Motion Pipeline
Cut video turnaround from three weeks to one, so product videos ship as fast as the script is written.
- Role
- Designer-Builder (pipeline design, build, deployment)
- Team
- Solo
- Timeline
- 2026
- Platform
- HyperFrames, GSAP, ElevenLabs (voice + music)
- 3→1 wk
- Video turnaround
- 3×
- Faster delivery
- 6
- Video projects shipped
Product explainer videos were a manual grind: record voice, hand-time captions, nudge every frame to match. I built a pipeline that takes a script and Figma frames and renders a finished, word-synced motion video on its own.
01 · Context & problem
A video is mostly waiting, not deciding
Every 314e product video followed the same slow ritual. Someone wrote a script, recorded or commissioned a voiceover, then sat in an editor lining up captions word by word and nudging each visual until it landed on the right syllable. The creative decisions took minutes; the mechanical work of voicing, captioning, and syncing stretched a single video out to about three weeks. And because it was so manual, videos were rare, inconsistent, and always the thing that slipped.
I treated this as a pipeline problem, not a one-off editing favor. If the inputs were predictable (a script and some frames), the rest could be automated end to end.
02 · Role & process
Turn the inputs we already have into a finished video
I designed the flow, built it, and wired the tools together so a video could be generated from assets we were already making anyway.
Scaffolded a HyperFrames project
Wrote the script, generated the voice
Generated a matching score
Built each scene in code
Stitched it into one timeline
Linted, previewed, rendered
03 · Key decisions
Three calls that made it hands-off
Script plus Figma frames as the only inputs
What. The pipeline takes what the team already produces, a written script and Figma frames, and asks for nothing else.
Why. Every extra input is a reason the tool goes unused. Designers already live in Figma and scripts already get written, so building on those meant zero new busywork to feed the machine.
Tradeoff. I had to handle messy, real-world frames and scripts rather than a tidy custom format.
Result. Making a video starts from assets that already exist, so the cost of a new video drops to almost nothing.
Word-by-word sync done automatically
What. ElevenLabs generates the voiceover and transcribes it into word-level timestamps, and every scene's animation is built in code, cued directly off that timestamp file rather than timed by eye.
Why. Hand-timing captions is the single most soul-crushing part of motion work. If the machine owns the timing, a human never touches a timeline.
Tradeoff. Trusting automated alignment means occasional edge cases to tune instead of full manual control.
Result. Captions land on the right word and visuals change on cue, with no scrubbing back and forth.
Programmatic video over a timeline editor
What. Each video is a HyperFrames project, a root timeline plus one code file per scene, rendered from the command line rather than dragged together in a traditional editor.
Why. Code is reproducible and versionable. Change the script, regenerate the voice, and the whole video rebuilds; tweak a brand color once, every scene inherits it. A timeline editor cannot do that.
Tradeoff. More up-front engineering than opening an editor and exporting once.
Result. Videos became a repeatable build, not a bespoke craft project each time.
04 · Solution & artifacts
Script in, synced video out
The pipeline runs as a chain: the script sets the words and structure, ElevenLabs turns it into a voiceover and a word-level timestamp file, and a matching background score gets mixed in underneath. GSAP animates every scene precisely off those timestamps, and each scene stitches into one HyperFrames timeline with a clean cross-dissolve at every cut. Hit render and a finished 314e product video comes out the other side.
The first video built this way was a 141-second explainer for Jeeves Search, built from 12 scenes.
05 · Impact
Videos ship as fast as the script
- 3→1 wk
- Video turnaround
- 3×
- Faster delivery
- 6
- Video projects shipped
A video that used to take three weeks now ships in one. One of the six, a 141-second explainer for Jeeves Search built from 12 scenes, rendered clean in both 1080p and 4K straight off the command line. Product videos stopped being the thing that slipped and became something we could turn around on demand.
06 · Reflection
What I'd carry forward
The win was refusing to treat video as a craft that has to be done by hand every time. Once I saw it as a pipeline with predictable inputs, the slow parts became code. Next I would push the alignment tuning further so even the rare mistimed word disappears, and open the skill up so a non-designer can render a video from a script alone.