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
One rule for the Hushdesk websitesite: every section shows the product working. https://hushdesk.vercel.app
→ the hero plays a live ticket, from order lookup to refund
→ the bento proves each feature with a piece of product UI
→ "How it works" keeps the visual pinned while the steps scroll
→ hover a customer logo and their story swaps in
→ the closing CTA is a support queue that clears itself
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
Proof — a press-proof skin for Video.js v10
Proof treats the player like a sheet coming off the press. Crop and registration marks frame the picture, and the controls sit on an opaque paper margin with a K·C·M·Y colour bar, so they stay readable over bright and dark footage alike. The seek bar is a tint ruler with a registration-target thumb, volume is printed as ink density (yellow, magenta, cyan, then key), and when the video ends the sheet is stamped "OK to print."
It's built on the Scaffold skin's accessible components: every control is reachable by keyboard with a registration-magenta focus ring, touch targets are 44 px, the plate compacts on phones, motion switches off under reduced-motion, and decoration steps aside in forced-colours mode. The demo plays our own studio film from Mux, with chapters and captions. Designed and built by Sidepath Studio.
Landing Page Design Concept for a Live Touring Platform
Tourline is a landing page design concept for a booking platform that turns an agent's inbox into one live record per show: holds, offers, routing, contracts and settlement.
How it's built:
Hero is a real-time 3D concert stage in Three.js. Scroll moves the show through its lifecycle: hold, offer, advance, show night, settle.
Custom volumetric light beams written as a GLSL shader, with real spotlights lighting the stage and crowd, bloom, lens glare and dust caught in the beams.
The LED wall, side screens and LED floor are live canvas textures. The headline renders on the wall, then breaks into LED dots as you scroll.
Beam choreography runs at 124 BPM with four lighting modes, and the camera responds to the cursor.
ScrollTrigger and smooth scroll drive the section reveals, route drawing and the interactive inbox.
If you book tours for a living, what is the one thing you would change here? Or tell me what you would build next.
Breaking the headline into LED dots as you scroll is a lovely way to tie the copy to the stage. With that much going on in the hero, how did you keep it light on mid-range laptops? Did you cap the pixel ratio or turn some of the bloom and glare off?
Press Proof — a Video.js v10 skin that prints its controls
Press Proof treats the player as a sheet on a proofing table. Most skins float translucent controls over the picture and hope the footage cooperates; this one prints them, in solid ink on an off-white paper strip, so they read the same over a night sky or a snowfield (ink on paper is about 16:1).
Every mark comes from the print shop and has a job. The timeline is a printer's colour bar with ruler ticks and a hatched buffer, the scrubber is a registration target, fullscreen is a pair of crop marks, volume is a ten-step densitometer scale, and the big play button is a registration target whose cyan and magenta plates sit slightly off register. The one piece of motion with a personality is misregistration: hover a control and its plates slip and snap back into register. With reduced motion on, nothing travels.
It stays usable for everyone: all controls in visual order on the keyboard with a single magenta-on-paper focus mark, menus that close with Escape and return focus, touch targets of 40 px or more, a full-bleed strip on phones, RTL support, and a clean fallback to system colours in Windows High Contrast. Icons were drawn for the skin; type is IBM Plex Mono. The demo page switches between bright footage (our Mux asset) and dark footage so legibility can be judged over both, and links to the skin workbench for sizes, ratios, languages and RTL.
Built with an AI coding assistant (Claude Code) from the Video.js CLI Scaffold starting point, under human art direction and review.
Footage: Big Buck Bunny (excerpt), © Blender Foundation, CC BY 3.0, hosted on Mux; NASA Cosmic Dawn trailer (Video.js demo asset). Typeface: IBM Plex Mono (OFL). Skin licensed under Apache-2.0. Design and build: Rui Codex, Belgium.
