Designs by Duhart

Designs by Duhart

Live demos

Working software, not recordings. The Billboard and BoxOffice players and the Dating deck are the real TheOne application, served from a container on my own Kubernetes node. Breach is a Transformer running in WebAssembly, NEURAL//RUN teaches machine learning by running it, and Vitals is my iPhone app ported to the browser. Six smaller interactive components from the case studies are at the bottom.

Open full screen

The real Billboard player, running. A Web Audio FFT over the decoded stream, a waveform scrubber, and audio by HTTP Range from R2, served from a pod on my k3s node.

Highlights

  • Web Audio AnalyserNode over a MediaElementSource
  • Waveform scrubber, queue, shuffle and repeat
  • Audio streams by HTTP Range from R2

How it works

The frame is the real web-platform Next.js app, running as a standalone server in one pod on my k3s node and reached through a Cloudflare tunnel to a NodePort. There is no ingress controller in front of it, so the route allow-list ships inside the image. Audio arrives by HTTP Range from R2, and the spectrum is an AnalyserNode reading that same decoded stream.

What is real, what is stubbed

Real: the components, the audio engine, the API calls and the catalogue. Changed for the demo: a route allow-list, and a flag that lets an anonymous visitor's playback request reach the server. Liking a track or saving a playlist needs an account, so those fail quietly here, which is how they were built to fail.

Other demos