Helping customers to seamlessly self-serve online
At SouthEastWater, I led the redesign of the customer-facing website, transforming it from a legacy website into a modern digital experience to drive self-service and reduce customer support calls.
Within the first month post-launch, we achieved:
- 11% increase in customers paying their bills online.
- 20% increase in completion of re-location forms online.
Problem: “A frustrating online experience”
Customers experienced frustration while using the website and opt to call instead. Through user interviews, the following issues were uncovered:
- Lack of navigation structure forced customers to click through multiple pages to perform basic tasks.
- Inconsistent page layouts due to lack of standardised templates and calls-to-action were unclear or hidden.
- The visual style felt dated and untrustworthy, making customers hesitant to complete transactions online.
- Poor responsiveness especially on mobile
Getting to a solution to optimise customer self-service
Mapping the customer’s journey
Working with a service designer, we looked at the current state end to end journey to help visualise where customers may be dropping off. This helped us identify specific opportunities within the website.
Re-defining Information Architecture
I ran workshops with subject matter experts to restructure the entire site:
- ‘Accounts and billing’: a one-stop shop for both residential and business customers to manage their account
- Defined clear website hierarchy: Home → Level 1 (topics) → Level 2 (subtopics) → Level 3 (content) → Self-service forms.
- Identified top tasks to ensure they were displayed clearly on website, so that customers can start key journeys with ease.
This new IA informed my design for new dropdown navigation menus for desktop and mobile that let customers drill directly to specific pages.
Design system and wireframe building
I created multiple iterations from low-fidelity wireframes to high-fidelity designs, validating each round with the product manager and content writer.
Through prototyping and user testing, I refined page layouts and regrouped pages to match customers' mental models.
Solution: A fresh experience where customers can self-serve with confidence
The redesigned website made self-service way more straightforward.
From chaos to navigation clarity
Dropdown menus and call out cards allow customers to efficiently find information and self-service options in 1-2 clicks instead of hunting through pages.
Key self-service options displayed on home page for immediate access
On the home page, top tasks are clearly displayed and customers can immediately start key self service journeys such as paying their bill, reporting a leak or notifying the business of relocation.
Modern, trustworthy design that instills customer confidence
Standardised page templates and new visual design with clear call to actions made customers confident in completing transactions online instead of ringing.
Mobile optimisation for on-the-go transactions
Customers could navigate and use the website on their mobile with clarity as the user interface now scaled appropriately on mobile.
What I Learnt
- This project reinforced that good IA is invisible - when navigation works, customers don't think about it.
- The templates I created for content authors turned out to be as just important as the customer-facing design, because consistency is what makes a site feel reliable.
- If I did this again, I'd push for more customer testing earlier in the IA phase, before visual design began. We validated well, but earlier feedback would have saved an iteration.
Made with Bullet