Digitizing the B2B Banking UX

2021 iOS Android Desktop

As a UX/UI designer in the Kazakhstan branch of Alfa Bank (an international finance company), I worked within a cross-functional product team to redesign core B2B banking applications. The main goal was to digitize high-friction manual routines — such as payments, document requests, and bank statements — into a seamless, cross-platform ecosystem.

Domain FinTech, B2B Banking, SaaS
Alfa Bank B2B apps across laptop and mobile

Understanding the User (Research)

Who am I designing for?

In B2B banking, the primary user isn't an abstract customer — it's an accountant. To deeply understand their daily routine for each major feature (payments, documents, statements, signing, etc.), I conducted 8–10 in-depth interviews. Based on these insights, I created an Empathy Card to map exactly what an accountant thinks, feels, sees, and fears when dealing with financial operations.

Mapping the Friction (CJM)

To identify where accountants were struggling the most, I built an "As-Is" Customer Journey Map in the given user path. It highlighted the pain points in the old legacy system. Then, I designed the "To-Be" CJM to show how the user's path and emotional reactions would improve once we introduced our new digital solutions.

Accountant empathy card
As-Is Customer Journey Map
Detailed journey table
Pain points and opportunities

Building the Foundation

Migrating to a Scalable Architecture

Before rolling out new features, we needed a robust foundation. Alfa Bank had a centralized design system, but it was stuck in Sketch. I took the initiative to migrate the entire library to Figma (iOS, Android, Desktop), building a brand-new UI kit from scratch with strict auto-layout logic and defined component tokens.

Bridging Design and Code

This wasn't just a visual upgrade. By aligning our Figma components directly with the developers' codebase, we achieved absolute consistency between design and front-end implementation across all platforms (Web, iOS, Android).

Impact

Team #1 in Kazakhstan

to establish this level of seamless design-to-code synchronization

As a direct result, we drastically reduced design debt, eliminated back-and-forth friction during developer handoff, and significantly accelerated our overall time-to-market for new features.

Alfa Bank design system and UI kit

Redesigning Core Products — Tenge Payments

The Challenge

Generating official banking statements is an unavoidable daily routine for corporate accountants. Previously, this process was extremely rigid — users either struggled with clunky legacy web tables or were forced to physically visit a bank branch to request official documents, wasting hours of productive business time.

The Solution

I designed a seamless, cross-platform statement generation feature (Web, iOS, Android). Based on our user interviews, I introduced a highly readable table view specifically optimized for heavy financial data. I also added robust, intuitive filtering options (by date, currency, and account type) and an instant export/download function.

The Outcome

−40% reduction

in Task Completion Time

During UX laboratory testing, users navigated the new flow almost twice as fast compared to the legacy system.

88% success rate

in Error-Free interaction

Proving that the new interaction design drastically reduced cognitive load and prevented critical user mistakes.

Tenge payments on mobile
Statements view on desktop

The Game Changer — Digital Banking Statements

The Challenge

Generating and downloading official banking statements is a critical daily task for corporate accountants. Previously, this process was heavily reliant on offline operations — clients had to physically visit a bank branch just to get their document services handled.

The Solution

I designed a brand-new, end-to-end digital statement feature accessible across all devices (Desktop, iOS, Android). Following rounds of user interviews, I introduced a highly readable table view optimized for heavy financial data, complete with robust filtering options (by date, currency, and account type).

The Outcome

95% Drop

in Physical Branch Visits

By successfully digitizing this core administrative routine, we practically eliminated the need for offline visits for statement services.

Digital statements on desktop
Digital statements on mobile

Learnings & Reflections

A Masterclass in Product Thinking

This project was a foundational milestone in my career. It shifted my mindset from purely visual UI design to deep, strategic product thinking. I learned that my primary job isn't to draw screens, but to solve real business problems and eliminate friction for the user.

Mastering Complex B2B Domains

Designing for B2B FinTech taught me what it truly means to "design for money." When designing for corporate accountants, accuracy, clarity, and trust matter infinitely more than trendy visuals. A single usability flaw can disrupt a company's operations, which taught me to design with extreme responsibility and rely heavily on testing.

Next Case

arrow
Aleumet — Inclusive App in HealthCare

Inclusive App in HealthCare

GovTech Accessibility & WCAG Design For Multi Roles