Afterglow
Live stage visuals that follow the band's beat, for Arabic bands, weddings and festivals.
What it is
A live visual studio for shows. The operator works in a control window while a separate Stage Output window drives the LED wall, projector or OBS. It listens to the band through a microphone, finds the tempo, and pulses 16 effects in time with the music.
Why I built it
I built this as freelance work for live shows: Arabic bands, weddings and festivals that wanted big-screen visuals moving with the music, without hiring a VJ. It had to run on one laptop at the venue with no internet, and it had to stay steady when the room was loud and messy.
How it works
The microphone feeds an FFT of 1,024 samples every 33 ms, split into bass (30–180 Hz), mid (180–2,200 Hz) and high (2,200–10,000 Hz). A rise in sound weighted 65/30/5 across those bands counts as a beat when it beats 1.7 times a moving baseline (never less than 0.045) and at least 260 ms has passed. Gaps between 285 and 1,500 ms are kept. The tempo is the median of the last 6, accepted only when at least 65% of them agree within 14%, and limited to 40–210 BPM.
The visuals don't flash on every drum hit. They pulse on a smooth beat clock at the detected tempo, so extra hits in a drum fill don't add pulses. The first estimate takes effect straight away, capped at 150 BPM until a second matching gap confirms it. The tempo stays locked through quiet passages, and the raw detector resets after 2.5 s of silence. Loudness changes brightness, depth and which layers show, never speed. Tap tempo and a manual BPM are there when the room fights back.
The control window and the Stage Output window talk over BroadcastChannel. The operator prepares a look privately in Edit preview, then presses Take live to crossfade it onto the audience screen. Blackout and Undo are always one key away. It uses no packages: plain ES modules and Canvas 2D, served from a tiny local Node server.
Up to 6 layers combine effects like Ring Rush, Arabesque, Sunburst and LED Wall, with 14 shapes and screen areas such as both sides or the top band. An optional music director sorts the energy into quiet, steady or peak. It waits a few seconds before acting and holds each scene for 32 seconds by default before switching to a matching look on its own.
Up to 12 logos can rotate, show in groups, move between corners every 8 beats, or pulse slightly on the beat. The effects can also take their colours from the logos.