A practical guide to how the simulator works, panel by panel. For the internal technical workings see the technical sheet.
npm install in the project folder (first time only)npm start to start the serverhttp://localhost:3000, then click "Enter Simulation" on the landing pageThe screen is split into two blocks, like a physical console:
To the left of the screen there's a row of quick icons (Setup, Help, Theme, Pools, Patch, 3D). To the right, a numbered menu (1-8) to jump between sections.
FULL and press Enter.16 vertical faders. Click the track to jump to a value, drag the white handle for precise control. Works with touch too. The LED above each fader lights up when the channel is > 0%.
Type a name, a fade time and (optionally) an automated effect, then "Store Cue". Cues are stored on Supabase in real time — any other open session sees them appear/disappear instantly, no refresh needed. Press GO on a cue to recall it: if it has an assigned effect, it runs automatically for 8 seconds.
Saves the current fader state as a "scene" in the browser. GO to recall it, X to delete it. Persists even after closing the page. "Reset Demo" reloads the 3 demo scenes.
For each of the 16 channels: name, fixture type (PAR LED, Moving Head Spot/Wash, Beam, Strobe, Wash RGBW, Mirror Ball, Fog Machine, LED Bar, Blinder, Fresnel, Profile/Spot) and DMX address. The "Dim" column shows the live fader value. Pan/Tilt are decorative (no real motor simulated).
Assign a color to each channel by clicking the swatches, then "Store Design" to save levels + colors together as a recallable "look". Different from Scenes: here color is included, not just intensity.
Live simulator: truss at the top, stage floor in perspective at the bottom. Each fixture draws a different beam depending on the type set in Patch — moving heads leave a sharp mark on the floor, washes spread a soft fan, mirror balls scatter sparkles, fog creates haze, strobes flash. The Pan/Tilt/Zoom/Color/Gobo encoders (in the deck) really move these beams live.
4 assignable video layers from a demo clip library. Each layer has opacity and blend mode (normal/add/multiply/screen). The "Output Preview" really composites the active layers. During Automation, layer 1 advances on its own in sync with the scenes.
Contains: Advanced (quick Blackout/Full/Freeze), Effects (Chaser/Rainbow/Strobe + color swatches), Groups (group channels), Automation (scene playback at an interval), DMX Monitor (live 0-255 values), Export/Import (scenes as .json), Hotkeys (shortcut reminder), Timecode (time-based sequence).
A decorative page that reproduces a real console's Setup menu (Show/Console/User/Network). Items show a "not implemented" notice on click — meant to familiarize with the menu structure, not functional.
| Key | Action |
|---|---|
| B | Blackout (all channels to 0%) |
| F | Full (all channels to 100%) |
| S | Focus the "Store Scene" field |
| D | Toggle light/dark theme |
| 1-8 | Focus the fader for the matching channel |
Disabled while typing in a text field.
At the bottom of the deck, or via the numeric keypad beside the faders:
| Command | Effect |
|---|---|
FULL | All channels to 100% |
OFF / BLACKOUT | All channels to 0% |
AT <value> | Sets channels to the given value (0-100) |
CLEAR | Clears the current selection |
Physical keypad keys: AT, GO (= FULL), OFF, CLR, digits 0-9, THRU, ENTER (execute), arrow (backspace).