Custom eCommerce System for At-Home Water Quality Testing Kits

A water quality kit testing companying looking to impve the ease-of-use for the custom online purchase, registration, and results system.

Screen Captures of example project: Custom eCommerce System for Water Quality Testing

Challenge

The Client operated a web-based ecommerce system that allowed customers to find, purchase, and register water quality testing kits. While functional, the system had significant usability and accessibility challenges, particularly in the test kit purchasing and registration processes.

The goals of the project included:

  • Enhancing the user experience for a diverse audience, including first-time and returning users.
  • Streamlining the end-to-end customer journey, from browsing test kits to viewing results.
  • Ensuring the design was mobile-friendly and adaptable to various device screens.

Solution

Garofalo UX collaborated with the Client to redesign their ecommerce system with a user-first approach:

  • User Experience Audit: Conducted a comprehensive review of the customer lifecycle, including catalog browsing, purchasing, kit registration, and results access.
  • User Flow Diagramming: Mapped revised workflows for each key process—browsing, purchasing, registering, and viewing results—based on stakeholder insights and identified pain points.
  • Information Architecture: Reorganized content and interactions to create an intuitive navigation structure, reducing user confusion and friction.
  • Low-Fidelity Wireframes: Created wireframes to guide the Client’s development team in implementing enhancements, ensuring alignment with improved workflows and information architecture.

Deliverables

  • User Experience (UX) Strategy: A comprehensive UX strategy was developed to align the redesign objectives with both business goals and user needs.
  • UX Audit: A thorough review and analysis of the existing system were conducted to identify pain points and usability gaps. This audit covered the full customer lifecycle, from catalog browsing to test kit results, and included evaluating navigation, workflows, and visual design consistency. Recommendations were detailed for each stage of the user journey to optimize interactions and remove barriers to successful task completion.
  • User Flow Diagramming: Revised user flow diagrams were created to visualize the improved customer end-to-end experience, including browsing, purchasing, registering, and accessing results. They served as a foundational tool for aligning design and development efforts.
  • Information Architecture: A reorganized structure was developed to ensure that content and interactions were intuitive and easy to navigate.
  • Low-Fidlity Wireframes: Wireframes were crafted to demonstrate the updated design approach for key user interactions and workflows. These wireframes served as a visual guide for the client’s development team, emphasizing simplicity, usability, and responsiveness.

Start your journey toward better experiences today

Let's Discuss Strategies   or   Request a Consultation
People.   Place.   Processes.   Purpose.