Initial Challenges
The project needed to cater to complex user needs, which varied widely from bill payments and outage updates to accessing financial assistance—requiring a flexible and comprehensive approach. Not only that, the existing website's structure posed navigational complexities that hindered users from efficiently finding and utilizing essential services.
Another critical challenge was the technical integration, which involved seamlessly incorporating new design elements with the existing backend systems to ensure functionality without disrupting service. Addressing these challenges was crucial for the success of the redesign, aiming to enhance the overall user experience and meet the diverse needs of LADWP's large customer base.
The Objective
Create a Self-Service Utility Website for Los Angeles County Residents
Throughout our comprehensive endeavor to overhaul the Los Angeles Department of Water and Power (LADWP) website, our design team set out with distinct, user-focused objectives. The primary goals were to enhance user accessibility by streamlining the navigation to essential services, thereby reducing the number of required clicks for users to perform tasks.
Additionally, the project aimed to enhance the website's responsiveness and accessibility, ensuring optimal usability across various devices and full compliance with accessibility standards.
A crucial objective was to ensure long-term sustainability of the website design, enabling it to remain functional and contemporary over time without the need for frequent updates. These objectives were meticulously planned to align with the needs of LADWP's diverse user base, ultimately aiming to provide a more efficient and user-friendly online experience.
A short summary of our primary objectives include:
Improving user accessibility: Streamline the user journey to essential services with fewer clicks.
Enhancing responsiveness and accessibility: Ensure the site's usability across various devices and compliance with accessibility standards.
Long-term sustainability: Develop a design that remains functional and contemporary for an extended period without requiring significant updates.
The approach
It all started with researching and discovering all the primary needs that users had on the LADWP website. What problems were they trying to solve? What tasks did they need to accomplish? It came down to these 5 primary needs:
Pay my bills
Get information on outages in my area
Financial Assistance / Savings Programs
Start or Stop service
Water and Power Information for Construction
Content audit & journey mapping
From all the research gathered over the coarse of several weeks, our design team began drawing out the journey map. This mapped out what all the user needs where and how they'd get to the tools or information they were looking for to meet their goals.
UX and UI Design
Wireframing started as the building blocks of all the components, layouts, and content types needed.
All components, templates, and layouts are designed in grayscale wireframes
Grayscale is FAST, find weak points here and improve
Streamlined content is mapped to all identified pages
Following that, the user interface is designed
Component Wireframes
Technical Highlights
33 unique templates
Over 40 robust components with 400+ variations
Created 114 custom icons for a modern and unique experience
Improved SEO and ADA compliance
33 unique templates, more than 40 robust components
The technical enhancements applied to the LADWP website redesign had a transformative impact, significantly improving its scalability, accessibility, and user engagement. Addressing over 1000 pages, the implementation of 33 unique templates and more than 40 robust components with over 400 variations allowed for a highly customizable and flexible design. This flexibility ensured that the website could cater to a wide range of content needs and user interactions, making it adaptable to various user scenarios and preferences.
114 custom icons
The creation of 114 custom icons contributed to a modern and unique visual experience, helping to distinguish the LADWP site from other utility providers and enhancing the overall aesthetic appeal. These icons also improved the site's navigational intuitiveness, making it easier for users to find the information they need quickly.
Overall, these technical enhancements fostered a more engaging, accessible, and effective online presence for LADWP, meeting the diverse needs of its users while ensuring compliance and visibility in a competitive digital landscape.
User testing and results
We conducted extensive user testing with a diverse demographic to validate the design's effectiveness, resulting in a high success rate in usability tests. Adjustments were made based on real-time feedback, ensuring the site met actual, boots-on-the-ground user demands.
Key takeaways
The results of the LADWP website redesign exemplify how targeted improvements can significantly contribute to a company's growth. By enhancing the user experience, evidenced by an 80% faster login and bill payment process and a 100% success rate in users finding necessary information swiftly, the redesign directly improved operational efficiency and customer satisfaction.
This efficiency, coupled with an intuitive design, substantially reduced the volume of customer support calls, reflecting superior self-service capabilities that free up resources and reduce operational costs. Moreover, positive user feedback about the website’s ease of use and efficient navigation not only boosts customer satisfaction but also enhances the company’s reputation. Together, these improvements help foster customer loyalty, reduce churn, and can attract new users through positive word-of-mouth, all of which are crucial for sustained business growth and competitive advantage.
