Bonusniki
Eine Empfehlungsplattform für ein Traffic-Arbitrage-Team mit benutzerdefiniertem CMS, WYSIWYG-Editor für HTML-Anleitungen und Clarity-Klickaufzeichnung.
Traffic-Arbitrage-Infrastruktur
Dieses Projekt wurde für ein Traffic-Arbitrage-Team entwickelt. Das Hauptziel war die Erstellung einer extrem schnellen, Mobile-First-Landingpage zur Veröffentlichung von Links auf TikTok, Instagram und YouTube. Benutzer wählen aktive Gutscheincodes und Boni aus, was den Eigentümern Empfehlungseinnahmen einbringt.
Einfache Oberfläche, starker Kern
Die Landingpage musste leichtgewichtig und reaktionsschnell sein, um kalten Traffic aus sozialen Medien effektiv zu binden. Die gesamte Verwaltungskomplexität wird im administrativen Dashboard abgewickelt, was Änderungen ohne Programmieraufwand ermöglicht.
- Optimiert primär für mobile Bildschirme (Mobile-First), mit sauberer Layoutskalierung auf dem Desktop
- Integriertes Microsoft Clarity zur Aufzeichnung von Benutzersitzungen und Erstellung von Klick-Heatmaps
- Durchführung von A/B-Tests für den Hero-Bereich zur Optimierung der Klickrate (CTR)
- Vollständig anpassbare Kartendesigns mit 50 Gradienten-Presets oder Echtzeit-CSS-Generierung
Für wen Bonusniki entwickelt wurde
- Traffic-Arbitrage-Teams zur Steigerung der Konversionsraten von Partnerprogrammen
- Social-Media-Nutzer auf der Suche nach verifizierten Werbeaktionen und Freispielen
- Systemadministratoren, die Angebote verwalten und die Leistung des Teams verfolgen
Coupon-Verwaltung
Administratoren können Gutscheine erstellen, bearbeiten und löschen. Alle Updates werden sofort über Cloud Firestore mit der Landingpage synchronisiert.
WYSIWYG-Anleitungseditor
Ein von Grund auf in Vanilla JS entwickelter Rich-Text-Editor zur Erstellung von HTML-Couponanleitungen. Er unterstützt Formatierungen, Medien-Embedding und kürzt lange URLs in '...' zur besseren Übersicht ab.
Statistiken & Berechtigungsmatrix
Ein rollenbasiertes Autorisierungsmodell schränkt die Administratoransicht ein: Manager können nur ihre eigenen Statistiken sehen, ihnen zugeordnete Benutzer verfolgen und zugewiesene Coupons bearbeiten.
Visueller Gradient-Builder
Ein Kartendesigner, mit dem Administratoren aus 50 Premium-Farbfeldern wählen oder benutzerdefinierte lineare Gradienten mit Live-Vorschau erstellen können.
Wie das Projekt entwickelt wurde
Die gesamte Systeminfrastruktur wurde im Alleingang entworfen und umgesetzt. Anstatt auf ein schweres CMS zu setzen, wurde Astro für SSG in Kombination mit dem Firebase Client SDK verwendet, was schnelle Ladezeiten und eine starke SEO-Leistung garantiert.
- 01
Mobile-First-Design der Landingpage mit Fokus auf Konversionsraten aus sozialen Netzwerken
- 02
Integration von Firebase Auth für sicheren Login und Cloud Firestore als Echtzeit-Datenbank
- 03
Entwicklung eines WYSIWYG-Editors mit Tag-Parsing und URL-Kollapsierung
- 04
Konfiguration von Cloud Firestore-Sicherheitsregeln zur Durchsetzung von Mitarbeiterbeschränkungen
- 05
Anbindung von Google Analytics und Clarity zur Verhaltensanalyse und A/B-Test-Erfassung
Umsatzkonzept
Die Plattform amortisiert sich vollständig durch Partnerprogramme. Schnelle Coupon-Anpassungen und A/B-Tests maximieren die CTR und die Klick-Konversionen.