Loyalty Branding
Passe dein Loyalty-Programm visuell an deine Marke an. Farben und Logos erscheinen automatisch an allen Touchpoints der BEEP! App.
Customize your loyalty program visually to match your brand. Colors and logos automatically appear across all BEEP! app touchpoints.
Das Branding-ObjektThe Branding Object
Übergib das branding-Objekt beim Erstellen
oder Aktualisieren deines Programms:
Pass the branding object when creating or
updating your program:
JSON
{
"branding": {
"color": "#8B5CF6",
"logo": "https://yourcdn.com/logo.png",
"cardStyle": "gradient"
}
}
| Parameter | Typ | BeschreibungDescription |
|---|---|---|
color |
string (hex) | Primärfarbe für Karten, Badges und Fortschrittsbalken. Muss ein gültiger Hex-Farbcode sein. Empfehlung: Kontrast ≥ 4.5:1 auf weißem Hintergrund.Primary color for cards, badges, and progress bars. Must be a valid hex color code. Recommendation: Contrast ≥ 4.5:1 on white backgrounds. |
logo |
string (URL) | Logo-URL (PNG oder SVG, mindestens 128×128px). Wird in runden Containern zugeschnitten.Logo URL (PNG or SVG, min 128×128px). Cropped in rounded containers. |
cardStyle |
string | "solid" | "gradient" | "glass" (Stil der
Loyaltykarte im Store-ProfilStyle of the loyalty card
in
the store profile |
Wo Branding angezeigt wirdWhere Branding Appears
| Touchpoint | AnzeigeDisplay |
|---|---|
| Store-Profil | Loyalty-Karte mit Logo, Farbe und Programmtyp-IconLoyalty card with logo, color, and program type icon |
| Scan & Go Check-in | Banner mit Händlerfarbe und ProgrammnameBanner with merchant color and program name |
| Warenkorb | Punkte-Vorschau mit farbigem AkzentPoints preview with colored accent |
| Checkout | Einlöse-Toggle mit HändlerfarbeRedeem toggle with merchant color |
| Receipt | Gutschrift-Karte mit farbigem HeaderCredit card with colored header |
| Angebots-DetailsOffer Detail | Loyalty-Badge mit ProgrammfarbeLoyalty badge with program color |
| Entdecken | ⭐-Badge am Store-Chip wenn Loyalty aktiv⭐ badge on store chip when loyalty active |
| Loyalty-Wallet | Händler-Karte mit Logo, Farbe, FortschrittsbalkenMerchant card with logo, color, progress bar |
| Push-Notifications | Farbiger Akzent in der NotificationColored accent in notification |
Best PracticesBest Practices
Verwende deine Markenfarbe, nicht Schwarz oder Weiß
Use your brand color, not black or white
Lade ein Logo im PNG-Format mit transparentem HintergrundUpload a logo in PNG format with transparent background
Teste die Karte im Sandbox-Modus vor dem Go-Live Test the card in sandbox mode before going live
Verwende keine zu hellen Farben (geringe Lesbarkeit) Don't use very light colors (low readability)
Verwende keine Logos über 500KB (langsames Laden) Don't use logos over 500KB (slow loading)
Lade ein Logo im PNG-Format mit transparentem HintergrundUpload a logo in PNG format with transparent background
Teste die Karte im Sandbox-Modus vor dem Go-Live Test the card in sandbox mode before going live
Verwende keine zu hellen Farben (geringe Lesbarkeit) Don't use very light colors (low readability)
Verwende keine Logos über 500KB (langsames Laden) Don't use logos over 500KB (slow loading)
Du kannst Branding jederzeit über
updateLoyaltyProgram ändern. Änderungen werden sofort in
der App sichtbar.You can change branding anytime via updateLoyaltyProgram. Changes are immediately visible in
the app.