motion.spqw.net
Motion design studies.
Punto de Inflexión: 4 frameworks compared
One 15-second podcast opener rebuilt in GSAP, Framer Motion, Remotion and fframes, played side by side in sync.
Punto de Inflexión in yellow (Remotion)
The Remotion version with the red-orange accent swapped for yellow, live in the player and as a rendered MP4.
Farseer style study (Remotion)
A 30-second from-scratch Remotion study of Studio Size's Farseer launch film: kinetic grotesk type, popping chips and checks, UI fragments and Gantt bars stacking into stripes.
Candy World Cup spot study (Remotion)
A 29-second from-scratch Remotion study of a candy-brand World Cup spot: circle wipes, target zooms, Venn merges, polka and swirl fields, chunky slab-serif kinetic type.
Dot-matrix progress film study, v1 (Remotion)
A 27-second from-scratch Remotion study of a dot-matrix progress film: every image is a halftone of circular dots that morphs continuously, from one dot to hunters, fire, ships, DNA, the moon, X-rays, TV, computers and circuits, ending on a starfield and gradient orb.
Dot-matrix progress film study, v2 (Remotion + WebGL2 halftone shader)
A 60-second rebuild: one WebGL2 halftone shader over animated grayscale source canvases, tuned scene by scene with Codex against an image-diff score (mean 0.37 to 0.85), with dot-migration and circle-wipe transitions.
AI-agent platform launch film study (Remotion + WebGL2 silk shader)
A 67-second, 60 fps from-scratch rebuild of a SaaS agent-platform launch film: flowing silk mesh gradients from one WebGL2 shader, crisp React UI cards, orb reveals; 34 scenes tuned with Codex against an image-diff score (mean 0.81 to 0.88, 0.89 after a typography and spacing pass).
AI creative platform launch film study (Remotion + WebGL2 glow shader)
A 53-second, 60 fps from-scratch rebuild of a creative-platform launch film, cut into 22 sequences: hard white/black cuts, acid-yellow highlight pills, word-by-word grotesk type, dark editor UIs and abstract product renders; tuned per sequence with Codex against an image-diff score (mean 0.82 to 0.88).
Creative suite launch spot study (Remotion + WebGL2 glow shader)
A 30-second from-scratch rebuild of a kinetic-type launch spot for a creative-app subscription, cut into 16 sequences: one-beat verb cuts on black, each word styled by its action (scramble, glitter, typewriter, trash drop), app-icon dock, DAW bars and device mockups; tuned per sequence with Codex against an image-diff score (mean 0.84 to 0.91).
Finance agents launch spot study (Remotion + WebGL2 shader)
A 32-second from-scratch rebuild of a kinetic-type fintech launch spot, cut into 17 sequences: mint marker strokes, stacked "Scaling" type, prompt cards, a fiery pixel-icon field, giant pixel "$100K", a year rewind, partner tiles, spreadsheets and a ribbon-logo end card; tuned per sequence with Codex against an image-diff score (mean 0.88 to 0.93).