Photobooth Plattform
Challenge
Ein Photobooth-Verleihunternehmen betrieb ein MVP in reinem PHP und HTML/JS ohne Framework, ohne Live-Bildladung und mit für Live-Events unzureichender Performance. Frisch aufgenommene Fotos wurden nicht in Echtzeit angezeigt, die Codebasis war nicht wartbar und dem Frontend fehlte die nötige Reaktivität für ein flüssiges Booth-Erlebnis.
Solution
Wir entwickelten die Plattform mit einem Laravel-Backend und Vue.js-Frontend neu. Ein Node.js-Script scannte kontinuierlich die Zieldisk auf neue Bilder, die über eine WLAN-fähige SD-Karte übertragen wurden. Bei Erkennung benachrichtigte es das Laravel-Backend, das jedes Bild verarbeitete – Thumbnails für schnelle Vorschau und Overlay-Kompositionen zur Auswahl generierte. Nach Auswahl von Foto und Overlay erzeugte Laravel das endgültige Bild in voller Auflösung und sendete einen PHP-Druckbefehl direkt an den angeschlossenen Drucker. Das Frontend erhielt Echtzeit-Updates per WebSocket und zeigte neue Fotos sofort ohne manuelles Neuladen an.
Impact
Die Plattform ersetzte ein fragiles MVP durch eine robuste, wartbare Anwendung für hochvolumige Live-Events. Echtzeit-Bildübertragung und sofortiger Druckversand sorgten für ein flüssiges Erlebnis für Booth-Betreiber und Gäste. Der Laravel/Vue-Stack schuf eine saubere Grundlage für künftige Features.
Technology Stack
Projektübersicht
Dieses Projekt umfasste die komplette Neuentwicklung einer Photobooth-Softwareplattform für ein Unternehmen, das Photobooths – inklusive Hardware, Personal, individuellen Overlays und Software – für Firmenevents und Live-Veranstaltungen vermietet. Das bestehende MVP war nur bedingt alltagstauglich und für hochvolumige Live-Einsätze nicht geeignet.
Funktionen
- Node.js-Disk-Watcher erkennt neue Aufnahmen von einer WLAN-SD-Karte in Echtzeit
- Laravel-Backend für Bildaufnahme, Thumbnail-Generierung und Overlay-Komposition
- WebSocket-Benachrichtigungen übertragen neue Bilder sofort an das Vue-Frontend
- Overlay-Auswahl mit backend-gerenderter Vorschau in optimierter Auflösung
- Vollauflösungs-Bildgenerierung mit gewähltem Overlay nach Bestätigung
- PHP-Druckbefehl direkt aus Laravel an den angeschlossenen Event-Drucker
Technische Highlights
Die zentrale Herausforderung war Echtzeit-Reaktivität ohne Polling. Die Kombination aus Node.js-File-Watcher und Laravel-WebSocket-Broadcaster hielt das Frontend immer aktuell, sobald ein Foto auf der Disk landete. Die Thumbnail-Generierung im Backend war entscheidend für die Schnelligkeit des Frontends – das Laden von Bildern in voller Auflösung hätte bei Live-Events spürbare Verzögerungen verursacht. Der Laravel/Vue-Stack ersetzte eine unwartbare PHP/JS-Codebasis durch eine saubere, framework-strukturierte Anwendung.
Bereit, etwas Außergewöhnliches zu schaffen?
Lassen Sie uns besprechen, wie wir Ihre Herausforderungen lösen und etwas schaffen können, das echten geschäftlichen Mehrwert liefert.
Kontakt aufnehmen