Case Study

EasyStretcher.com

Von der Linksammlung zur Mediathek

Die Webseite des YouTubers war einst eine Link-Sammlung. Heute ist sie eine Creator-Plattform mit eigener HLS-Mediathek.

HLS-Mediathek mit eigenem Webplayer und signierter Auslieferung
Discord-Community-System: Rollenmanagement, Live-Pings via Twitch EventSub, Server-Stats
AI-Companion 'ES': Stelle fragen rund um Grand Theft Auto Online

Webseite besuchen

Kennzahlen

Zahlen die für sich sprechen

Line of Code

30.000+

Playlists, Segmente, Assets

Streaming-Assets

~200 GB

in einem R2 Bucket

Episoden

Vom Bettler zum Bonzen

Produktivsysteme

Im Betrieb

Live in Produktion — echte Nutzer, echter Traffic.

HLSCloudflare R2Stripe ConnectClerkhls.jsSupabaseDiscordTwitchNext.jsHLSCloudflare R2Stripe ConnectClerkhls.jsSupabaseDiscordTwitchNext.jsHLSCloudflare R2Stripe ConnectClerkhls.jsSupabaseDiscordTwitchNext.js

StreamingAuthBillingStorageDeliveryWebhooksEventSubFeature FlagsAIStreamingAuthBillingStorageDeliveryWebhooksEventSubFeature FlagsAIStreamingAuthBillingStorageDeliveryWebhooksEventSubFeature FlagsAI

Unfassbar zuverlässig und immer da, wenn man ihn braucht. Berät in IT-Themen unterschiedlichster Art, bringt kreative Vorschläge ein und hat sogar eine komplette neue Website für meinen damaligen Onlineshop übernommen.

@EasyStretcher

YouTuber / Streamer

Streaming

EigeneHLS-Mediathek.KeinYouTube-Embed.

22 Episoden der Serie „Vom Bettler zum Bonzen" laufen über eigenes HLS-Streaming: ~200 GB Assets in Cloudflare R2, kontrollierte Auslieferung über Worker, Playback im eigenen Webplayer.

So läuft ein Video ab

Request kommt rein. Login und Premium-Status werden geprüft. Ein signierter Manifest-Link wird erstellt. Erst dann wird gestreamt — kein offener Direktlink.

Serie

22 Folgen

Zugriff

Signiert

Streaming-Flow

Live-Demo

Fest auf Folge 22 gesetzt. Der Player nutzt natives HLS oder fällt auf hls.js zurück.

Signierte URL wird geladen...

Master-Manifest

.../folge-22/master.m3u8

Segmente an der aktuellen Stelle (4)

Timeline: 0:00:00 · Segment —

Lade Manifest und Segmente...

Encoding

Das Quellvideo wird in .m3u8-Playlists und .m4s-Segmente zerlegt — bereit für adaptives Streaming.

Storage

Alles landet in Cloudflare R2. Optimiert für Zehntausende Einzeldateien, nicht für eine große MP4.

Delivery

Ein Cloudflare Worker steuert den Zugriff — mit Request-Kontrolle und Anti-Hotlinking.

Playback

Der eigene Webplayer streamt über hls.js. Kein YouTube-Embed, keine Drittanbieter-Abhängigkeit.

Evolution

DerWandelistnichtkosmetisch—eriststrukturell.

Vorher

Link-Sammlung als Visitenkarte für den Creator
Videos über YouTube, Zugang über Drittanbieter
Kein eigener Zugriffschutz, kein Billing
Keine strukturierte Community-Integration

Heute

Creator-Plattform mit eigener Infrastruktur
HLS-Streaming aus eigenem Storage mit signierter Auslieferung
Stripe Connect mit Subscriptions, Premium-Zugang und automatischer Discord-Rollen-Zuweisung
Discord-Community-System: /discord-Seite, DB-gesteuerte Rollentoggles (9 Rollen, 3 Kategorien), Membership-Tiers
Twitch EventSub: Live-Benachrichtigungen via Discord Bot — kein Drittanbieter-Bot mehr
AI-Companion „Frag ES“
Native iOS + Apple TV App — Plattform auf allen Screens (interne Beta)

Keine Agentur. Kein Template.
Eine Plattform, die mit dem Creator wächst.

Produktoberfläche

Was Nutzer im Alltag sehen.

AI-Companion

Früh eingebaut, bewusst positioniert.

Der AI-Companion „Frag ES" ist kein nachträgliches Feature. Das Backend läuft in Produktion, die UI-Integration folgt schrittweise im Produktfluss. Kein separates Tool, sondern ein Teil der Plattform — dort, wo Nutzer ohnehin sind.

Bewusste Entscheidung: Nicht warten, bis alles perfekt ist. Früh einbauen, schrittweise erweitern — so entsteht kein Parallelprodukt, das später integriert werden muss.

Community

Discord als Infrastruktur — nicht als Link.

