Adaptive delivery that holds up on a phone in a tunnel and a 4K TV on a gigabit line. Sub-second joins, tight stream-to-screen latency, and graceful handling of the messy network between you and your viewer.
{[
"Adaptive bitrate — from 144p mobile to 4K TV",
"Low-latency delivery, global by default",
"Multi-bitrate ingest with a documented failover path",
].map(bullet)}
{/* 02 — Ticketing */}
02 · Ticketing
Sell exactly the way you sell.
The same event, priced four ways: full-event pass, day pass, single stage, single session. Sale windows, quantity caps, promo codes, refunds, revenue splits. Ticketing that matches the shape of your event, not the other way around.
{[
"Four pricing granularities on the same event",
"Sale windows, quantity caps, promo codes, refunds",
"Per-ticket licensing — one ticket, one active session",
].map(bullet)}
{/* 03 — Real-time chat */}
03 · Real-time chat
A room, not a firehose.
Chat filters run before messages land on screen, not after. Moderators have single-tap ban, mute, slow mode, subscriber-only — the tools a live operation actually uses. Viewers feel like they're in a room together, not scrolling a deluge.
{[
"Two-layer moderation: instant filter + intelligent review",
"Full operator toolkit — ban, mute, slow mode, subscriber-only",
"Scales with the audience — 50 people or 200,000",
].map(bullet)}
{/* 04 — Clips for social */}
04 · Clips for social
Clip it now. Post it now.
The best clip of the night goes viral the night of, not three days later. Mark a moment mid-stream, trim it, export 9:16 for TikTok/Reels/Shorts, 1:1 for feeds, 16:9 for everything else — while the event is still running.
{[
"Mark-and-trim mid-stream, no post-production wait",
"Multi-format export — 9:16, 1:1, 4:5, 16:9",
"One-click publish to social with your brand overlay",
].map(bullet)}
{/* 05 — Merch store */}
05 · Merch store
Merch at the moment of peak intent.
A vinyl shout-out on stage mid-set. A limited print offered at the end of the comedy special. The merch store sits on the same page as the stream — same brand, same checkout, same cart. No redirect, no friction, no lost sale.
{[
"Attached to the viewer page, never a redirect",
"Drop items mid-event — timed releases, limited runs",
"One checkout for ticket, chat subscription, and merch",
].map(bullet)}
{/* 06 — Your brand, your domain */}
06 · Your brand, your domain
It's your product. It should look like it.
Run on your own domain with automatic certificates. Your logo, your colours, your type, your language — right down to right-to-left scripts. Viewers never see us. They see you. That's the whole point.
{[
"Custom domain with automatic SSL",
"Full visual theme — colours, type, logo, favicon",
"Multi-language with full right-to-left support",
].map(bullet)}
);
}
function ModBtn({ label, onClick, variant }) {
const danger = variant === "danger";
return (
);
}
const CLIP_VIDEO_SRC = "https://assets.slipstreamtv.co.uk/website/8042164-uhd_4096_2160_25fps.mp4";
function ClipVideo({ aspect, style }) {
// aspect: "9:16" | "1:1" | "16:9"
// The underlying video is 16:9 landscape. To crop to the middle for portrait/square
// we scale the video up so the short side fills the container, centered.
// For 9:16 the video needs to be much taller than wide — we let height fill and let
// width overflow (object-fit: cover handles the maths).
return (
{/* subtle overlay to keep chrome legible */}
);
}
function ClipWaveform({ reduced }) {
// A more realistic waveform: amplitudes combine a couple of sine waves,
// a slow envelope (verses/chorus), occasional "hits", and a small jitter.
// We render ONE period, then render it TWICE back-to-back, and translate
// by exactly one period width so the loop is truly seamless with no gap.
const BARS = 120; // bars per period
const BAR_W = 4; // px
const BAR_GAP = 2; // px
const STRIDE = BAR_W + BAR_GAP;
const PERIOD_W = BARS * STRIDE;
const H = 40;
function amp(i) {
// Two overlapping sines give a natural rise-and-fall pulse.
const s1 = Math.sin((i / BARS) * Math.PI * 6) * 0.45;
const s2 = Math.sin((i / BARS) * Math.PI * 2 + 1.3) * 0.35;
// Envelope so the whole pattern breathes across the period.
const env = 0.55 + 0.45 * Math.sin((i / BARS) * Math.PI * 2);
// Deterministic pseudo-random jitter.
const r = (Math.sin(i * 12.9898) * 43758.5453) % 1;
const jit = (r - Math.floor(r)) * 0.25;
// Occasional accent hits.
const hit = (i % 17 === 0) ? 0.25 : 0;
const v = Math.abs(s1 + s2) * env + jit + hit;
return Math.max(0.12, Math.min(1, v));
}
const bars = Array.from({ length: BARS }, (_, i) => amp(i));
function renderPeriod(offset) {
return bars.map((a, i) => {
const h = Math.max(2, Math.round(a * (H - 6)));
const x = offset + i * STRIDE;
return (
);
});
}
return (