The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Tapedeck TD-90 is a cassette deck that plays video. The seek bar is the tape: it runs through a smoked window between two reels, and as the film plays the tape winds from one reel to the other.
The reels aren’t decoration. Grab one and turn it to scrub, clockwise to wind forward. They spin twice as fast at 2× and slow down at 0.5×. Ticks along the tape mark every tenth, matching the 0–9 keys.
The deck works like real hardware. Play, captions and fullscreen are piano keys that latch down when on, with an LED. Time reads off counter drums. CUE drops a marker on the tape; press it again to wind back to it. Each chapter shows up as a track on the cassette label. Volume is a VU meter, settings is a ruled spec sheet, and tooltips are embossed label-maker tape.
Every control sits on a solid surface, so it stays readable over bright or dark footage. Keys are 44px on touch, focus is always visible, and with reduced motion the reels stop and nothing slides. It comes as a cream deck or a black deck, and you can recolour the tape live.
Try it: tapedeck-ruddy.vercel.app
In the wild: it’s the player for the project film on my portfolio, robiulhasan.dev
Film: “Boing Studio, a walkthrough”, a screen recording of a site I designed and built, streamed from Mux.
Using the tape as the timeline is so good.
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Who wants to come to a picnic with an outdoor movie? I'll bring the video player 🧺🎬
Picnic Cinema is my new Video.js skin: a 3D garden cinema where the controls hang as tags from festoon bulbs. The lights glow when you pause and dim when the film starts.
Too comfy to reach the bulbs? Grab the remote on the picnic table.
You can still use the keyboard like a normal player: Space to play, arrows to seek and change the volume, F for fullscreen.
I Designed a custom skin for the Video.js v10 player.
In Video.js v10, a skin is the player’s interface: the UI components plus the styles that present them. Video.js is open source and community-driven, and the player can end up on almost any website, so every skin makes a choice: how much personality it has, how well it fits into someone else’s design, and how far it pushes the controls. This was all incorporated into the design from scratch. The built-in v10 skins show this range. Creativity and mastery are incorporated to produce something nice and pleasant.
videojs.org
Video.js | Open Source Video Player
The open-source video player for React and HTML. Lightweight, accessible components built for performance and streaming.
Please make sure you've shared a public link for us to view your project!
I made a skin that treats the video player like an instrument.
It's a Teenage Engineering pocket sampler, a pale plastic deck bolted over the video with one orange key for the transport, like RECORD. One short row, hard shadow instead of glass or glow.