Work
About
Contact
Menu
Case study
Zip Water is a global leader in instant boiling, chilled, and sparkling water systems for residential and commercial use. I was brought on to assist in uplifting mid- to high-fidelity wireframes for their upcoming website redesign based on usability issues that had been addressed earlier in the process.
UI Designer
Desktop and Mobile
March 2022 - May 2022
Conducted usability testing to identify pain points with the existing website.
Restructured the information architecture (IA) to align with user mental models and needs.
Created wireframes from low to high fidelity, ensuring visual consistency and clarity.
Collaborated with Codehouse to ensure the designs were developer-ready.
Improved key user flows for product discovery, support access, and service bookings.
Validated designs internally with Zip Water and key stakeholders for iterative feedback.
The new IA created clearer paths for users to find products and support.
With clearer product discovery and service pathways, users could quickly access what they needed.
Detailed wireframes were developer-ready and aligned with Codehouse’s technical requirements.
The streamlined design improved usability, supporting Zip Water’s business goals of driving product sales and service bookings.
Working collaboratively with Codehouse and a dedicated stakeholder from Zip Water, our team restructured the site’s information architecture and created a full suite of wireframes—from low to high fidelity—anchored to the updated structure. The result: a streamlined user experience that makes it easier for customers to understand Zip Water’s product range, find relevant support, and take action.
The existing Zip Water website was difficult to navigate and overwhelmed users with too many options. Usability testing had revealed key friction points, including hard-to-find support content and confusing product discovery. The challenge was to address these issues by restructuring the site’s IA and refining the design to meet both user needs and business goals.
We reworked the IA, simplifying navigation and categorizing content around user needs (e.g. commercial vs. residential). This new structure served as the foundation for creating low to high-fidelity wireframes that were intuitive, responsive, and aligned with Zip Water’s premium brand. Our design work streamlined the user journey, making it easier for users to find products, support, and take action.
Initially brought in to focus on uplifting mid-fidelity wireframes to high-fidelity wireframes, there was misalignment on the required assets and changes.
Working with multiple teams, including Codehouse and Zip Water, meant balancing different perspectives, but ultimately it helped shape a stronger final product.
While usability testing was thorough, we could have benefited from more extensive user validation during the design phase.
We started by testing low-fidelity updates to uncover remaining pain points and whether the implemented changes improved the user experience.
Using the insights, the IA was finalised, ensuring it was user-centered.
Based on the new IA, we uplifted wireframes from low to high fidelity, keeping in mind both user needs and Zip Water’s brand aesthetics.
Designs were reviewed internally, and we iterated on them based on feedback from both stakeholders and developers.
Once the high-fidelity wireframes were ready, I collaborated with Codehouse to handover designs for development.
The Zip Water website redesign was a successful example of how refining IA and focusing on usability can lead to a better user experience. By rethinking the structure and creating clear, intuitive wireframes, we were able to deliver a product that not only met user expectations but also supported Zip Water’s business objectives. Through collaboration and iterative testing, we ensured that the final product was both functional and aligned with the brand’s vision.
Continue
View
→
