SkyStream

Landing Page
Host
Viewer

Inspiration

We have all been on a plane with our shows downloaded and ready to watch, or even had work or emails to check. So instead of hunching over a small device, why not use the larger, more eye-level terminal? Passengers can work, review documents, or follow along on a larger, eye-level display, reducing neck strain and making long flights materially more comfortable. For productivity, it turns dead time into usable time: collaborate with a colleague across the aisle, walk a teammate through slides, or quickly share a file view without passing devices around. The experience is optimized for responsiveness, so cursor movement, scrolling, and playback feel immediate, making it practical for real work, not just demos. In short: faster collaboration, better ergonomics, and reliable low latency, delivered through the screen already in front of you.

What it does

SkyStream is a built-in, low-latency seatback feature that lets American Airlines passengers instantly mirror their phone, tablet, or laptop onto the in-flight terminal. It turns the screen already in front of them into a larger, eye-level workspace. For American Airlines, it elevates the premium experience, increases engagement with the seatback ecosystem, and creates a differentiated feature that can support higher satisfaction scores and new monetization opportunities.

How we built it

Next.js + React form the product layer: a fast, component-driven UI that’s easy to iterate on and ship. Next.js adds performance and deployment ergonomics (routing, SSR/edge-ready patterns) that help the app feel immediate and polished.

Tailwind CSS supports a clean, consistent design system at speed. It keeps the interface lightweight and responsive across seatback screen sizes without fighting CSS bloat.

Express is the control plane on the backend: simple, predictable, and ideal for API endpoints, session orchestration, auth hooks, and coordinating real-time connections.

WebSockets provide the “always-on” signaling channel, used for presence, pairing (seat-to-seat or device-to-seat), session state, and negotiating live connections. This is the backbone of responsiveness: lightweight messages and instant updates.

WebRTC is the low-latency media path. Once signaling is complete, WebRTC enables direct, real-time streaming optimized for minimal delay, exactly what screen mirroring needs to make it feel like you’re using the device, not watching it.

Metered strengthens the WebRTC layer by handling hard parts of real-world connectivity (e.g., TURN/ICE services). In practice, this increases connection success rates across restrictive or variable networks—critical in aviation environments.

Google Cloud virtual machine instances allowed us to host our websockets between the host and the viewer. Allowing us to keep a real-time connection for the user.

Vercel is the deployment engine for the frontend, tightly integrated with Next.js. It delivers rapid CI/CD, global deployment, and stable environments, so releases are fast, safe, and easy to roll back.

ngrok is the development accelerator: it enables secure tunneling for testing real-time flows (WebSockets/WebRTC signaling) across devices during demos and pilot iterations, without complex networking setup.

Challenges we ran into

iOS constraints: Native screen capture, permissions, and browser limitations made iOS interoperability more complex than desktop and Android workflows.

Restrictive network environments: NAT types and firewall rules limited peer-to-peer connectivity, requiring careful ICE/TURN configuration to maintain reliable sessions.

Cross-device testing and deployment: Validating real-time performance across non-local devices introduced additional complexity around secure tunneling, signaling stability, and consistent environments between development and production.

Accomplishments that we're proud of

Cloud integration: Successfully integrated multiple cloud services (Google Cloud plus TURN infrastructure) to support reliable real-time connectivity.

Low-latency screen sharing: Delivered a responsive, low-latency video mirroring experience suitable for live collaboration and productivity use cases.

Real-time signaling at speed: Implemented WebSocket-based signaling and session orchestration to minimize setup time and keep interactions fast and synchronized.

What we learned

Multi-provider deployment: How to deploy and operate a distributed system across Vercel, Google Cloud, and Metered—managing environments, routing, and reliability across platforms.

WebSockets in production: How to use persistent, real-time connections for signaling, session state, and coordination with low overhead and fast responsiveness.

WebRTC fundamentals and hard edges: How peer-to-peer media works end-to-end (ICE/STUN/TURN, NAT traversal, connection negotiation) and what it takes to keep streams stable in restrictive network conditions.

What's next for SkyStream

Next, we’ll launch a companion mobile app that enables seamless, native screen mirroring with one-tap pairing and smarter session controls. In parallel, we’ll move from prototype to airline-grade integration, working directly with seatback terminal platforms to embed SkyStream as an onboard feature. The goal is to deliver a premium, low-latency experience at scale that improves passenger comfort and productivity, strengthens in-flight satisfaction, and gives airlines a differentiated capability they can promote, bundle, and monetize.