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
VIDEOBOY: a video player that feels like the handheld you never put down.
Remember the click of the cartridge going in? The two-note chime, the green glow, the back seat of the car while everyone else was asleep?
VIDEOBOY brings that back for video. Press Play and the film runs in full colour inside a little console. Press Pause and the screen turns into a four-tone dot-matrix panel, the way it looked under a blanket at 2am.
Every part of it is a real button. The D-pad seeks and changes the volume, Select opens the menu, and A and B do what your thumbs expect. Your keyboard works too: X plays, the arrow keys move.
Pick a cartridge from the shelf and slot in another film. Bright scenes, dark scenes, wild colour: the dot-matrix screen keeps them all readable.
Choose your shell: Tangerine, Classic or Night. The whole page changes colour with it.
It fits whatever space you give it, from a phone to a full-width hero, and it's built on Video.js v10 with Mux. It's also keyboard and screen-reader friendly, because everyone deserves a turn.
Go on. One more level.
Pause turning the screen into a four-tone dot-matrix panel is perfect. Under-the-blanket-at-2am energy.
Beautiful work, Victor!
I love the gameboy vibe!!!
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
I’m picky about video players. Give me controls I can find without thinking, a timeline that’s easy to scrub, and enough room for the picture. That’s where All Terrain, my entry for the Video.js Skins Design Challenge, started.
The woods came later. I wanted to see how a minimal player would feel in a setting with a strong character of its own. Smoked glass and muted brass felt right against the woodland footage, and the controls stayed simple enough that I could imagine using the same skin on a portfolio or a film journal.
Both films stream through Mux, and I made a little rookie showcase video to give you a closer look at the desktop and mobile layouts, theater mode, and playback settings.
Public Mux playback IDs
The beauty of still frames by Pepijn Janssen — kDA2CntengmWSO2lKDMb01ZNj2FyyApJwCaE00WR6nWeg
Green by GawxArt — xHdOULPcXIZZaLIaLONfjOWigMq2wdP7thAbgw3EEjQ If you give it a spin, I’d love to hear what feels intuitive and what takes a second to find.
#VideoJSSkinsChallenge #VideoJS #Mux #Contra
Picky about players is the right starting point. Woodland vibe on top of solid basics, nice.
I turned a DJ deck into a video player. Every control does a real player job: the jog wheel scrubs, the tempo fader sets playback speed, eight hot-cue pads jump between chapters and light the current one, and the waveform strip is the seek bar, built from the film's real audio peaks.
The deck sits below the video, never on it, and anyone finds play, volume and fullscreen in a second.
I built it on Video.js v10 in plain CSS and 4 KB of TypeScript, with no images or web fonts. It's keyboard-operable, respects reduced motion, contrast and forced colors, and re-brands through a few tokens.
The look is my own Baltic palette: deep green deck, cream labels and amber LED glow.
Try it: https://videojs-cdj-skin.vercel.app, also live on my site: https://modestasgrz.github.io
Film: Tears of Steel © Blender Foundation, CC BY 3.0, streamed from Mux (playback ID lNg95EGnssc00hkLLQSCG02an2R3Ss702005HBDpEXYPBZk).
Hot-cue pads for chapters and a real audio waveform, every control earns its place.
Rewind Video: a Video.js skin that’s a whole video store
I wanted to design a video library that works together with the player, not one bolted on next to it. And the video library I have the warmest memories of is the video store: Friday nights, walking the aisles, reading hand-written staff picks, carrying a tape to the counter. Rewind Video brings that feeling back. You browse the library, rent a film, and watch it, the way we used to.
The store is the library. You walk between three aisles: Horror, Staff Picks and Cult & Sci-Fi. Open a shelf and you see the tapes spine-out, with hand-written labels and genre stickers. Pull one off the shelf and it becomes a 3D VHS tape you can turn in your hands, next to its rental slip. Rent it, and the store keeps it in your rental history.
The player is the TV. The skin is a 1970s TV set, and every control is part of it:
- the push buttons rewind, play/pause, fast-forward and go fullscreen;
- the tuning knob scrubs through the tape;
- the volume knob turns, and a small knob mutes;
- a green VCR bar on the glass shows the time and lets you seek;
- the power knob ejects the tape and sends you back to the shelf.
On a phone the set’s knobs would be too small for a thumb, so the TV comes with its own remote.
Made for everyone. Everything works with the keyboard, with a visible focus ring on every knob and button. Touch targets are thumb-sized, the time stays readable over bright and dark footage, and all the motion calms down when reduced motion is on.
▶ Watch the player: https://inquisitive-profiterole-99d1a7.netlify.app/#watch
🏪 Walk the store: https://inquisitive-profiterole-99d1a7.netlify.app
Please be kind, rewind.
This is so fun! ✨