Vorlage: Spin Wheel (Glücksrad)

Das Spin Wheel ist ein spielerisches Glücksrad. Besucher drehen, um einen Gutschein, einen Rabatt, kostenlosen Versand oder einen anderen Preis zu gewinnen, mit Gewinnchancen, die Sie steuern. Es gibt zwei Layouts mit genau denselben Einstellungen und Funktionen — wählen Sie das, das zu Ihrer Platzierung passt.

Die zwei Layouts

• Spin Wheel (Stacked) — eine hohe, schmale Karte: Logo, Überschrift und Text oben, das Rad in der Mitte und der Button darunter. Am besten für eine Inline-Platzierung in einer Seite, für Seitenleisten oder schmalere Bereiche.
• Spin Wheel (Side-by-Side / Full Screen) — eine breite, zweispaltige Karte: Text auf der einen Seite, das Rad auf der anderen. Sie unterstützt außerdem eine Vollbild-Übernahme, bei der die ganze Seite zum Hintergrund wird (eine Volltonfarbe oder Ihr Bild), mit Rad und Text in der Mitte. Am besten für Hero-Bereiche, breite Banner und Vollbild-Aktionen.

Alles Folgende gilt für beide Layouts, sofern nicht anders angegeben.

So funktioniert es für den Besucher

1. Das Rad erscheint mit einem pulsierenden Button Spin.
2. Der Besucher klickt auf Spin; das Rad dreht sich und landet auf einem Segment.
3. Gewinnt er einen Preis (ein Segment mit Gutscheincode), wird der Code angezeigt, und er kann ihn per Klick kopieren. Gewinne können mit Konfetti oder einem Leuchten gefeiert werden.
4. Landet er auf einem Nieten-Segment (ohne Gutschein), kann er erneut drehen, wenn Sie mehr als eine Drehung erlauben.
5. Sind die Drehungen aufgebraucht, wird das Rad in einen „verbrauchten“ Zustand abgedunkelt, damit klar ist, dass er fertig ist.

Die Segmente (die Preise) einrichten

Das Rad hat 4 bis 8 Segmente. Die Segmente 1–4 sind immer aktiv. Die Segmente 5–8 haben jeweils einen Schalter Show Segment, damit Sie sie bei Bedarf einschalten können.

Jedes Segment hat diese Einstellungen:

• Label — der kurze Text auf dem Radsegment (z. B. „10 % RABATT“).
• Win Chance — ein Gewicht, das steuert, wie wahrscheinlich dieses Segment ist. Höher = wahrscheinlicher. Die Gewichte sind relativ; 30/20/30/20 bedeutet also, dass das erste und das dritte Segment jeweils in etwa 30 % der Fälle kommen. Setzen Sie ein Segment, das Sie selten vergeben möchten (etwa einen großen Preis), auf eine niedrige Zahl.
• Color — die Farbe des Segments.
• Prize Message — was der Besucher sieht, wenn er dort landet (z. B. „Sie haben 10 % Rabatt gewonnen!“).
• Coupon Code — der bei einem Gewinn angezeigte Code. Lassen Sie ihn leer, um das Segment zu einer „Niete“ zu machen (z. B. ein Segment „Nochmal versuchen“). Leerer Code = kein Gewinn, keine Feier.

Ob Gewinn oder Niete, entscheidet allein, ob das Segment einen Gutscheincode hat. Ein Segment mit Code ist ein Gewinn, eines ohne Code eine Niete.

Wie oft darf gedreht werden?

Die Einstellung Spins Allowed steuert das mit einer einzigen Zahl:

• 1 = nur eine Drehung.
• 2, 3, … = bis zu so viele Drehungen, aber das Rad stoppt, sobald gewonnen wurde. Erneut drehen darf der Besucher nur, wenn er auf einer Niete landet und noch Drehungen übrig hat.

Stil und Anzeige

• Preset — Farbschema dark, light oder brand.
• Display Mode — inline (in die Seite eingebettet), fullpage (eine Karte zentriert auf einem abgedunkelten Overlay, wie ein Modal) oder fullscreen (der ganze Bildschirm wird zum Hintergrund, der Inhalt zentriert — der Übernahme-Look). Fullscreen ist der Hauptgrund, die Vorlage Side-by-Side zu nutzen.
• Background Image (fullscreen) — optional. Wählen Sie im Fullscreen-Modus aus der Mediathek ein Bild, das den ganzen Bildschirm füllt. Leer lassen für eine Volltonfarbe aus dem Preset.
• Size — compact, default oder spacious.
• Win Celebration — Konfetti, Leuchten oder nichts. Wird nur bei einem echten Gewinn abgespielt.
• Spin Duration — wie lange die Drehanimation dauert, in Sekunden.
• Tick Sound — ein optionales Tickgeräusch während der Drehung.
• Auto-close After Win — Sekunden bis zum Schließen nach einem Gewinn. 0 lässt es geöffnet.

