Authentication Screen Designer for Banks
Role
UX Designer (Solo)
Organization
Broadcom (CA Technologies)
Duration
3 months
87%
Deployment Time Reduction
16 - 23 weeks → 2 - 3 weeks
Design to production
3 Banks
Validated with directly
WCAG 2.1 Level AA
Compliance built in
The Problem
Banks using the Arcot for Issuers platform needed custom-branded authentication screens for e-commerce transactions. The existing process required a full services engagement — months of back-and-forth between bank staff, project managers, and developers.
"Banks needed to comply with EMV 3DS requirements quickly. A 4–6 month process for every branding change wasn't sustainable."
Before - Manual Service Engagement
- CAP screen UI mock-ups (3–4 weeks)
- Implementation of mock-ups (8–12 weeks)
- Bank review of implemented screens (1 week)
- Deploy to QA/staging for testing (3–4 weeks)
- Review test results (1 week)
- Publish to production & monitor (1 week)
Total: 16–23 weeks
After - Authentication Screen Designer
- Bank designs screens in WYSIWYG editor
- Live preview — portrait/landscape/dark mode
- Zone-based branding configuration
- Multi-language content management
- Review & confirm before download
- Deploy directly to production
Total: 2–3 weeks
Solution
A WYSIWYG editor that puts banks in full control of their authentication screens — from initial design to production deployment — without needing a services team.
Design Decision
THE CORE DESIGN CHALLENGE
Banks need full control of their brand on challenge screens — fonts, colours, logos, copy, languages — while staying within strict EMV 3DS compliance boundaries. The editor had to make complex configuration feel simple without hiding the power that banks' technical teams needed.
Solution: Zone-based architecture. Four zones (Header, Branding, Challenge, Information) each independently configurable, with a live preview that updates in real time. Compliance guardrails are built into the constraints — banks can't accidentally break EMV 3DS requirements.
Designing for the Full Journey
Authentication isn't a single screen — it's a branching flow. The Journey Map gives banks a visual overview of all screens in sequence before they begin configuration, so they understand what they're building before touching a single setting.
Key Features
The editor covers every dimension of bank customisation within compliance boundaries.
Review & Deploy
Before deployment, banks confirm branding and content via a structured review checklist — reducing errors that previously required expensive re-deployments.
Impact
16-23 weeks → 2-3 weeks
Design to production deployment
87% reduction in deployment time
Freeing services teams for higher-value work
3 major banks validated directly
In-person session held in France
WCAG 2.1 AA compliant by default
Accessibility built into every template
If I revisited this
The zone model works well but the styling section still requires technical knowledge to configure correctly. I'd want to add smart defaults per card network — so a bank starting from scratch gets a compliant, on-brand baseline immediately rather than a blank slate. I'd also measure time-on-task per section to identify where banks get stuck.
Selected Works
