💳 This Case Study focuses on Payments.
🧠 This Case Study uses is AI: For corrective grammatical tasks, to verify facts and collaborate Journey Mapping insights.
🔒 Details are protected by NDAs – Customer outputs have been disguised, although UX Best Practices remains.
My E2E Design Process
ENTERPRISE
automny
🚀 From Discovery to Design and Solution.
01 – Problem Statement: Create a user-friendly and simplified mobile journey that helps seniors mitigate their fraud anxiety, meet financial regulatory standards and ultimately manage their finances to make informed financial decisions within the ecosystem of UK Payments (i.e. improve their financial wellness).
02 – Segmentation: Identify distinct segments within the “aging parent” demographic (e.g., healthy retirees, chronic conditions, single parents). Target a segment that can most benefit from a mobile journey, particularly the UK Payment process.
03 – Research & Strategy: Use quantitative data with qualitative insights to inform Customer Journey Map: by visualising the financial and emotional challenges faced by each segment, across a given scenario.
04 – Wire framing Design Decisions: Making trade-offs and delivering a justified UX solution.
05 – Conclusion & Outcomes – Key takeouts on why this case study successfully translated a complex real-world business problem into an initiative UX wireframe and Final UI flow.
Problem & Challenge
01.01
COMPLEX
Regulatory
The senior user group face significant barriers to mobile adoption and task completion, especially for the complexities of a Payment flow.
Obstacles identified are fear of fraud, high cognitive load, and digital literacy gaps.
The design challenge is to create a simplified, intuitive user experience while simultaneously incorporating the robust security and multi-step processes required to meet stringent regulatory standards.
Current flows result in high transaction abandonment and increased financial stress for seniors.
Designing a low-anxiety mobile payment flow for seniors
01.02
financial Fears
- Map out a diverse range of seniors’ on a specific financial journey.
- Identify recurring frustrations, anxieties, and unmet needs to form themes.
- Using an appropriate Design System executes a learned solution to contribute to solving senior financial wellness through a highly complex task.
My experience consistently highlights that fear of fraud, cognitive load and digital literacy are major barriers to mobile app adoption and successful task completion for seniors. These fears are amplified during critical tasks like payments with multiple cognitive and security demands.
Teams struggle to create a mobile payment flow that simultaneously meets modern security standards (e.g. multi-factor authentication, biometric prompts, Confirmation of Payee) and minimises the cognitive load required by seniors with age-related limitations, leading to high rates of transaction abandonment, locked accounts, and increased financial anxiety.
The business problem and design challenge
01.03
Robust
Multi Step
Unclear Alerts
Balancing the need for a simplified flow, with the need for a robust, secure multi-step flow – required to mitigate fraud anxiety and meet industry standards – is the biggest challenge.
- Simplify complex tasks
- Prioritises key information
- Offers context-sensitive, proactive (not crisis-driven) support tools
- Respect their independence while safeguarding them from fraud
Pain points: Unintuitive interfaces, difficulty with small text/controls, fear of scams/fraud, loss of control, and lack of consistent support for money management capacity, unclear fraud alerts, and difficulties with two-factor or biometric authentication.
👉 Complex flows increase the cognitive load.
Segmentation
PERSONAS
🧠 These Personas use AI: To qualify primary and personal experience, to generate profile photography and clarify vocabulary.
Tech-Savvy
02.01
Retired professor of English Literature.
“I’m not afraid of technology, but I want it to be simple and intuitive. I shouldn’t have to read a manual to figure out how to use something basic.”
Tech-Wary
02.02
Retired accountant.
“I’m old-fashioned. I don’t need all these fancy gadgets. I get by just fine with what I have.”
High-Net-Worth
02.03
Focus: User-friendly interface, advanced features like budgeting tools, investment tracking, and retirement planning calculators.
Caregiver-Dependent
02.04
Focus: Features that enable family members or caregivers to assist with financial management, such as shared access, bill pay assistance, and alerts for suspicious activity.
Single-Senior
02.05
Characteristics: May face unique financial challenges such as navigating retirement income on a single income, planning for long-term care, and estate planning
“Sandwich Generation”
02.06
Characteristics: Still providing financial support to adult children while managing their own retirement needs.
Key consideration themes from personas:
- Accessibility: Visual impairments, cognitive decline, and physical limitations. i.e larger fonts, high-contrast colours, and voice-activated controls.
- Personalisation: Adapt to individual needs and preferences.
- Security: Prioritise security and privacy, protecting seniors’ sensitive financial information. i.e. reduce anxiety
- Promote financial wellness and stress management: Offer tools and resources to help the Sandwich Generation manage stress and prioritise their own financial well-being.
Research & Strategy
Journey Mapping User Profile
03.01
Explore the specific scenario for a Tech-Wary senior, with a lack of support, and simple banking needs:
Journey Mapping Scenario: She receives a paper bill in the mail. She has a basic current account with a local bank branch, but prefers to handle her finances in person. However, the nearest branch is now closed, and she has limited access to reliable internet and a basic smartphone.
- Lack of digital literacy: Mrs. Davies may be unfamiliar with online banking, mobile banking apps, or digital payment methods.
- Limited technological access: She lacks reliable internet access and owns a basic smartphone, restricting her ability to utilise digital banking channels.
- Reduced physical branch access: The closure of her local branch removes her preferred method of banking and increases her reliance on alternative channels.
- Lack of support: Mrs. Davies may not have family or friends who can assist her with online banking or other digital tasks
Journey Map
03.02
Make a payment
Cognitive decline, reduced steps and fraud anxiety.
Design Decisions
Making trade-offs and delivering a justified UX solution.
04.01
Peronalisation
Agile mindset
Make a Payment
UX designers are re-writing their playbook when creating the UK Payment digital experiences. Using native mobile patterns that provide a white glove experience, reacting to task-orientated user needs.
1. The Accessibility-First Mindset
Inclusive Design from the Start: Not just meeting legal standards incl. WCAG, but ensuring it’s a shared team responsibility to implement descriptive alt text for images and proper and strong visual cues (colour, icons, etc, etc) for assistive technologies.
2. ‘Hand-Holding’ experience
Mobile patterns are evolving, to provide a “hand-holding” experience, guiding users through their tasks with minimal friction, Personalisation and Progressive Disclosure all reduce the cognitive load.
3. Task-Oriented Patterns
The goal is to help users complete their objectives as efficiently and effortlessly as possible. Push-back on nice-to-haves
The ‘Make a Payment’ Journey simplified
04.02
business logic
data
From 13-Steps;
- Start – Presenting the primary task. Establish task focus.
- Select payment type – Define the transaction context to enable contextual filtering.
- To > From – Source and destination mapping.
- Existing or New Beneficiary – Slightly prioritise recall (existing payee) over data entry (new payee) to reduce user effort.
- Confirmations of Payee – Critical security check. Provides reassurance.
- Payment details – Ensure the payment’s purpose is accurately communicated.
- [Optional] Select currency – Presented only when relevant
- [Optional] International payment – Trigger specialised fields and disclosures, only when the system detects an international need.
- [Optional] Fees – Ensure transparency by proactively disclosing all costs at the point of decision, building user trust.
- Scheduled – For future payments as a secondary payment path.
- Fraud Warnings – UX mechanism to initiate a Reason for payment.
- Review – Single-screen summary allowing the user to execute the F-pattern check.
- Authorisation – A strong authentication layer (e.g., biometric, PIN) to prevent fraud.
To 4-steps;
- The What – Initiation and Context
- The Who – Beneficiary and Destination
- How Much – Transaction Details and Customisation
- The Final Check – Execution Preparation
Wire Framing Design Decisions
04.03
From 13 > 4
Wireframes opportunities
One Primary Action Per Screen
04.05
DEVELOPMENT ALIGNMENT
To avoid overwhelming the user, the design is limited for each screen to have a single, clear primary action only. This approach reduces cognitive load and facilitates independent development.
Input field with dual functionality
04.05
DUAL FUNCTIONLITY
While active, focused and error states are expected these components should be default for both Existing Beneficiary and New Beneficiary reducing two mini journeys to one i.e. no read-only state for Existing Beneficiary.
Realising the final UI
04.05
SNEAK PREVIEW
From defining a real-world business problem, in one of the most complex ‘Make a payment’ journeys, I was able to use UX tools to uncover pain points and leverage touch points to inform an initiative UX wireframe flow that in turn informed the final UI.
Transfer to
To identify the destination of the funds.
Payments Details
To specify the transaction parameters: primarily the amount to and from, the date, source account, and other dynamic information.
Review
Primarily visual inspection of a summary screen. User interaction is minimal, usually a Confirm or Back button.
Conclusion & Outcomes
This case study successfully translated a complex real-world business problem into an initiative UX wireframe and Final UI flow.
By using research and design tools to uncover and address critical pain points, designing an end-to-end E2E ‘Make a Payment’ journey with feature parity, respect to development needs and native and familiar patterns integration within a comprehensive Design System, and finally balancing security standards with essential user simplicity.
05.01
Enterprise UX UI
Delivered in 3 Mths
- Key stakeholders audience established 2-months before proposed Sprint through workshopping and client relationships.
- Pain points highlighted early, including CoP, Secondary payment reference and scope (i.e Feed and FX was descoped)
- Cross platform UX and UI for Alpha release delivered and demo’d in 3-months
- Developer and BA handover scheduled early for estimation and to provide clarity
- Design System integrated for customer review and UX Copy Check sign-off
- No deadline missed in 3 months
Leave a Reply