Pet adoption website

Streamlined pet adoption platform connecting adopters and shelters effortlessly

COMPANY

Paws N Claws

ROLE

UX Designer & Lead

Duration

5 months

Project description

Project description

Project description

We created a user-friendly Pet Adoption website that connects potential pet owners with nearby shelters. The platform offers two sign-up options: one for adopters and another for shelters, ensuring a seamless connection.

Timeline

From initial research to final launch in 5 months, working concurrently with multiple teams to ensure seamless development and design.

Background

Adopting a pet can be overwhelming due to limited access to local shelter information. Shelters also struggle with managing and promoting pets in their care. Our platform simplifies the process, centralizing all necessary tools to make pet adoption easier for both adopters and shelters.

Process

Process

Process

This category details the step-by-step approach taken during the project, including research, planning, design, development, testing, and optimization phases.

Research & Planning

Defined project scope, user needs, and technical requirements through thorough research, documentation, and stakeholder meetings.

Design & Prototyping

Designed an intuitive user interface in Figma, creating wireframes and high-fidelity prototypes to streamline the user experience for adopters and shelters.

Implementation

Following Agile methodology with two-week sprints and regular scrums, the platform was developed iteratively. Both the front-end and back-end teams used GitHub for version control and collaboration, integrating React for the front-end and MongoDB for secure backend management. Docker was used to streamline deployment and ensure scalability.

Testing & Optimization

Conducted usability testing and fixed bugs to ensure the website was stable, reliable, and easy to navigate for all users.

User Persona

User Persona

User Persona

Task Flows

Task Flows

Task Flows

Visual Identity - Logo

Visual Identity - Logo

Visual Identity - Logo

The visual identity for the logo was developed in collaboration with stakeholders, incorporating feedback and input from various teams. It includes a carefully crafted logo, color palette, and custom font to ensure a cohesive and recognizable brand presence.

Low Fidelity Designs

Low Fidelity Designs

Low Fidelity Designs

These are super simple designs before the interactive High Fidelity designs, which was really helpful for me as a designer to come up with a game-plan where to place what,

Design System

Design System

Design System

These are super simple designs before the interactive High Fidelity designs, which was really helpful for me as a designer to come up with a game-plan where to place what,

High Fidelity Designs

High Fidelity Designs

High Fidelity Designs

These are super simple designs before the interactive High Fidelity designs, which was really helpful for me as a designer to come up with a game-plan where to place what,

Website Interaction Highlights

Website Interaction Highlights

Website Interaction Highlights

Explore key website interactions through GIFs, demonstrating smooth processes like searching for pets, uploading new listings, and managing profiles from both user and shelter perspectives.

Stakeholder Spotlight & Design Tweaks

Stakeholder Spotlight & Design Tweaks

Stakeholder Spotlight & Design Tweaks

Pic 1

Based on the feedback from stakeholders, we changed the floating Button for Zip Code to a Fixed button in the Nav bar.

Pic 2

The stakeholders were dissatisfied with the previous illustrations and photos, necessitating a switch to new illustrations.

Usability Testing

Usability Testing

After getting approval from the Human Subject Committee at SUNY Oswego; Participants were recruited to test the Paws n' Claws website, with data collected and analyzed using both quantitative and qualitative methods. The goal was to assess usability, task completion, and design effectiveness based on user feedback.

Task 1

Sign Up

Task 2

Add, Edit and Delete a Pet

Task 3

Filter Pets and Adopt

Usability Testing - Findings

Usability Testing - Findings

Overall, the test revealed a generally positive user experience. Participants found the PawsNClaws interface intuitive and easy to navigate. They expressed satisfaction with the website's design and functionalities, demonstrating a positive first impression.

However, the usability test identified some key areas for improvement, particularly within the adoption process itself. Several participants encountered difficulties navigating this crucial section of the website. 

During the usability evaluation, 5 participants, matching the user profile(s), were asked to spend about 30 minutes with our site.  During this time, participants:

  • Completed a user background questionnaire

  • Answered questions about initial site impressions

  • Performed real-world tasks on the site while thinking aloud 

  • Answered questions about their overall satisfaction

