Petwin — from shelter to home

Petwin is an app designed for animal shelters, pet seekers and pet owners. My team partnered with Austin Pet Alive and Austin Animal Center and we spent 11 weeks to finish this project from research to design.

Overview

Petwin is an app that helps animal shelters to better communicate with people who are seeking pets and pet adopters. In Petwin, users can stay on top of shelters’ events, pets and training resources. Moreover, users can adopt or foster pets seamlessly in Petwin with visibility of progress without anxiety.

Design Outcome

“An all-in-one platform for people to adopt pets and get assistance from shelters easily and seamlessly”

  • Search, view, apply, progress tracking, communicate all-in-one app for pet seekers
  • Highlight multiple perspectives of pets such as energy level, time spent, etc rather than physical traits only
  • Post-adoption assistance and community involvement

Process

My Role

It’s a 3 man team so I wear several hats. I’m a User Researcher, UI/UX Designer, and Visual Designer. I did the research and ideation as a team and finished the design by myself.

Background

Living in Austin, Texas, one of the cities which has the highest pet ownership rate, I am more than used to see dogs, cats, and other pets in the city. Although shelters in Austin are no-kill now, the shelters have to put tons of effort to keep over 90% save rate.

Stakeholder Meetings & Problem Space

Two biggest shelters in Austin

From the meetings with stakeholders from Austin Animal Center and Austin Pets Alive, we understand the trade-offs behind a high save rate. Spacing is one of the most critical issues. Without euthanizing animals, the only two outcomes from shelters are adopting and fostering. However, based on the statistics from shelters, the number of intakes is thousands more than the number of adoption, which has made shelters oversaturated and shelters need to transfer animals to other places. Based on the problem space, we came up with key questions that need to be answered:

- How people adopt/foster pets from shelters?
- Why people decide to get or not pets from shelters?
- What are the pain points of adopting/fostering pets from shelters?
- What are the difficulties people face as an owner?

Research

Based on our problem space, we came up with our interview scripts for three personas:

  1. Pet owners who adopted/fostered animals from shelters
  2. Pet owners who bought animals from breeders
  3. Workers and volunteers in shelters

Pet owners who adopted animals from shelters

The numbers of animal adoption through shelters are increasing, but the process is not as easy as online shopping for sure. Pet adoption includes several cross-platform processes and visits to shelters which are time-consuming and even tensive. The following points came up during our interviews:

“Browsing pets online is just like online dating”

“Not every animal has a clear photo and detailed information”

“Can’t only base on one photo and one paragraph to make decision”

An example of an adoptable pet page from AAC

Lacking information and interaction on the current platform is a huge pain point for adopters. Having a pet is a long-term relationship which most people wouldn’t make a quick decision. Based on our interviewees, adapters usually went to shelters 3 to 5 times before they adopted pets.

“After targeting certain cats, I had to either send an email or make a phone call to get in the line”

“Went to the shelter immediately so as not to Luca (name of the cat) had already been adopted by other”

Another big pain point for adopters is that the adoption process includes cross-platform communication without transparency and it can create lots of tension because they desire to adopt their dreaming pets. As you can see below:

Pet owners who bought animals from breeders

According to the American Pet Products Association (APPA), around 1/3 of dogs were purchased from breeders in the United States. Thus, we focused on why people decided to buy animals from breeders instead of shelters. The following points came up during our interviews:

“The animals in the shelters must have some behavioral problems or health issues so they end up being there.”

“I’ve visited shelter before and I don’t believe animals would be healthy under such a dirty environment”

“I feel like it is difficult to train someone’s pet.”

From our interviews, we found out that people have concerns about health, behavior, and training of animals in shelters because of stereotypes and the environment of shelters. However, they are misinformation.

Nowadays, shelters usually have a group of professional veterinarians who in charge of the health of every animal in the shelters. They do regular health inspections and thorough inspections before they make animals available to be adopted or fostered.

Shelters also have professional trainers and animal behaviorists who set up tailored training programs for animals and evaluate them before making them available. Evaluations could be found on the shelter’s page.

An animal profile page with different scores from APA

Workers and volunteers in shelters

Shelter as a temporary home for animals, one of their biggest goals is that place all adoptable animals in forever homes through adoption, foster care or rescue partner groups. The most important point came up during our interviews:

“Animal’s behavior is totally different inside and outside shelters”

“Sometimes shelter could become a jail for animal and some of them are unhappy inside”

Animals behave atypically as a result of being stressed in shelters. They are exposed to a variety of stressful events such as new environments, new companions and they don’t have control over what happened to themselves. Once they leave the shelters and the resources of stress are gone, they will gradually recover.

Journey map

We also asked our interviewees to draw their journey maps for adopting pets.

One interviewee drawing his journey map

We integrated research insights and journey maps from each interviewee into a conclusive journey map:

Pet adopter’s journey map

After reviewing our journey map, we aimed three touchpoints to develop our design, they are:

  1. Limited information and interaction when searching for pets
  2. Lack of transparency of cross-platform communication
  3. Lack of training knowledge for specific pets or breeds

Visions

