design ideas · memphis × maximalist

The whole
kuppo screen library.

A loyalty-card app concept with strong brand presence: scattered Memphis-80s geometry, brutalist offset shadows, oversized type, and a warm mustard / orange / aubergine palette pulled from the Hungarian café context.

27 screens covering the full app — public & auth, customer flow, merchant scan, dashboard tabs, dialogs, drawers, and global utilities. Coupons and admin views deliberately out of scope.

Customer core flow

4 screens
listing → detail → redeem · unlocked
C·1

Listing

Home screen. Redeemable rewards on top, then cards grouped by merchant. Per-merchant accent chips, "közel" pill for near-reward cards, dashed-border ghost CTA.

C·2

Card detail

Single-card view. Mustard hero with stamp grid, distance-to-reward copy, stripped-down history log.

C·3

Redeem

Show-at-counter. Hand-built QR in brand ink, reward title, merchant chip, code + expiry. Restrained Memphis at the corners.

C·4

Unlocked!

Celebration. Whole phone goes mustard, max scatter, oversized "MEGVAN!" headline, mini filled-card preview.

Public & auth

6 screens
entry points + edges
A·1

Login

OAuth providers (Google / Facebook / GitHub) + email fallback for test mode. Hungarian-first, with a footer pointing to ÁSZF + Adatkezelés.

A·2

Auth callback

OAuth redirect splash. Branded loader with orbiting brutalist pips and a pulsing brand dot — the only "official" loading moment.

A·3

Join merchant

QR landing. Big merchant card on top, list of active campaigns with reward summary, single mustard Csatlakozom CTA.

A·4

Token redeem

Short-link campaign invite. Token chip, single campaign card, three "what you get" perks, one-tap accept.

A·5

Policy doc

Markdown reader for ÁSZF / Adatkezelés. Sticky header with HU/EN toggle, numbered sections, callouts, sticky accept footer.

A·6

404

Playful not-found. Crossed-out stamp card illustration, oversized 4·0·4 with a violet rotated "0", primary back-to-home + scan CTAs.

Merchant scan flow

2 screens
scan → act on cards
M·1

QR scanner

Full-screen camera. Brutalist mustard reticle with corner brackets, animated orange scan beam, sticker accents, flash + camera-flip controls.

M·2

Add points

After scanning a customer QR. Two-section layout: green Ready-to-Redeem on top, blue Add-Points below. Per-card action buttons.

Merchant dashboard

2 screens
tab-bar navigation
D·1

Campaigns tab

Active campaigns grid with per-card stats and 4-action footer (QR / edit / push / delete). Stat strip up top, dashed "new campaign" CTA below.

D·2

Customers tab

Searchable enrolled-customer list. Mustard rows for "ready to redeem", per-row metadata (cards · last visit), filter chips up top.

Merchant dialogs

4 screens
create · delete · share · push
X·1

Campaign create / edit

Bottom sheet form. Name, reward, emoji picker, colour swatches, ±step points-target picker with live pip preview.

X·2

Delete confirm

Destructive dialog. Rose alert mark, target campaign preview, three-row enrolment warning, type-to-confirm input gate.

X·3

Campaign QR

Shareable join QR. Hand-built ink-coloured code with overlaid emoji badge, URL row + copy, scan/join stats, print + share CTAs.

X·4

Send notification

Compose push. Title + body fields with character counters, target chip, live notification preview on a dark phone-style backdrop.

Insight drawers

3 screens
customer + analytics
R·1

Customer detail

Per-customer profile. Ink top band, quick stats strip, 16-week activity heatmap, recent-event log with type-coded icons.

R·2

Campaign analytics

Single-campaign deep dive. Mustard top band, headline metric with delta, dual-line activity sparkline, top-day bars, conversion funnel.

R·3

Overall analytics

Merchant-wide overview. Aubergine top band, 4-tile KPI grid, daily-bars + trend line, top-campaigns ranking, hour×day traffic heatmap.

Global utilities

5 screens
settings · gates · upgrade
G·1

Settings drawer

Right-side drawer. Profile card on top, grouped settings rows with toggles + lang chip-group, danger row for account deletion.

G·2

Delete account

Centered confirm dialog with 4-item loss preview, optional reason chips, type-to-confirm input. Mustard "stay" button = positive default.

G·3

Upgrade

Pro plan paywall. Bottom sheet with hero, monthly/yearly toggle, ink price card with 5-perk list, mustard "switch to Pro" CTA.

G·4

Policy consent

First-run gate. ÁSZF + Adatkezelés tiles, two required checkbox rows, two optional opt-ins (push / email), accept / decline pair.

G·5

Age gate

Centered confirm with oversized 16+ badge, three-cell DOB picker, computed-age summary chip, leave / confirm pair.