SciFi Ambient Display
A browser-based sci-fi ambience generator. It layers procedurally synthesized starship drones, warp/worp core pulses, life-support hiss, and background telemetry chirps into a continuous soundscape, paired with a matching on-screen console and an optional full-screen "observation deck" visualizer, with optional local AI announcements and MIDI control. Good for background noise while working, relaxing, or falling asleep.
Getting Started
The simplest way to use it: open the newest dist/SciFiAmbientDisplay_V*.html in any modern browser (double-click it — no install, no server, no internet connection required). It's a single self-contained file with everything bundled in.
If you'd rather run it from the source files instead, open index.html the same way, or serve the folder with any static file server.
Click anywhere (or hit the Play button) to start audio — browsers require a user interaction before sound can play.
Choosing a Vessel
Use the dropdown in the header to pick a universe, then choose a specific vessel/location preset from the sidebar. Each universe has its own visual theme and soundboard:
- Starflight Command — clean flagship bridges, engineering decks, and crew quarters
- The Whataverse — time-machine consoles across several eras, from clanking Victorian brass to a coral-organic control room
- Industrial Space — grimy tugs, mining ships, and utility shuttles
- Bioships — living, breathing vessels with organic pulses and membranes
- Retro Future — atomic-age and 70s/80s-style spacecraft
- Military Space — combat bridges and tactical operations centers
- Deep Space — long-haul liners, generation ships, and research vessels
- Outlaw / Frontier — lived-in salvage ships and independent freighters
- Space Stations — orbital platforms and rotating habitats
- Comedy / Adventure — lighter, quirkier takes on the genre
Every preset changes both the ambient soundscape and the console's look and feel.
Shaping the Sound
The mixer has four independent channels, each with its own volume:
- Hull Drone — the low, steady rumble of the ship itself
- Worp Core — the rhythmic reactor/engine pulse
- Life Support — airflow and ventilation hiss
- Telemetry — sparse background computer chirps and beeps
Mute everything instantly with the header mute button, or use the master volume control. The soundboard (bottom right) adds one-off sound effects specific to the current universe — chimes, alerts, door sounds, and the like — layered on top of the ambient mix.
Futuristic Noice Cancellation
FNC is a comfort filter for the three continuous beds. It's on by default, and the FNC LEVEL slider decides how hard it pulls them down:
| Channel | Reduction across the slider's range |
|---|---|
| Life Support | 50% → 100% |
| Hull Drone | 10% → 70% |
| Worp Core | 5% → 50% |
The point is to keep the room tone present without letting it sit on top of whatever else you're listening to. FNC steps aside on its own during alerts, universe events, and soundboard hits, then eases back in — the readout tells you which state it's in. Turn it off entirely with the FNC ENABLED button and the channels play at their raw mixer levels.
Generative Experience (optional)
The GENERATIVE EXPERIENCE panel adds spoken ship's-computer announcements written in the voice of the current universe — clinical and precise on a Starflight bridge, eccentric and put-upon on a Whataverse console. Press PREPARE AI to download the local language model and neural voice; both then run entirely in your browser, and the browser caches them for later sessions.
This is the one part of the app that needs the internet, and only on that first preparation. It also needs a WebGPU-capable browser (current Chrome or Edge). Without either, the panel reports it and everything else works exactly as before.
Turn AUTO UPDATES off if you'd rather trigger announcements yourself, SPEAK off for text without voice, and use VOICE AUTOMATION to dial in how synthetic the voice sounds — each universe has its own default.
MIDI Control
If you have a MIDI controller, press ENABLE MIDI and the browser will ask for access. Pick a target from the dropdown, press MIDI LEARN, then move the knob, fader or pad you want bound to it. Volume, every channel parameter, FNC level, activity, and the transport and alert buttons are all mappable. Bindings are saved in the browser and survive a reload; CLEAR MAP wipes them.
TV Presentation
The TV PRESENTATION panel locks the Watch Experience to a 16:9 frame with black bars, so the scene looks the same whether it's on a phone, a monitor, or a cast display — useful when sending it to a TV via Chrome. RENDER DENSITY trades detail against performance from 720p up to 2160p; drop it if the animation stutters on a weaker machine.
Sleep Timer
Set the ambience to automatically fade out and stop after 15, 30, or 60 minutes — handy for falling asleep to. Choose "OFF" to run continuously.
Watch Experience
Click WATCH EXPERIENCE to switch to a full-screen, passive display: a slow-moving starfield/warp view framed by the current ship's viewport, with an activity slider to control how much visual motion happens. Each universe draws its own waveform readout down there too — subspace harmonics on a Starflight bridge, a drive vibration scope on an industrial tug, tactical carrier blocks on a military deck. It's designed to be left running on a second monitor or TV as ambient scenery, or projected in a room. Click the background (or press Escape) to return to the controls.
Keyboard Shortcuts
| Key | Action |
|---|---|
| Space | Play / pause |
| M | Mute / unmute |
| ↑ / + | Volume up |
| ↓ / − | Volume down |
| 1–9 | Set volume to 10%–90% |
| 0 | Set volume to 100% |
| W | Trigger the universe's primary event (e.g. warp jump) |
| R | Trigger an alert |
| F | Toggle the viewport frame (in the Watch Experience) |
| P | Toggle support pillars (in the Watch Experience) |
| Esc | Exit the Watch Experience / stop active alerts |
For Developers
Project structure and build notes
SciFi-XZBT/
├── index.html # Entry point
├── css/
│ └── style.css # Styling, CRT effects, theme colors
├── js/
│ ├── audio.js # Web Audio synthesis, oscillators, sound engines
│ ├── config.js # Vessel presets, universe registry & palettes
│ ├── core-animations.js # Settings-panel core animations
│ ├── visualizer.js # Audio spectrum & Worp Core canvas rendering
│ ├── observation-bezels.js # Procedural SVG viewport bezels
│ ├── observation-engine.js # Watch Experience canvas and simulation engine
│ ├── midi.js # Control bus & Web MIDI / MIDI-learn controller
│ ├── generative-experience.js # Optional local LLM narration & neural speech
│ └── app.js # DOM bindings, hotkeys, UI controllers & main loop
├── dist/
│ └── SciFiAmbientDisplay_V<commit>.html # Standalone, single-file offline build
└── tools/
├── package.ps1 # 1-click script to build the standalone single-file HTML
└── extract.ps1 # Original extraction script for reference
Working on the source
- Edit the specific CSS or JS files directly.
- Audio/synthesizer logic lives in
js/audio.js. - Viewscreen bezels and framing are in
js/observation-bezels.js. - Watch Experience canvases and simulation are in
js/observation-engine.js. - Presets and the sound matrix live in
js/config.js. - FNC lives in
js/audio.js; MIDI and the control bus injs/midi.js. js/generative-experience.jsis the only file that touches the network, and only when the operator prepares it. Seeagents.mdfor the bounds on that exception.
Repackaging to a single file
powershell -ExecutionPolicy Bypass -File .\tools\package.ps1
This produces dist\SciFiAmbientDisplay_V<commit>.html, combining all CSS and JS back into a self-contained, double-clickable offline file. It requires git, since the commit hash is what labels the build.