TL;DR We're going to add hover-preview thumbnails (the little image that follows your...
FFmpeg generates a sprite sheet (10x10 tiles, 10s intervals) and a Node script creates a WebVTT index with tile coordinates for scrub-bar thumbnails. Standard video UX pattern implementable in under 100 lines; applies to any SaaS or streaming platform needing hover previews without heavy player libraries.
TL;DR
We're going to add hover-preview thumbnails (the little image that follows your cursor on a video scrub bar) to a player. Backend is one FFmpeg command that builds a sprite sheet, plus a tiny script that writes a WebVTT index. Frontend points the player at the VTT. Total: well under 100 lines.
What we're building
Two static artifacts and a few lines of player config:
storyboard.jpg - a sprite sheet: many small frames tiled into one image.
TL;DR We'll build a pipeline that takes any video file, extracts candidate frames with...
TL;DR We're going to build a "user uploads a video, user watches the video" feature in a...
How I built a custom video player for ShareBox: fragmented ffmpeg streaming, JS state machine, exponential backoff watchdog, PGS…
Full pipeline: Gemma 4 31B expands a one-liner into a 10-beat script, HiDream generates images, LTX-2 I2V renders clips, and…
TL;DR — I built Captionly, a subtitle generator that runs Whisper inside the browser...
Every "add captions to your short" tool works the same way: you upload your clip to their servers,...