Based on our research and problem space, our main goal is to create a tool which can:

  1. Bridge the gap between potential pet adopters and the pets in shelters which increases the adoption and foster rates of shelters.
  2. Facilitate the communication between potential pet adopters and shelters to promote the transparency of the status of animals in shelters.
  3. Provide post-adoption assistance from shelters to adopters.
  4. Create touchpoints for people who’ve bought animals from breeders to get involved with animal shelters.

And our ultimate goal is:

“Increase the visibility of shelters that leads to raising adoption rate to maintain the no-kill status of Austin shelters”

Design

Functions and Navigation

  1. Landing page: Since users land on this page each time when they launch the Petwin, it’s a perfect chance to prompt the latest information from shelters. This page includes coming events, feature pets and training programs.
  2. Search: The place where users can do searches and apply for adopting and fostering pets without switching to emails or phones.
  3. Training: Training is a touchpoint for pet owners who buy pets from breeders. Although they don’t adopt pets from shelters, they can still use Petwin for training. Meanwhile, they passively receive information about events and animals from shelters which provides an opportunity for them to get involved.
  4. Events: It includes events from shelters, animal nonprofits and pet communities.
  5. Menu: A common menu page and once users submitted their application for pets, they can track the progress and chat with staff in shelters here.

Wireframes

After coming up with 30+ wireframes, I decided to move forward with reusable grid/card-like components since there will be lots of similar information under each category.

Wireframes

Usability Testing & Iterations

Besides showing my wireframes to my team members and experienced designers, I also did 2 rounds of usability tests on usertesting.com. Using wireframes for the usability test helps testers focus on the foundational flows and information architecture without disturbing by colors, fonts, etc. After gaining data from people and updating the wireframes, I completed the hi-fi mockups.

From https://www.usertesting.com

Splash Page and Landing Page

It’s usually one of several misspellings in imagined animal monologue or dialogue. “NEDD HOME” is just like pets are saying that we need a home.

For the landing page, it is the page that every user will see immediately after they launch the app so it should be dynamic and up-to-date. There are three different sections on this page:

1. Event:

Hosting events is the most direct way to attract people to visit shelters and get people to adopt pets so shelters usually host several events especially on weekends or holidays. Events are located at the top of the page to ensure that every user has the chance to view upcoming events when they launch Petwin.

2. Featured Pets:

According to users’ browsing history and new-to-shelter pets, Petwin will automatically recommend pets that may be a good fit for users. A “share” button allows users to share the pet to whomever they want and it increases the visibility of the pet.

3. Training:

Users can easily pick up unfinished training or start new pieces of training here.

Search Setting

Traditional filters like age, size, breed, and sex are more about the appearances of pets. Nonetheless, personalty and habit are more important when it comes to living together. Therefore, several new aspects are added in searching and data can be retrieved from shelters, foster parents or past owners. Moreover, the filters are also different for different kinds of pets.

Search Result

The filters clearly on the top for users to refer to easily. Tap any one of the filters brings back the popup for search settings. Moreover, tapping the picture or text takes users to the pet’s profile page which has more detailed information. Users can also add pets to favorite or share the pet’s profile with others.

Pet’s Profile

Pictures and basic information about pets come on the top of the page. Instead of giving scores about how well does the pet get along with other cats, dogs or babies, here just tell users if the pet is good with others or not. Two call-to-action buttons and videos are in the following section.

Quotes from the people who had the chance to get along with the pet like trainers, shelter staff or foster parents are the best endorsements for users to learn more about the pet.

Apply for pets

Users can submit adoption applications and foster directly on Petwin without switching to email or other forms. Users can view their real-time progress anytime after they complete the applications

Menu and Chat

Users can also chat with staff in shelters about their application on the menu. In this way, they no longer have to use email or phone to communicate. Moreover, the chat is also a channel for shelters to follow up after adoption/foster completed.

Training

If a user has adopted a pet from shelters before, the information of the pet will be on the training page automatically with specific training lessons since professional trainers and behaviorists in shelters have already trained and evaluated the pet. They know exactly what the pet needs to learn.

Users can add a new pet by the plus new tab on the top of the training page. In this case, users are asked to give information about the new pet so that the shelters can generate training lessons for them.

During the training lesson, gif shows actions specifically and repeatedly. It combines the advantages of image and video without having users to pause and scroll back to focus on actions.

After finishing one training lesson

Prototypes

View interactive prototypes here

Testimonials

After showcasing Petwin to different groups of people, there are some quotations:

“Petwin is amazing! It provides several new perspectives to learn a dog and I believe it will help people to find the right friends for life.” — Pet seeker

“Petwin is more than a one-time app. The features of providing resources from experts in shelters make the users come back even they are not seeking for pets which increases the visibility of animals in shelters” — Shelter worker

Takeaway

“Adopt a pet online is just like online dating” is the key quote that had inspired me throughout the project. In the future, AR and VR technologies will help out the interaction between pet seekers and pets in shelters.

Moreover, getting a pet is nothing but a long term relationship. There’s always a break-in between each other and having supports from communities (events) and training tips help each other get through it successfully.

Written by

A UX designer, developer, Lornhorn alum! Check my portfolio to learn more about me: https://ycchi.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store