Positive Findings:

  • Users found the website easy to use with an average score of 4.85 out of 5.

  • Overall satisfaction with the system was high at 4.4 out of 5.

  • The interface was perceived as intuitive (average score of 1.76 out of 5 for complexity).

  • Participants felt confident using the system (average score of 4.5).

  • Interface design and functionality received positive feedback (average rating of 4.32 out of 5).

Negative Findings:

  • Completing the adoption task took the longest, suggesting difficulty.

  • Some users were confused about the adoption process (Participants 4 & 6).

  • Participant 2 had trouble finding the shelter sign-up.

  • Filtering functionality while browsing pets wasn't working well (Participant 7).

  • Entering a pet's age in months caused issues for Participant 7.

  • One participant mistakenly thought the site was for purchasing pets.

Recommendations

While the overall user experience seems positive, addressing the identified complexities and inconsistencies within the adoption process is crucial. Here are some recommendations:

  • Review and Refine Adoption Flow: Conduct a focused analysis of the adoption process to identify and address any confusing elements. This might involve streamlining steps, clarifying verbiage, or improving the layout for better user flow.

  • Better Sign-Up Flow: Shelter sign-up process needs to be more prominent.

  • Provide Clearer Instructions: Enhance the clarity of instructions related to shelter sign-up, health input fields, and any other steps within the adoption process.

    • The website should be checked to ensure users can't enter invalid data (e.g., pet age in months).

  • Optimize Filtering Functionalities: Ensure filters function smoothly and provide clear guidance on their usage.

  • Emphasize Adoption Focus: Review website messaging to ensure it clearly communicates the site's purpose as a pet adoption platform.

Areas for Improvement

Confusion with the Adoption Process

Areas for Improvement

Misunderstanding of Purpose

Solution

Solution

Solution

Our Pet Adoption website simplifies the process of connecting adopters with shelters, offering an efficient and user-friendly platform to facilitate pet adoption. The dual sign-up system ensures that both adopters and shelters can engage seamlessly in the adoption process.

User-Friendly Interface

Simplifies the adoption process for both shelters and adopters.

Seamless Interaction

Efficiently connects adopters with nearby shelters through a zip code-based search.

Streamlined Management

Shelters can easily manage pet listings, ensuring up-to-date and accurate information

  • ADOPT Your Perfect Pet

    Easily search for pets based on location, breed, and availability using our intuitive search page, designed to connect adopters with their ideal pet quickly and effortlessly.

  • Shelter Management Dashboard

    Efficiently manage pet listings and update profiles—all from an easy-to-use dashboard designed for seamless shelter operations.

  • ADOPT Your Perfect Pet

    Easily search for pets based on location, breed, and availability using our intuitive search page, designed to connect adopters with their ideal pet quickly and effortlessly.

  • Shelter Management Dashboard

    Efficiently manage pet listings and update profiles—all from an easy-to-use dashboard designed for seamless shelter operations.


  • Pet Detail Page

    Get detailed information about each pet, including photos, breed, age, and shelter details, all in a clear, easy-to-navigate format.


  • Upload a Pet

    Easily add new pets to your shelter’s listings by uploading photos, descriptions, and key details through a simple, user-friendly interface on the shelter dashboard.

Results

Results

Results

The Pet Adoption website successfully connects adopters with nearby shelters through a seamless, zip code-based search, simplifying the process for both parties. By offering shelter management tools, the platform ensures that adopters always have access to current and accurate pet listings, resulting in a more transparent and efficient adoption experience.

User-Centered Design

The platform provides two separate sign-up flows for adopters and shelters, ensuring a tailored experience for both.

Problem-Solving

It addresses the lack of a centralized platform for adopters to easily find pets and shelters to efficiently manage their listings.

Impact

The website facilitates a more direct connection between adopters and shelters, empowering adopters to easily discover available pets and reach out to shelters, ultimately increasing adoption success rates and enhancing engagement for both parties.

Click here to view the usability document and final presentation

Click here to view the usability document and final presentation

Click here to view the usability document and final presentation

© 2024 – Ganesh Rajavelu Balasubramanian @ganeshrajavelu

Connect with me on Socials

Case studies

Tickets booking App

© 2024 – Ganesh Rajavelu B @ganeshrajavelu

© 2024 – Ganesh Rajavelu B @ganeshrajavelu