Animation

Cocktail Recipe Motion Graphic Animation

Rory Flynn

@Ror_Fly · 28.9K followers

1Klikes

80.1Kviews

74reposts

1.5Kbookmarks

Sep 23, 2026

View original post ↗

Claude Opus 5.5 looked at a single cocktail photo and produced a fully animated 30-second HTML/JS explainer video — starting from an empty glass and building the drink ingredient by ingredient. Each component flies in with its measurement labeled, motion-graphic style, timed across the full pour sequence. The whole thing was generated one-shot from a single image and a single prompt asking for an explainer-video-style animation. The result is the kind of polished motion graphic you'd expect from a dedicated After Effects template.

One-shot from a single cocktail image: Opus 5.5 inferred the full recipe and built the animation without any additional input
Animated ingredient reveal sequence shows each component and measurement as it's added to the glass, empty to finished
30-second explainer-video pacing rendered entirely in HTML/JS, no video editing software involved

“Opus 5.5 rendered this in HTML from (1) image 🤯 Things are getting weird. PROMPT: We're going to try a little test. Do you think you could render a recipe motion graphic animation using javascript or html (w/e you think will produce the best) to show the full recipe from start to finish (empty glass to completed cocktail) - Explainer video style - Showing the recipe ingreidents + measurements as they're going into the cup. Should be a 30s video.”
— @Ror_Fly

one-shot html-canvas animation javascript cocktail explainer-video animated bold-typography light