Zum Inhalt springen

Referenzen

  • UI- & UX Design
  • Webentwicklung
  • Next.js
  • Gewinnspiel
  • Kampagne

Gewinnspiel-Website für Yakult: Probiopoly

Scannen, sammeln, gewinnen. Für Yakults Gewinnspiel Probiopoly haben wir UI/UX Design und Umsetzung übernommen: eine Aktionsseite für drei Länder, gebaut mit Next.js, gedacht fürs Telefon.

Kunde
Yakult Deutschland
Jahr
2025, 2026
Aktionsseite Yakult Probiopoly: Spiel mit bei Probiopoly, Prämien im roten Kreis

Das Projekt

Yakult startet mit einem Gewinnspiel ins neue Jahr: Probiopoly. Wer täglich Yakult trinkt, scannt den QR-Code aus der Packung, sammelt Gute-Bakterien-Punkte und löst sie gegen Prämien ein.

Wir haben die Aktionsseite entworfen und gebaut: Länderauswahl für Deutschland, Österreich und die Schweiz, Registrierung, Punktekonto, Prämien in vier Stufen. Alles in Yakult-Rot, alles zuerst fürs Telefon.

Scannen, sammeln, gewinnen. Design und Code aus einer Hand.

Die Aufgabe

Ein Gewinnspiel hat drei Monate. Die Website hat drei Sekunden.

Probiopoly läuft vom 15. Dezember bis zum 31. März, in Deutschland, Österreich und der Schweiz. Wer die Packung in der Hand hält und den QR-Code scannt, landet auf dem Telefon: Er soll sofort verstehen, worum es geht, sich in einer Minute registrieren und beim nächsten Scan nur noch Punkte sehen. Design und Umsetzung kamen von uns.

Startseite der Aktionsseite: Prämien, Jetzt registrieren, Win-win für dich und deinen Darm, So funktioniert esPunktekonto: Hallo Monika, Deine Punkte, So funktioniert es, Deine Gewinnchancen mit vier Prämienstufen

Das Design

Yakult-Rot, viel Luft, ein roter Kreis.

Die Seite lebt von wenigen Elementen: der Wortmarke, dem warmen Verlauf, dem roten Kreis, der die Prämien trägt, und einer klaren Typografie für Überschriften und Zahlen. Jede Prämienstufe ist eine Karte mit Bild, Punktzahl und Knopf. Das Punktekonto steht ganz oben, damit die wichtigste Zahl immer zuerst kommt.

Probiopoly auf dem Telefon: Startseite
Probiopoly auf dem Telefon: Punktekonto
Probiopoly auf dem Telefon: Nur noch ein Schritt bis zur Teilnahme

Die Umsetzung

Zuerst das Telefon, dann der Rest.

Gebaut mit Next.js: Länderauswahl mit Sprachumschalter für die Schweiz, Registrierung und Anmeldung, Passwort vergessen, Punktekonto mit den vier Prämienstufen, Adressabfrage bei der Einlösung, Wartungsseite. Die Seiten laden schnell und funktionieren auf jedem Gerät, auf dem gerade ein QR-Code gescannt wurde.

Registrierung mit Vorname, Nachname, Land, E-Mail und Passwort

Was wir gemacht haben

  • UI/UX Design

    Alle Screens für Telefon und Desktop, vom Länderwähler bis zur Prämie.

  • Umsetzung in Next.js

    Aktionsseite, Registrierung, Punktekonto, Prämien, Wartungsseite.

  • Drei Länder

    Deutschland, Österreich, Schweiz, dort mit Deutsch und Französisch.

  • Formulare

    Registrieren, Anmelden, Passwort zurücksetzen, Adresse für den Gewinn.

  • Responsiv

    Vom Scan auf dem Telefon bis zur Übersicht am Desktop.

Länderauswahl: Deutschland, Österreich, Schweiz und SuisseKopf der Punkteseite: Hallo Monika, Deine Punkte

Ergebnis

Eine Aktionsseite, die in drei Ländern läuft und auf dem Telefon zuhause ist. Vom ersten Scan bis zur Prämie ohne Umweg.

Länder: Deutschland, Österreich, Schweiz
3Länder: Deutschland, Österreich, Schweiz
Prämienstufen, von 1 bis 6 Punkten
4Prämienstufen, von 1 bis 6 Punkten
Design und Umsetzung aus einer Hand
Next.jsDesign und Umsetzung aus einer Hand

Ähnliches Projekt geplant?

Erzählt uns davon. Wir melden uns mit einer ehrlichen Einschätzung.

Anfrage stellen