Hargreaves Lansdown
UX Design
Hargreaves Lansdown recognised significant accessibility gaps in their digital financial platforms, with existing interfaces creating barriers for users with diverse abilities. The technology team needed a comprehensive solution that would address usability challenges while maintaining brand consistency and development efficiency.
S
Situation
Hargreaves Lansdown recognised significant accessibility gaps in their digital financial platforms, with existing interfaces creating barriers for users with diverse abilities. The technology team needed a comprehensive solution that would address usability challenges while maintaining brand consistency and development efficiency.
T
Task
Develop a design system that: • Ensures full WCAG accessibility compliance • Creates a unified design language across web and mobile platforms • Reduces development complexity • Improves user experience for all users, including those with temporary or permanent disabilities • Enables rapid, consistent component development
A
Action
• Implemented a cross-functional approach involving design, development, and UX teams • Created a React-based component library with built-in accessibility features • Developed a three-stage review process: design, brand alignment, and technical validation • Introduced specialized components like the Field Text input with screen reader support • Established team-wide accessibility training and workshops • Integrated ARIA attributes and semantic HTML into core components • Conducted extensive user testing across different ability spectrums
R
Result
• Reduced component development time by 40% • Achieved WCAG 2.1 compliance across all digital platforms • Increased user engagement across diverse user groups • Created a reusable, scalable design system that became a benchmark for inclusive design in financial technology • Improved overall user satisfaction and platform usability • Positioned Hargreaves Lansdown as a leader in accessible digital financial services