Die Discord-Integration geht weit über einen Einladungslink hinaus. Mitglieder verwalten ihre Rollen direkt auf easystretcher.com — welche Pings sie bekommen, auf welchen Plattformen sie aktiv sind, ob sie in der TestFlight-Beta sind. Alles DB-gesteuert, ohne Code-Änderungen erweiterbar.

Rollenmanagement

9 Discord-Rollen in 3 Kategorien (Plattform, Pings, Info). Jeder Toggle ist optimistisch — sofort visuell, Rollback bei Fehler. Neue Rollen per Supabase-Eintrag, kein Redeploy.

Membership-Tiers

4 Tiers aus Discord-Rollen berechnet: supporter (Twitch/YT), premium (Stripe), fan, all-in. Stripe-Webhook weist die Premium-Rolle automatisch zu — keine manuelle Pflege.

Twitch Live-Pings

EventSub Webhook mit HMAC-SHA256 Signaturverifikation. Bei stream.online postet der Bot mit Stream-Titel, Kategorie und Rollenping in den Discord-Channel — kein Drittanbieter-Bot mehr.

Native App

Interne Beta

DiePlattformaufjedemScreen.

Die EasyStretcher-Infrastruktur läuft nicht nur im Browser. Eine native iOS-App und eine Apple TV-App — gleicher Content, gleiche Subscriptions, alle Screens.

Mediathek

HLS-Streaming, Watch Progress, Offline-Downloads.

AI Companion

Frag ES — eingebaut, direkt im Produktfluss.

EasyStretcher iOS App — Push Notification neue Folge

Push Notifications

Neue Folge — sofort auf dem Sperrbildschirm.

iOS

Mediathek in der Hosentasche.

Mediathek mit HLS-Player — dieselbe Infrastruktur wie im Browser.
Offline-Download: Folgen lokal speichern und ohne Internet schauen.
Watch Progress — nahtlos zwischen iPhone, iPad und Apple TV fortsetzen.
Clerk-Auth: Login einmal, auf allen Geräten verfügbar.

Apple TV

Großer Bildschirm. Keine Kompromisse.

QR-Code-Pairing: iPhone-App scannen — Apple TV ist eingeloggt.
Mediathek für den Fernseher — TV-optimierte Navigation.
HLS-Player direkt auf dem TV, ohne Umweg über Browser oder AirPlay.

Dasselbe Subscription-Modell, dieselbe HLS-Infrastruktur, dieselbe Authentifizierung — nur auf einem neuen Screen. Die App ist interne Beta. Sie zeigt, was die Plattform-Infrastruktur trägt — ohne zusätzliches Backend, ohne separate Billing-Integration.

Systeme

Was läuft — nicht was geplant ist.

Media-System

HLS-Streaming mit eigenem Webplayer, Cloudflare R2 Storage und Worker-basierter Zugriffskontrolle.

Auth & Access

Clerk für Authentifizierung, geschützte Routen, OAuth, Passkeys, TOTP und 2FA.

Monetarisierung

Stripe Connect mit Subscriptions, Portal, Webhooks, Promo-Codes und Entitlements.

Discord-Community

Eigene /discord-Seite mit DB-gesteuerten Rollentoggles (9 Rollen, 3 Kategorien). Membership-Tiers (supporter, premium, fan, all-in) automatisch aus Discord-Rollen berechnet. Stripe-Webhook weist Premium-Rolle direkt zu.

Twitch-Integration

EventSub Webhook mit HMAC-SHA256 Signaturverifikation. Bei stream.online postet der Bot in den konfigurierten Discord-Channel — mit Stream-Titel, Kategorie und Rollenping. Ersetzt einen Drittanbieter-Bot.

AI-Companion

Backend live, UI-Integration schrittweise — früh eingebaut, bewusst im Produktfluss positioniert.

Feature Rollouts

Feature Flags für kontrollierte Releases, Rollout-Steuerung und schrittweisen Funktionsausbau.

Native App

iOS mit Offline-Download und geräteübergreifendem Watch Progress. Apple TV mit QR-Code-Pairing. Interne Beta.

Architektur-Entscheidungen

Trade-offs, die sich gelohnt haben.

HLS statt MP4

Höherer Initialaufwand, aber volle Kontrolle über Streaming-Qualität, Zugriff und Skalierung. Kein Lock-in bei Drittanbietern.

Stripe Connect statt eigenes Billing

Komplexeres Setup als einfache Stripe-Integration, aber sauber getrennte Abrechnungslogik zwischen Plattform und Creator.

Clerk statt Custom Auth

Weniger Kontrolle über jeden Auth-Flow, dafür Passkeys, OAuth und 2FA ohne eigene Infrastruktur.

AI früh integriert

Nicht warten, bis alles fertig ist. Das Backend läuft, die UI-Integration folgt schrittweise — so entsteht kein Parallelprodukt.