Back to Showcase
Live Classroom Streaming

SlideCast

Live-stream classroom slides — and the teacher’s annotations — to every student’s iPad over WiFi that barely works.

01

Overview

SlideCast was built to solve a very specific classroom problem: most live-presentation tools assume robust networks and unconstrained devices. The reality at NMS Puchenau is the opposite — MDM-locked school iPads on contended WiFi, where pushing a 50 MB PDF over LTE simply isn’t happening. SlideCast inverts the model: the deck is delivered once, then everything live is measured in kilobytes.

The teacher uploads a deck (PDF, PPTX, or HTML) which the server rasterises into per-slide WebP at 1x and 2x. When a session starts, students join with a room code or QR scan and their service worker pre-caches every slide once. From that point on, the only network traffic is a stream of sub-KB socket events — "slide changed to 5," "stroke drawn at these coordinates" — which a flaky classroom WiFi handles trivially.

For the moments where static slides aren’t enough, the teacher flips a toggle: Snapshot mode posts a WebP screenshot of the teacher’s desktop at ~1 Hz over plain HTTPS (no media servers, firewall-proof). Video mode runs a real LL-HLS pipeline through ffmpeg for true motion at ~2 s latency, with native Safari HLS on the iPads. LiveKit WebRTC sits underneath for the lowest-latency real-time moments. Three tools, one toggle, all chosen by the teacher in the moment.

02

Features

Slides mode — pre-cached deck

The whole deck downloads once per student via service worker on join. Every slide change and annotation after that is a sub-KB socket event — kilobyte-friendly even on the worst classroom WiFi.

Snapshot mode — WebP at 1 Hz

For demos that aren’t worth a video pipeline: getDisplayMedia → offscreen canvas → WebP at quality 0.6, posted at ~1 Hz over plain HTTPS. No media servers, no WebRTC, no UDP — just HTTP and a WebSocket on 443, so it slips through any school firewall. Each frame stays under ~80 KB and the cadence adapts down when bandwidth tightens. Perfect for static or slow-changing teacher screens.

Video modes — WebRTC & LL-HLS

For motion-heavy content, two video pathways the teacher can choose between. LL-HLS via ffmpeg streams fmp4 segments at ~2 s latency to Safari’s native HLS player — no MSE, no plugins. LiveKit WebRTC drops latency to sub-second for ultra-real-time moments. One toggle, two underlying pipelines.

Real-time annotations

Canvas overlay strokes broadcast to every joined student in milliseconds, with a four-colour palette and an eraser. Coordinates scale with each viewer’s slide.

Multi-format deck pipeline

Server rasterises PDF, PPTX, and HTML to per-slide WebP at 1x and 2x. pdftocairo handles PDFs, LibreOffice headless converts PPTX, Playwright handles HTML.

QR + room code join

Students scan or type a six-character code — no accounts, no installs. The session lobby surfaces the QR and copy-link for the teacher to project or share.

iPad-first PWA

Service worker pre-caching, A2HS manifest, viewport-fit, native Safari HLS (no MSE), pinch-zoom locked to the slide canvas. Built around real iPad constraints, not desktop assumptions.

03

Implementation

Node.js Express 4 Socket.IO 4 LiveKit WebRTC ffmpeg + LL-HLS pdftocairo (Poppler) LibreOffice headless Playwright (HTML decks) Service Worker Vanilla JS (ES2020) CSS Custom Properties PWA manifest + A2HS qrcode-mini.js i18n (en / de) Light / Dark theme No build step
04

Gallery

SlideCast runs live on this domain — open the student-side join screen yourself.

Open SlideCast