IA/Nav
Mobile Nav Concept
Hill's Pet
Ecommerce Experience
Summary
Project Overview
Hill’s Pet Nutrition needed to improve how pet owners find the right formulas, understand product benefits, and complete purchases through their preferred retailer channels. My focus was on simplifying the path from browsing to confident product selection by restructuring the information architecture, creating a clearer product comparison experience, and improving content hierarchy across key landing, PDP and PLP templates.
To comply with my nondisclosure agreement with VML, I have omitted and/or obfuscated confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of Colgate or Hill's Pet Nutrition.
Detailed design files can be reviewed live during an interview process upon request.
My Role
User Experience Designer
Company
VML
(formerly VMLY&R)
Project Type
E-commerce workflow optimization and content architecture redesign
Core problem
The Challenge
Pet owners often struggled to interpret differences between formulas, identify the correct nutritional solution for their pet, and understand the proper transition guidance. Existing templates contained dense content, inconsistent interactive components, and fragmented pathways to retailer checkout.
The core problem became clear:
People could not easily decide which formula was right for their pet or why they should trust it.
Product Objectives
Goals
- Improve scannability of nutritional, ingredient, and health-benefit information
- Reduce cognitive load during product comparison
- Create a consistent, modular design system for product pages
- Support the user journey from education to confident product selection
- Enable Hill’s to maintain content across a complex portfolio of formulas without UI drift
User insights
Research
Stakeholders provided access to prior user insights and category learnings. From these, several consistent pain points appeared:
What we learned
- Pet owners needed clearer guidance on which formula matched their pet’s age, size, and health needs
- Retailer handoff points were inconsistent, causing decision hesitationToo much dense copy on early templates made it hard to scan key benefits
- Ingredient and scientific claims felt buried, reducing trust and clarity
- Retailer handoff points were inconsistent, causing decision hesitation
- Veterinarian-recommended proof points were not prominent enough to reduce uncertainty
(Raw interview notes and internal research are not shown due to NDA.)
Content structure
Information Architecture Improvements
I rebuilt the core structure of the PDP to align information with how users make decisions:
- Top-loaded essential benefits (pet need, formula category, and health focus)
- Clear hierarchy of nutrition, ingredients, and science-backed claims
- Modular card system for long blocks of copy
- Comparison pathways that let pet owners quickly evaluate similar formulas
- Simplified call-to-action blocks to move users smoothly into retailer channels
This reframing provided a predictable mental model across the entire formula catalog.
UX Flows
Wireframes & Explorations
I created a full set of responsive wireframes covering:
- Key landing pages
- Product detail pages
- Nutrition and ingredients modules
- Comparison modules
- Transition guidance components
- Retailer handoff UI
These wires focused on hierarchy, clarity, and reducing cognitive load, ensuring veterinary details and nutritional facts were readable and structured.
(Some wireframes are not available publicly due to NDA, but can be reviewed and shared in a live interview setting.)
Rationale
Design Decisions
Throughout iteration, I focused on:
-
Reducing cognitive load
Breaking large sections into scannable cards with consistent spacing, typography, and iconography. -
Making scientific claims approachable
Surfacing veterinarian recommendations and key proof points earlier in the flow. -
Supporting product confidence
Grouping formula types and surfacing the correct product within the first few seconds of scanning. -
Improving retailer handoff
Standardizing CTA blocks and visual cues so users always knew what happens next.
These decisions were validated through internal reviews and alignment sessions with cross-functional teams.
Interactive
Prototype
A complete responsive prototype was delivered, demonstrating:
- Updated information architecture
- Reusable modules and design-system components
- Content hierarchy built for both quick scanning and deeper reading
- Mobile-first flows minimizing vertical fatigue
Implementation and Launch: The concepts were approved by the client for further design and development, setting the stage for a transformative overhaul of the Hill's Pet online presence.
Wireframes
Product Page Concepts
Results
Outcomes
Because this work was part of a multi-phase modernization effort, I cannot share internal metrics.
However, outcomes included:
- Adoption of the new modular components across the Hill’s design ecosystem
- Clearer, more predictable layout patterns for high-content pages
- Reduced ambiguity for product comparison and nutrition information
- Improved internal content authoring efficiency due to reusable UI structures
(Specific performance metrics are withheld due to NDA.)
Deliverables
What I Delivered
- End-to-end wireframes for multiple page templates
- Revised content architecture and hierarchy
- Design-system aligned UI components
- Mobile and desktop prototypes
- Documentation for development and content teams
(Specific performance metrics are withheld due to NDA.)
Takeaways
Conclusion
Limitations & NDA Notes: This case study illustrates our human-centered approach to addressing Hill's Pet Nutrition's challenge of declining website visitors. By focusing on user needs and preferences, we crafted a solution that promised to revitalize their online presence and provide a direct, personalized shopping experience.
Summary: This project strengthened the overall experience for pet owners seeking nutritional guidance and provided the foundation for more consistent future content. By focusing on clarity, scannability, and decision-support, the final system helped Hill’s create a more intuitive and trustworthy shopping journey across a broad catalog of formulas.
Kudos
Manamai R."George's role as a Senior UX Designer showcased his diverse skills and innovative approach on the Hill's Pet Project. His attention to detail and seamless collaboration across teams contributed significantly to the project's success.”
Creative Director
VML (New York)