Project Overview

• Role: Lead CX & UX/UI Designer
• Services: Customer Experience Strategy, Digital Channel Audit, User Research, UI Redesign
• Industry: Public Utilities / Water Management / Citizen Services
• Tools: Figma, Miro, Customer Journey Mapping

1. Context & The Challenge

Agbar Cataluña manages water distribution and sanitation services for millions of citizens across Catalonia, requiring highly accessible and reliable digital touchpoints.

The Problem:

The legacy online portal and self-service flows were fragmented, making routine procedures—such as meter readings, bill inquiries, and ownership transfers—unnecessarily complex for everyday citizens.

Key Pain Points Identified:

• High Customer Support Load: Complex digital procedures forced users to rely on phone support or physical branches for basic administrative tasks.
• Low Accessibility Standards: Interfaces lacked WCAG compliance, creating barriers for older demographics and users with accessibility needs.
• Confusing Billing Layouts: Water consumption metrics, tariffs, and payment history were difficult to interpret, leading to payment confusion and disputes.

2. My Approach & Process

I led the CX and UX/UI redesign of the digital portal to simplify public service interactions and empower self-service management.

Phase 1: CX Research & Journey Mapping

• Conducted service audits and user testing across various citizen profiles (e.g., residential users, commercial accounts, elderly citizens).
• Mapped end-to-end customer journeys to identify friction points during bill payments and incident reporting.

Phase 2: Information Architecture & Self-Service Optimization

• Re-architected the main portal menu to prioritize high-frequency tasks (Pay Bill, Submit Meter Reading, Report Outage).
• Simplified multi-step administrative procedures into intuitive, step-by-step digital forms.

Phase 3: Inclusive UI Design & Accessible Design System

• Developed a responsive design system in Figma built strictly around WCAG AA accessibility standards (high contrast, scalable typography, clear touch targets).
• Redesigned consumption analytics into visual charts that clearly explain water usage and billing breakdowns.

3. Key Solutions Implemented

• Citizen Self-Service Dashboard: A streamlined portal home view providing instant access to current bills, consumption history, and active service alerts.
• Intuitive Meter & Billing Management: Simplified forms with visual feedback for submitting water meter readings and processing payments securely.
• Accessible Outage Tracker: A real-time map and notification system informing citizens of local maintenance work or water disruptions.

4. Impact & Results

• Reduced Call Center Inquiries: Streamlined self-service procedures lowered phone support volume for routine account queries.
• Higher Digital Adoption: Improved portal accessibility and clarity boosted online payment and meter submission rates.
• Full Accessibility Compliance: Successfully delivered WCAG-compliant UI components suitable for all citizen demographics.