Introduction
This project focused on delivering Lloyds Bank International’s first native mobile banking application across iOS and Android. It was undertaken within a tightly regulated environment, with legacy platforms, fixed delivery timelines, and limited internal design capability.
This work was not an opportunity to deliver a mobile-first redesign or a modernised banking experience.
Context & constraints
Lloyds Bank International operates with a degree of separation from Lloyds Banking Group UK, using different technology stacks and delivery models. While the UK group provided oversight and sign-off on areas such as brand and architecture, it did not directly support implementation, and its existing mobile app could not be reused or extended by Lloyds Bank International.
The organisation had historically delivered digital banking through a desktop-first, responsive web platform designed many years earlier, shaped by legacy security models and regulatory assumptions. There was no established design system, limited reuse of assets, and minimal internal design capability.
Key constraints shaped the work from the outset:
Existing web platform (For visual context)
My Role & responsibility
As Lead Product Designer, I was responsible for:
End-to-end UX and UI design for the mobile banking app.
Designing a full onboarding journey embedded within the app.
Establishing consistent interaction patterns across iOS and Android.
Defining accessibility intent and addressing audit findings at design level.
Supporting launch through App Store and limited marketing assets.
I worked largely independently, collaborating with internal business analysts, product specialists, and engineering teams where technical or historical context was needed.
Users & stakeholders
The primary users were Lloyds Bank International customers, typically aged 50–70, many of whom were retired or semi-retired and managing international finances accumulated through careers abroad.
Secondary stakeholders included:
Internal operations and support teams
Compliance and regulatory reviewers.
Engineering teams responsible for native delivery.
Senior business stakeholders accountable for launch.
The challenge
The original assumption was that a mobile app could be delivered by replicating the existing desktop experience, with minimal design input. In practice, this led to fragmented layouts, inconsistent components, and poor usability once development began.
The real challenge was not designing a better mobile experience, but deciding how to deliver a credible one under conditions where:
Journeys could not be materially changed.
Content could not be rewritten.
Approval cycles were expensive and slow.
The organisation needed something it could support and evolve.
Strategy & approach
Early on, I reframed the objective with stakeholders:
Key design decisions
The direction of this work was shaped by a small number of deliberate decisions made in response to the context and constraints:
1
2
3
4
These decisions established the boundaries within which the work could progress and were revisited throughout delivery as constraints evolved.
More ambitious mobile-first concepts were explored early to test boundaries, but were ultimately rejected due to delivery and approval risk.
Validation
Given time and regulatory constraints, formal discovery was limited. Instead, validation was embedded pragmatically through:
Close review of existing desktop usage patterns and support pain points.
Continuous collaboration with internal project and department experts.
Regular design walkthroughs with engineering to surface feasibility issues early.
Formal accessibility auditing later in the project.
Designing the experience
Information architecture & navigation
The first step was mapping the full feature set and information architecture of the desktop platform, then translating this into a coherent mobile structure. The goal was not simplification, but stabilisation: ensuring that features appeared in predictable locations and followed consistent patterns.
Design & interaction patterns
Early in the project, several core banking interactions and journeys had already been implemented without design oversight.
Similar actions such as viewing balances, initiating transfers, or confirming transactions were presented with inconsistent hierarchy, layout, and interaction behaviour across the app.
This fragmentation increased cognitive effort for users and introduced unnecessary complexity for engineering teams maintaining multiple variations of the same pattern.
I consolidated these into a small number of repeatable patterns that could be applied consistently across features and platforms, improving predictability for users and reducing implementation ambiguity.
Design scope & coverage
Assets & icons
Due to the inability to reuse Lloyds Banking Group iconography or extract assets from the legacy platform, I introduced Font Awesome as an interim icon system. This was chosen for its developer familiarity, clear documentation, broad coverage, and ease of future replacement.
Accessibility audit
The app was audited against WCAG 2.1 by the Digital Accessibility Centre. Findings fell into two categories:
Design-level issues
Labels, affordances, error clarity, focus intent were resolved directly in the designs.
Implementation-level requirements
ARIA roles and screen reader announcements were documented as accessibility intent through annotations and acceptance criteria.
This separation ensured clarity of responsibility while maintaining accessibility outcomes.
Final outputs
Within the constraints, the project delivered:
End-to-end UX and UI designs for the native mobile banking app.
A complete onboarding journey embedded within the app.
iOS and Android alignment.
App Store launch assets.
Supporting marketing materials for go-live.
The onboarding experience itself was largely predefined by the client; design effort focused on improving usability within that structure.
