Case Study

Backbase · UX Designer · 2019-2021

B2B2C | Product-adoption

Integrating authentication: Making the product line a core platform offering

TL:DR

  • 0 > 1 Product launched

  • ARR targets met (consistently)

  • Platform adoption

  • Mobile-first design experience

My role in the project:

  • Market analysis
    Research and insights
    Cross-functional workshop facilitation
    MVP design and validation
    MMP scoping and definition
    Iterative product development

  • Miro
    Figma
    Design-System
    UserTesting.com

    • Sales colleagues to understand market needs

    • Discovery interviews with banks and users to understand product needs and expectations

    • Lead Product Managers to define scoping

    • Product and Engineering for design alignment via ‘Three-Amigo-Sessions’

    • Usability testing with end-users

The Challenge

The absence of an integrated authentication layer in Backbase's current platform meant the 'Identity' product was frequently positioned against external third-party solutions during the sales process.

The Reality

The Identity product fell short of feature parity with competitors, making it a weaker offering in the market.

The Goal

Backbase urgently needed to rapidly address these feature gaps, with the most critical missing piece being a mature offering for app instances.

Go-to-market approach

What would an effective market offering look like?

Understanding…

To gauge current perceptions and define future requirements, I—alongside the Product Manager—held informal sessions with sales staff, customer-project-teams and key customers.

Findings…

  • To accelerate current project development and allow for greater customisation, customer project teams utilised an existing Software Development Kit (SDK).

  • While allowing customers to log in using their existing customer number and password was the fastest route to market, a device-registration journey that would allow users to set up biometric authentication methods was identified as the ideal path for meeting user expectations.

Understanding user needs

What does ‘safe internet banking’ look like to users?

Championing user-research…

I successfully challenged the product's initial speed-to-market strategy—which favored rapid UI development over the foundational SDK—to prioritize deep user insights. Lacking the internal resources, I proactively negotiated a shared resource agreement with the Retail Banking team, positioning the study as a mutually beneficial, long-term investment.

These research activities were pivotal in highlighting my strategic thinking as key product stakeholder.

Research in action…

After successfully advocating for the initiative, I partnered with a user researcher to design a comprehensive plan. The research, which utilised discovery interviews, card sorting, and usability tests, aimed to uncover how users view and value their online banking security.

Key finding #1

Biometrics are not universally trusted by users, who often prefer the perceived control of PIN-based authentication.

Key finding #2

Users prefer to create their own identifiers rather than relying on bank-generated customer ID numbers, which they view as a potential vulnerability.

Key finding #3

Users feel more secure and engage with biometric setup if the benefits are clearly communicated to them.

Defining the product-play

How can the right value be delivered within the right timeline?

Planning the work...

Armed with these insights, my clear opinion was that the key value lay in building the device-registration flow concurrently with the login flow for existing customers. The critical decision for my product colleagues was then determining how quickly and effectively this dual-flow vision could be brought to market.

Understanding the roadmapped vision…

With the near-term work defined, it became vital to understand the functionality planned for the next iteration. Developing a 6-to-12-month roadmap view ensured that my current design decisions were holistic and considerate of future functionality additions.

Understanding

Where did the need for experience touchpoint(s) exist?

Design planning…

With the MVP product plan for device management agreed on, I dove into understanding the SDK. My focus was to map the user interaction journey, identify opportunities for enhancement, and pinpoint the necessary UI touch-points.

Predominantly system requests…

Since the journey's purpose was to trigger authentication requests or challenges, I had to determine how and when a user could initiate these actions in a manner that didn’t add unnecessary friction to the user.

Challenge #1

Softening the system’s logic

Experience testing…

Collaborating with a full-stack developer, I gained direct exposure to the authentication challenges, clarifying how the underlying logic translated to user interactions. Specifically, this helped map the transition from a failed biometric attempt to a PIN code fallback entry.

Issue…

It was found that the flow forced users to reject the FaceID biometric prompt twice before offering a fallback. Only then could they set up a PIN—which was mandatory regardless. This overly rigid, "logic-led" process created significant, unnecessary friction, which became my primary focus to resolve.

Solutions…

To eliminate this unwanted friction, I presented the team with two options, both centered on making the FaceID capture optional.

  1. Option A: Passcode First - Present the mandatory passcode capture as the primary step, followed by the optional FaceID challenge.

  2. Option B: FaceID First - Present the optional FaceID challenge first, preceding the mandatory passcode capture.