Bild, Text und Buttons

• Show Image — ein optionales Logo oder Produktbild über dem Titel (Auswahl aus der Mediathek). Schalten Sie es aus, wenn Sie kein Bild möchten.
• Eyebrow, Title, Subtext — der Überschriftentext.
• Spin Button Text — die Beschriftung des Dreh-Buttons.
• Button ‘No thanks’ — ein optionaler zweiter Button, mit dem der Besucher das Rad schließen kann. Schalten Sie ihn ein oder aus und legen Sie seinen Text fest.
• Button (after win) — ein optionaler Call-to-Action-Button, der nach einem Gewinn erscheint (z. B. „Jetzt einkaufen“), mit Ihrem eigenen Link.
• Wheel Center Text (when spent) — das kurze Wort in der Mitte des Rads nach der letzten Drehung (Standard „DONE“).

Das Ergebnis im Profil des Besuchers speichern

Unter Save Result to Profile können Sie im Personyze-Profil speichern, was jeder Besucher gewonnen hat, um ihn später gezielt anzusprechen (zum Beispiel Gewinner erinnern, die ihren Gutschein nicht eingelöst haben).

• Prize Field — ein Profilfeld für das gewonnene Label. Leer lassen, um es zu überspringen.
• Coupon Field — ein optionales Profilfeld für den Gutscheincode.

Das Rad nach Gewinn oder Niete nicht mehr zeigen

Unter Hide After Win or Loss können Sie das Rad einem Besucher nicht mehr zeigen, sobald er gespielt hat, damit er es nicht bei jedem Besuch sieht.

• Hide After Win (Yes/No) — nach einem Gewinn das Rad nicht mehr zeigen.
• Hide After Loss (Yes/No) — nach einer Niete das Rad nicht mehr zeigen.

Wichtig: Diese Schalter entscheiden, ob das Rad je nach Ergebnis ausgeblendet wird. Wie viele Sitzungen es ausgeblendet bleibt, legen Sie an der Aktion selbst fest, in den Einstellungen Placement / Trigger (Display Frequency) — nicht in dieser Vorlage. Der Schalter blendet es für den Rest der aktuellen Sitzung aus, plus die dort eingestellte Anzahl von Sitzungen. Der Besucher sieht seinen Preis trotzdem zuerst; das Rad wird nur für künftige Besuche unterdrückt.

Das Rad schließen

Der Abschnitt Close steuert den X-Button: ob er erscheint, wie er aussieht und ob er immer oder nur beim Hovern sichtbar ist.

Ein Hinweis zur Vorschau im Editor

In den Modi fullpage und fullscreen erscheint das Rad im Editor als flacher Block, damit es die Bearbeitungsleiste nicht verdeckt. Das echte ganzseitige oder Vollbild-Overlay erscheint nur in der Live-Vorschau und auf Ihrer Live-Website — nicht im Editor-Bereich. Das ist so vorgesehen.

Technische Hinweise

• Platzierung und Targeting (wer es sieht, wo und wie oft) werden an der Aktion festgelegt, nicht in der Vorlage. Die Vorlage steuert nur Aussehen und Verhalten des Rads.
• Gewinnchancen nutzen die relativen Gewichte von Win Chance; sie müssen sich nicht zu 100 addieren.
• Die Funktion „Hide After“ nutzt die integrierte Sitzungsunterdrückung von Personyze. Sie registriert die Unterdrückung, ohne das Popup zu schließen, sodass der Besucher sein Ergebnis trotzdem sieht. Die Anzahl der Sitzungen kommt aus der Einstellung Display Frequency der Aktion.
• Beide Layouts teilen sich eine Engine — das Rad wird dynamisch gezeichnet, die Gewinnchancen sind gewichtet, und die Landeposition entspricht immer dem angezeigten Preis.
• Vollbild-Hintergrund: Im Fullscreen-Modus wird die ganze Seite zum Hintergrund (Preset-Farbe oder das gewählte Bild); es gibt keinen Kartenrahmen — Rad und Text liegen direkt auf dem Hintergrund.

Weiterführende Lektüre

• Spin-to-win-Glücksräder — die Mechanik des Rads im Detail.
• Gamification-Marketing — die Mechanik hinter interaktiven Vorlagen und wo sie passen.
• Website-Popup-Vorlagen — alle 16 Vorlagen und wie Sie das richtige Format wählen.