PetFinder

Improving the experiences of people in search of adding to their family

Whenever you ask people about their experiences when adopting or fostering a pet, they may tell you different kinds of stories because bringing a new member into your home is extremely unique and personal.

Executive Summary

Our solution aims to address the different pain points with the current pet adoption process, particularly using PetFinder, while still allowing users to have that personal experience when choosing to bring a new family member into their homes.

Team: Worked with a team with an interaction designer, UX designer, and a visual designer.

Role: My role on the team was a service designer with an emphasis on turning research insights into meaningful design choices

Timeline: October to December 2021

Skills: UX Research, Wireframing, Figma Prototyping, UX/UI Design

Who We Are

The Challenge

Problem: 

When people are looking to adopt a pet:

  • People don’t know where to start

  • It can be a time consuming process

  • Many people weren’t willing to travel too far to meet a pet

  • Most pet adoption websites aren’t updated and they lack proper UI to help users navigate the pet adoption process.

Design Goals:

Our goal was to create a prototype that implements a new experience for the users of PetFinder in how they choose to adopt a pet and what pets to consider. We propose a responsive update to the current PetFinder UI that allows users to make virtual appointments to meet the pets at different shelters and gives users more resources of the aftercare process of adopting a pet.

When I started this project, I realized that neither I or any of my teammates had adopted or fostered a pet before. Therefore, we not only needed to complete desk research to understand the different methods people use to adopt pets, but we also needed to understand the process and experiences of users who have either adopted or fostered a pet before we could even start pointing out a potential solution.

I created a directed storytelling interview guide to help us gather findings and understand the experience and areas of improvement of the adoption process. We interviewed 6 people who had adopted a pet in the last 3 years to recall their process and identify their pain points. We also created a customer journey map for each user we interviewed to highlight their personal experiences.

The Unknown

Using the notes from the interviews and individual customer journey maps, we created an affinity diagram and created one journey map that captures our insights from our interviews.

The Discovery

Insights:

  • The process of researching for different pets and organizations to adopt/foster from was difficult and is often scattered all over the internet

  • The interviewees felt that they did not receive enough information about the pet’s condition and how to take care of them after adoption

  • The interviewees loved meeting with the pets when they were able to, but it wasn’t always a possibility due to lack of updated information from the shelter or the location of the shelters being too far away

Before selecting what solution we wanted to build, we decided to test out some concepts and validate whether they were needed. I created storyboards of two different concepts that addressed the pain points highlighted. We conducted speed dating interviews with our previous 6 interviewees to get a better understanding of which idea concepts were more helpful for users.

The Narrowing

How might we create a feature that allows users to search for pets, shelters and rescues easier?

How might we foster a pre-existing relationship between people who want to adopt/foster a pet and the pets themselves to provide a more accessible process to choosing pets?

Validation

  • There is a need for a virtual scheduler because it will help with issues such as location and time.

  • Being able to ask questions to staff and fosterers about pet behaviors is necessary.

  • Having a section for resources can help with adjustment of pets to a new home.

We really wanted to focus on adding two new opportunities for the PetFinder website:

  1. Provide resources for users who struggle with taking care of a new pet that isn’t acclimated to their new environment yet

  2. Provide users with a way to meet more pets and discover more options without the restrictions of location or even time.

I created a service blueprint to highlight PetFinder’s current offerings and what type of future state our solution could offer. This allowed us to visualize where to implement changes based on our insights and pain points highlighted.

Developing The Solution

In order to make sure we understood the overall user model and user flow, I created mobile paper prototypes and lo-fi wireframes to conduct Think-Aloud interviews with 4 different users to validate our idea and the flow of our proposed solution.

For the purpose of keeping the test simple, we decided to focus on the flow of the user setting up appointments to speak to and meet pets and gather more information on pet behaviors before adopting. In the test, we asked people to try and set up an appointment with a pet by going through the different scenes and talk us through their thought process.

Designing

User Feedback:

  • Because we are working with a platform that already exists, we needed to be careful of adding or implementing redundant or unnecessary steps. For example on the first screen “Introduce Yourself” (part of PetFinder’s current model to start messaging shelters) and “Make an appointment” felt redundant and confusing to users.

  • Although we were implementing an opportunity for a virtual appointment for people who can’t always make it out to in-person appointments, we still need to have an in-person meeting option when scheduling.

  • When people make schedules, a pre-confirmation page is usually helpful to make sure the details are correct and reduce user error.

We created 3 more prototypes (low, mid and high fidelity of the PetFinder future state website) using Figma and conducted 4 think-aloud protocols with each iteration to evaluate our UI and micro-interactions.

Iterations

Low Fidelity

Mid Fidelity

High Fidelity

For early iterations, we decided to focus on how users will schedule an appointment with specific shelters.

Early decisions:

  • Integrating the appointment flow within a pet profile page on PetFinder (change “Introduce Yourself” to “Schedule Appointment”)

  • Providing information to the user to allow them to decide if they would prefer a virtual appointment

  • Deciding the information we needed to collect to make an appointment

Change from original PetFinder’s website (left) to our redesign (right)

As we conducted think-aloud testing we had some findings that we implemented into our next iterations:

  • When creating appointments, users like to see confirmations of the task they just completed to know that the process is completed.

  • As this may be user’s first virtual appointments when meeting a pet, they didn’t know what to expect before the actual meeting

  • Users usually look at multiple pets before selecting one, therefore they will probably schedule multiple appointments and should have a place to view the appointment details for their different appointments

Loading Page

Confirmation Page

Appointments Page

Because it is harder to design for larger screens, we decided to add our screens for our responsive web page after our mid-fidelity iteration. I performed a heuristic evaluation on the difference between designing for mobile screens vs. a desktop. 

  • When using a desktop, there is more screen space that allows us to implement other capabilities that can improve the experience of the user, rather than keeping the exact same elements and having a lot of unnecessary white space.

  • The micro interactions for a mobile web app will differ from a desktop (e.g. filtering, progress bars, etc.)

  • The information hierarchy will need to be adapted for a bigger screen, especially if additional capabilities will be implemented.

Reviewing Appointment Details Before

Reviewing Appointment Details After

  1. Helped users feel empowered and informed about what it takes to adopt and take care of a new pet.

  2. Gave users more opportunities to meet and interact with pets through in person and virtual appointments.

  3. Assisted in the organization of information, which in turn aids in the decision making process of which pet to add to the families of users.

View mobile prototype here

View web prototype here

The Final Solution

Working on this project allowed me to utilize service and interaction design together to deliver a prototype that adds a new service to an existing product service system. I was able to map how to use user research techniques to make meaningful design decisions.

If I could continue this project, I would conduct more research with the actual pet shelters and organizations to build an interface of the video appointment platform. I would need to conduct interviews with different employees of different shelters and identify their similarities and differences to identify what needed to be included in their interface.

Reflection