Ein vollständiges, produktionsreifes Ticketing-System für eine Schifffahrtslinie am Bodensee: Online-Buchung, digitales Ticket, Bordvalidierung und Analyse-Dashboard – aus einer Hand entwickelt.
Der Wasserbus verbindet das Bodenseeforum mit dem Stadthafen Konstanz in 15 Minuten. Statt Papiertickets und Kassenbetrieb an Bord wickelt das System den kompletten Lebenszyklus einer Fahrkarte digital ab: Kauf, Zustellung, Aktivierung, Kontrolle und Auswertung – ohne App, ohne Kundenkonto, direkt im Browser.
Wasserbus Konstanz
(Schifffahrtsbetrieb, Bodensee)
Konzeption, UX/UI, Full-Stack-Entwicklung, Payment-Integration, Betrieb
Buchungsseite, Ticket-Wallet, Bord-Validator, Admin-Dashboard, Prognose-Modul
Gerätegebundene Tickets mit kryptographisch gesicherten Einmal-QR-Codes
Bewusst schlank gehalten: Ein Node.js/Express-Backend bedient fünf Vanilla-JS-Frontends. Keine Framework-Abhängigkeiten im Frontend bedeutet minimale Ladezeiten am Bodensee-Mobilfunknetz – und langfristig wartbaren Code ohne Build-Pipeline.
Die wichtigste Design-Entscheidung des Projekts: maximale Einfachheit. Fahrgäste stehen oft direkt am Anleger – der Kauf muss schneller gehen als das Anlegen des Schiffes. Deshalb: keine App, kein Konto, kein Passwort. E-Mail-Adresse eingeben, zahlen, fertig.
Einzelfahrt, Tageskarte oder Familienticket – per Plus/Minus direkt auf der Startseite. Preise live aus der Tarifdatenbank.
~ 15 SekundenWeiterleitung zu Stripe Checkout: Karte, Apple Pay oder Google Pay. Die Zahlungsbestätigung kommt serverseitig per Webhook.
~ 30 SekundenSekunden nach der Zahlung liegt der persönliche Ticket-Link im Postfach – kein Ausdrucken, kein Wallet-Import nötig.
sofortBeim ersten Öffnen bindet sich das Ticket an das Gerät. An Bord genügt ein Blick aufs Handy – das Personal scannt, fertig.
~ 2 SekundenHinter der einfachen Buchungsseite steckt ein geschlossener Kreislauf: Jede Rolle – Fahrgast, Bordpersonal, Betreiber – hat ihre eigene, aufgabengerechte Oberfläche.
Landingpage und Verkaufskanal in einem: Fahrplan mit Live-Ausnahmen, Haltestellen, Preise und der komplette Ticketkauf – suchmaschinenoptimiert mit strukturierten Daten (Schema.org LocalBusiness).
Die Fahrkarte lebt im Browser – ohne App-Store-Umweg. Beim ersten Öffnen wird das Ticket kryptographisch an genau ein Gerät gebunden. Weiterleiten des Links bringt nichts: Auf fremden Geräten bleibt das Ticket gesperrt.
Das Kontrollgerät ist das eigene Smartphone des Personals: Login, Kamera an, scannen. Das Ergebnis kommt in unter einer Sekunde – groß, farbcodiert und auch bei Sonne auf dem Wasser ablesbar.
Die Kommandozentrale des Betriebs: Tarife, Fahrplan, Tickets, Kontrollpersonal und Systemeinstellungen – alles an einem Ort, ohne dass der Betreiber je eine Datenbank anfassen muss.
Das Highlight für die Betriebsplanung: Ein eigenes Prognosemodell schätzt die Fahrgastzahlen der kommenden Wochenenden – auf Basis von Wetterdaten, Parkplatzauslastung und lokalen Events. So lässt sich Personal- und Schiffseinsatz vorausschauend planen.
Papiertickets kann man kopieren, Screenshots kann man teilen. Dieses System nicht: Der Lebenszyklus jedes QR-Codes ist kryptographisch abgesichert.
Ein Ticketsystem verarbeitet Zahlungen und personenbezogene Daten – entsprechend kompromisslos ist die Sicherheitsarchitektur. Grundprinzip: Was nicht im Klartext gespeichert wird, kann nicht gestohlen werden.
E-Mails, Device-Tokens, IP-Adressen und Scan-Tokens werden ausschließlich als SHA-256-Hash gespeichert. Passwörter mit PBKDF2 (100.000 Iterationen).
Ticket-Links mit HMAC-SHA256 signiert, QR-Tokens aus 32 Byte Zufallsdaten, timing-sichere Vergleiche gegen Timing-Angriffe.
Checkout, QR-Erzeugung, Scans und Logins sind einzeln limitiert – Schutz vor Brute-Force, Ticket-Flooding und Scan-Missbrauch.
Content-Security-Policy, X-Frame-Options: DENY, CORS-Whitelist – gesetzt über Helmet, auf jeder Seite.
Stripe-Webhooks laufen in DB-Transaktionen mit Idempotenz-Prüfung – keine Doppelbuchungen, keine Race Conditions.
Jede Validierung wird protokolliert; strukturiertes Winston-Logging mit täglicher Rotation und ZIP-Archivierung außerhalb des Web-Roots.
Bewährte, langfristig wartbare Technologien statt Framework-Hype: Das Frontend kommt komplett ohne Build-Prozess aus, das Backend setzt auf den Node.js-Industriestandard.
| Qualitätsmerkmal | Umsetzung |
|---|---|
| Automatisierte Tests | Jest-Suite für Auth, Checkout, QR-Tokens, Validierung und Login – mit Coverage-Reporting |
| Deployment | PM2-Prozessmanagement mit Ecosystem-Konfiguration, Health-Check-Endpunkt für Monitoring |
| Observability | Getrennte App-, Error- und HTTP-Access-Logs (CLF), täglich rotiert und archiviert |
| Konfiguration | Vollständig über Umgebungsvariablen – identischer Code in Staging und Produktion |
Eigene Version in Leichter Sprache – damit wirklich jeder Fahrgast versteht, wie man ein Ticket kauft. Ein Angebot, das im ÖPNV-Umfeld selten konsequent umgesetzt wird.
Strukturierte Daten (LocalBusiness), Open-Graph- und Twitter-Cards, Sitemap und saubere Canonicals – die Buchungsseite ist zugleich das Marketing-Instrument.
Kein Framework, keine Build-Pipeline, self-hosted Fonts: Die Seite lädt auch im Mobilfunknetz auf dem Wasser in Sekundenbruchteilen.
Fahrgastprognose aus Wetter, Events und Parkplatzdaten mit Live-Korrektur und automatischer Modell-Optimierung – Data Science im Tagesgeschäft eines Fährbetriebs.
Tarife, Fahrplan, Personal und Systemeinstellungen pflegt der Betreiber selbst im Dashboard – inklusive E-Mail-Diagnose und Datenbereinigung per Klick.
Datenschutz nicht als Nachrüstung, sondern als Architekturprinzip: Datenminimierung, Hashing, Consent-Management und Löschroutinen sind eingebaut.
Ob Ticketing, Buchungssystem oder digitale Prozesse: Wir entwickeln produktionsreife Lösungen – von der Konzeption bis zum laufenden Betrieb.
Projekt anfragen