Either way, the final experience must enable banks to resurface the FaceID prompt at a later point, particularly in high-risk scenarios or when it significantly enhances the user's perception of security.

Testing…

Testing of a lean prototype confirmed that a majority of users were reluctant to set up Face ID when the UI lacked clear context or explanation of the benefits. Therefore, providing a 'skip' option for biometric setup would prove beneficial.

Decision(s)…

  1. It was agreed that users can skip the initial Face ID challenge and instead fall back to creating a passcode.

  2. Re-surfacing the Face ID challenge within the app experience will be handled as needed for individual customer projects. This temporary approach will be used until the future, roadmapped 'User Profile' feature is completed.

Challenge #2

Tone-of-voice and brand expression

First impressions count…

Because the Backbase product suite did not include an account origination feature, the device registration flow was the user's initial exposure to the product and the bank's brand experience.

Collaboration and alignment…

In partnership with the brand and product-showcase teams, I defined a set of foundational design themes for the retail, business, and corporate product categories that I could then leverage to drive the distinct visual approach for the device-registration flow.

Filling a gap…

In the absence of a copy expert, I led a collaborative effort with the brand and product-showcase teams to decipher existing materials and establish clear tone-of-voice guidelines.

For the device-registration journey, I developed the theme: 'provide reassurance through a guiding, human tone.’

Challenge #3

Design system gaps

Buttons…

Existing authentication triggers were functionally adequate but lacked the customisation options necessary for banks to effectively express their brand. I redesigned these dedicated login and authentication components to unlock greater brand expression, resulting in user tests that found them to be 'more engaging.’

Passcode entry…

Although a reduced-size field component could serve as a one-character entry field, this approach introduced significant usability and security concerns. I designed a new, dedicated passcode component and keyboard that eliminated these issues while aligning with common market standards.

Design-handover

Supporting the development sprints

Low-level, detail-designing…

Given the technical complexity of the authentication product, design handovers inevitably contained minor, unaddressed edge cases. Fortunately, these were typically non-critical issues, and the rigorous QA testing process successfully identified and contained them without impacting the core design integrity.

Understanding test scenarios…

Upon shifting my focus to app design, I collaborated closely with the QA team to understand typical failure points and test scenarios. This knowledge enabled me to proactively design for known pitfalls, ensuring my final deliverables were more robust and less likely to incur similar issues in the future.

Tested approach…

I tested iOS/Android system alerts against full-screen errors in authentication flows via Figma prototypes. The goal was to determine if a dedicated, contextual error would align better with global error-patterns and improve the experience given the high volume of existing system alerts.

The results showed users preferred the full-screen error, valuing the added context and resolution steps for ‘blocker error-scenarios’, but system alerts for ‘more minor’ and ‘errors with a quick resolution’.

Shipped

What value was delivered and what came next?

Results and impact…

Over time the product became a foundational platform offering, but on launch it delivered the following value:

  • Full project adoption:
    It replaced all existing custom-coded instances across relevant projects

  • Time-to-Market Acceleration:
    Reduced time-to-market costs by 80%

  • Revenue Impact:
    Secured over $20 million in Annual Recurring Revenue (ARR)

What came next…

Long before the functionality made it to market, my focus turned to some of the following roadmapped items:

  • Biometric and identity self-serve:

    User Profile management functionality, encompassing configuration of biometric preferences and updating of personal contact information.

  • In-app experiences:

    Transaction-signing experiences to secure high-risk actions

Moments of pride:

  • Although the SDK was functionally ready for a quick 'skin-up' and release, I recogniszed the critical need for user validation. By successfully convincing product stakeholders to prioritise and fund user research into the design process, I demonstrated my value as a design practitioner and earned their trust in my strategic judgment.

  • This initial project marked the start of a highly productive and successful phase for the Identity product-line. We delivered and shipped crucial functionality with speed and efficiency, making the team's transition into a core platform offering a rewarding validation of our hard work.

  • My initial app-first design project was a key career milestone, culminating in my development as an expert in authentication patterns alongside mastery of both Apple’s Human Interface Guidelines (HIG) and Google’s Material Design standards.

  • Following the development of the comprehensive Identity app roadmap, the expanded scope of work surpassed the capacity of a single designer covering both web and mobile platforms. This opened up a clear business-need for additional dedicated design resource.