Lloyds Bank
I designed a mobile Product Detail Page (PDP) for an active Motor Insurance policy within the Lloyds Bank app. The goal was to help customers quickly understand their cover, access key actions, and feel supported during stressful moments, especially when making a claim.
UX/UI Designer
Figma and Adobe Creative Suite
The Challenge
Motor insurance screens are usually visited during uncertainty or stress.
The experience needed to:
Reassure customers about their policy
Make urgent actions extremely obvious
Keep complex information readable and manageable
Fit naturally into Lloyds’ existing mobile patterns
Approach
I designed the PDP as a service-first experience, grounded in clarity, calmness, and familiarity.
The structure answers three simple user questions:
What’s my situation? (policy summary card)
What can I do? (action buttons + modals)
What am I covered for? (cover details, excesses, support)
I used Lloyds’ design language, monochrome base, bright green accents, rounded cards — to create a trustworthy and consistent UI.
Solution Highlights
Summary Card
Key details at a glance: vehicle, policy status, renewal date, cover type, and NCD.
Action Section
Primary: Make a claim
Secondary: View documents, update details, get help.
Each secondary action opens a modal, keeping users anchored in the PDP.
Detailed Cover & Support
Tabs for Cover, Excess & Limits, and Support.
Expandable accordions reduce cognitive load.
Clear emphasis on total excess and emergency support.
Claim Flow
Designed a guided 6-step claim journey with a stepper, simple questions, review screen, and confirmation.
Scalability
The layout is product-agnostic.
The same framework — Summary → Actions → Details → Support — can be applied across:
Investments
Pensions
Home insurance
Loans / credit products
And the components (cards, tabs, accordions, modals) are fully reusable across Lloyds’ ecosystem.
Process
Discover: Reviewed Lloyds app, studied competitor insurance flows, identified customer needs.
Define: Prioritised reassurance, clarity, fast access to actions.
Develop: Explored layouts, built components, designed claim flow, prototyped interactions.
Deliver: High-fidelity screens, Auto Layout, variants, full prototype, and a live coded demo.
Outcome
A clear, supportive, and action-first PDP that:
Helps customers feel confident in urgent moments
Makes claims and documents easy to find
Scales seamlessly to other Lloyds products
Aligns with brand and accessibility standards