Video.js skin

Quilted Patchwork

No video loaded

/

Captions are on. Keys: Space plays and pauses, M mutes, C toggles captions, F goes fullscreen, arrows seek and set volume.

Notes

Idea
A patchwork quilt for a family recipe channel: the controls are sewn cotton patches in a row along the bottom of the picture, each with a running stitch inside its edge, and the seek is a piped cord sewn with its own running stitch, with a tufted button for the playhead. Press a patch and its padding sinks under your finger, then slowly fills back in.
Accessibility
A plain dark scrim under the row keeps the cream time above 5:1 even over a pure white frame, the cream applique glyphs stand at least 3:1 on every patch, the crimson played cord stands more than 4:1 against the cream one, focus is a cream ring outside a dark gap, round with each patch, and captions off or mute is shown by a strip of crimson cloth stitched diagonally across the patch, a shape rather than a color change.
Craft
The sink is light, not drawing: a press brings up a shaded hollow inside the patch, a multiply blend over the art, and settles the patch 3% in 90ms (with reduced motion, the hollow alone), and the padding fills back in over 280ms with no bounce; the cord is its two sewn ends plus a tile of whole stitch periods repeated to fit, so the running stitch never smears into long dashes at any width.