Payter Redesign Preview · Internal

Four design options for the new payter.com.

All four use the same Apollo X positioning, the same 13 industries, the same FAQ answers, the same configurator wizard, and the same Alex chat bubble. Only the look, layout, and tone change.

v1 · paper editorial
Bold & editorial
Magazine-style paper layout. Big hardware photography on plain backgrounds. Reference: Teenage Engineering + Arc.
Open →
v2 · stripe + multi-audience
Product-led SaaS
Stripe-style gradient hero. OEMs / Operators / Integrators visible above the fold. Sectioned dropdowns. Reference: Stripe + Apple.
Open →
v3 · payter blue · technical
Industrial & engineering
White surface, technical callouts on the hero product, monospace spec labels. Reference: Apple Pro Display XDR + Framework.
Open →
v4 · cream · pop accents
Bright pop
Warm cream surface, pastel industry blocks, rounded everything, Payter blue + cyan accents. Reference: Plaid + Cash App.
Open →
Tip: every variant has the same three pages — homepage, /faq (the same FAQ questions, with live search), and /configurator (the existing wizard that emails sales@payter.nl). Each page links to MyPayter, the Documentation portal, and the Terminal Registration form. Alex chat bubble lives bottom-right on every page.

Technical reference

Context on what each variant is built with and the surrounding options. Informational — no decisions implied.

Hosting

Bitbucket + Google Cloud

Each variant is a Next.js 16 application exported as a static site (pure HTML / CSS / JS, no server runtime), deployed to Google Cloud.

  • Google Cloud Run — same stack as the existing payter-faq-chatbot
  • Bitbucket Pipelines for CI/CD — OIDC auth, no stored keys
  • Cloud Storage + CDN alternative — pure static hosting
  • Region: europe-west4
Security profile

What the codebase exposes

The variants have no backend, no API routes, no forms collecting personal data, no stored secrets. The configurator emails via the user's own mail client; the Alex bubble is a visual mock until chat.payter.com is wired in.

  • HTTPS + HSTS standard on every modern host
  • Content Security Policy header recommended (header-only setup)
  • WAF / DDoS shielding via Cloud Armor
  • Static-export mode means zero server runtime to attack
Measurement options

Analytics that fit

Three approaches, each GDPR-compatible, mutually compatible:

  • Plausible — cookieless page-level traffic, no consent banner needed
  • Microsoft Clarity — heatmaps + anonymised session replay, free
  • Google Analytics 4 — richer funnels, requires consent banner

No PII collected by default. No chat transcripts logged. Add-ons of either tool are per-site and switchable.