Business Context
Illimity is a digital-native Italian bank that launched in 2019. Despite being a new bank, their customer-facing portal was built on a legacy Java-rendered frontend — a decision made during the rush to launch. As the bank grew to 100,000+ customers, the frontend became a bottleneck: slow rendering, poor mobile experience, and every feature change required coordination between frontend and Java backend teams. The Italian banking regulator (Banca d'Italia) had also tightened accessibility requirements, and the existing frontend couldn't meet WCAG 2.1 AA standards.
Technical Challenge
Migrate the customer portal from server-rendered Java templates to a modern React SPA while maintaining full banking functionality throughout the transition — no downtime, no feature freezes. The complexity came from three fronts: intricate multi-step form flows (KYC onboarding with document upload, identity verification, risk profiling), real-time account data (balances, transactions, investment positions), and strict regulatory compliance (PSD2 strong authentication, GDPR data handling, Italian banking accessibility mandates). I led a team of 6 developers.
Approach & Decisions
I designed a strangler fig migration pattern: the React SPA ran alongside the legacy Java frontend, progressively taking over routes. Each migrated section went through a parallel-run phase where both old and new rendered simultaneously in staging, with automated visual regression tests catching discrepancies. For the complex KYC flow, I built a state machine using XState that modeled every step, validation, and error recovery path. This made the 12-step onboarding flow testable in isolation — we could verify every edge case without touching the banking APIs. For accessibility, I implemented a component-level audit process: every new component had to pass axe-core checks in CI before merging, and I conducted manual screen reader testing with NVDA and VoiceOver for critical banking flows.
Outcomes
Registration conversion increased 40%, first contentful paint improved by 35%, and accessibility score jumped 20 points. The migration completed without a single minute of customer-facing downtime. The XState-based KYC flow reduced onboarding drop-off by 28% because error recovery was now graceful instead of forcing users to restart.
System Design
Key Technical Decisions
Migration Strategy
Strangler fig pattern with parallel-run validation
Big-bang rewrite, Feature-flag gradual rollout
A big-bang rewrite was too risky for a regulated bank — any regression could trigger regulatory scrutiny. The strangler fig let us migrate route-by-route with automated validation, and we could instantly roll back any route to the legacy version.
KYC Flow State Management
XState finite state machine
Redux with step tracking, React context with useReducer
The KYC flow had 12 steps with conditional branching, timeout handling, and error recovery. Redux would have required complex middleware for the async flows. XState made every state transition explicit and testable, and the generated state chart served as living documentation for the compliance team.
Accessibility Testing Strategy
Automated axe-core in CI + manual screen reader testing for critical flows
Automated-only testing, Third-party accessibility audit
Automated tools catch ~30% of accessibility issues. For a banking app where screen reader users need to manage money, automated checks were the minimum. Manual testing with NVDA and VoiceOver on the top 5 user flows caught issues that no automated tool would find (focus management in modals, live region announcements for balance updates).
Before & After
KYC Onboarding Completion Rate
52% completion rate with users dropping off at document upload and identity verification steps, forced to restart on any error.
80% completion rate with XState-managed error recovery allowing users to resume from the exact step where they left off.
Page Rendering Performance
Server-rendered Java templates with 3.2s first contentful paint and full page reloads on navigation.
React SPA with 2.1s first contentful paint and instant client-side navigation.
Want results like these
for your product?
Let's collaborate to build fast, accessible, and high-converting digital experiences that drive real business impact.
Let's Talk
Currently available for select consulting engagements and full-time roles.