PROJECT: PawUp

DURATION: December 2021 - March 2022

PROJECT OVERVIEW

PawUp is an app, that helps people find their perfect pet for adoption. Their focus is on finding a pet that matches users’ lifestyle, considering factors including, gender, age, temperament, and health status.

My role:

I led the Product Design - User Experience (UX) and User Interface (UI) - of this project. I also receive constructive feedback from other designers in order to improve and get other perspectives about what I was designing.

Responsibilities:

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

The problem:

Potential problems that users might have when it comes to adopting a pet include finding the right pet, lack of information, accessibility challenges, complicated adoption processes, high costs, and trust issues with adoption organizations or individuals.

The product goal:

Design a website that provides accurate and comprehensive information about pets available for adoption, streamlines the adoption process, and builds trust with users by ensuring transparency and credibility.

Style Guide

Persona

Empathy Map

Wireframes

HiFi Mockups

Journey Map

Prototype

Competitive Analysis

Idea Brainstorming

Usability Testing

Feature Analysis

Survey

Sketch

Information Architecture

Feedback Incorporation

Continous Iteration

Interview

Lo-Fi Wireframes

Competitive Analysis

Empathise

First I started with some initial questions and assumptions that I had. Then I conducted a competitive and feature analysis of the competition that is in the market. Finally, I did user research to gain insight into their motivation and pain points.

Initial questions.

I started to ask myself a few questions regarding the product and its users.

Who is the target audience for the website?
What kind of pets will be featured on the website?
How will the website ensure that pets are accurately represented, with information on breed, age, medical history, temperament, and behavior?
What features should the website have to make the adoption process easy and streamlined?
How will the website make the adoption process accessible to users with physical or language barriers?
What is the best way to build trust with users and ensure that the adoption process is transparent and reliable?
How will the website generate revenue, if at all?
What kind of support or resources should the website provide to new pet owners after they have adopted a pet?
What are the potential legal or ethical considerations that need to be taken into account when creating a pet adoption website?
How will the website promote animal welfare and responsible pet ownership?

My initial assumptions:

People looking to adopt a pet, such as families, individuals, elderly people and couples.
Animal lovers who want companionship.
Animal shelter and rescue organization staff and volunteers who want to promote pet adoption and find loving homes for the pets in their care.
Pet-related businesses, such as pet stores, and pet food companies.

COMPETITIVE ANALYSIS

I did a competitive analysis to understand what other website were already doing and what user goals they were not reaching

Direct:

Petfinder: Strengths:

One of the largest databases of adoptable pets in the US
Advanced search options for finding the perfect pet
User-friendly website with detailed information about each pet
Mobile app available for convenient browsing

Weaknesses:

The adoption process is handled by individual shelters and rescue organizations
Advertising and sponsorship features can be overwhelming
The website's database may not be as diverse as some competitors

Adopt-a-pet: Strengths:

A large and diverse selection of adoptable pets
User-friendly website with detailed information about each pet
Advanced search options for finding the perfect pet
Mobile app available for convenient browsing

Weaknesses:

Adoption fees and processes vary widely by individual shelter and rescue organization
Advertising and sponsorship features can be overwhelming
The website's database may not be as comprehensive as some competitors

ASPCA: Strengths:

Well-established reputation as a leading animal welfare organization
Variety of adoption options, including dogs, cats, and small animals
Offers resources for pet owners, such as training tips and healthcare advice
The website's proceeds go towards funding the ASPCA's animal welfare programs

Weaknesses:

The adoption process is handled by individual shelters and rescue organizations
The search function is limited to only basic search criteria
Adoption fees and processes vary widely by individual shelter and rescue organization

Rescue Me: Strengths:

Large database of adoptable pets from shelters and rescue organizations across the US
Advanced search options for finding the perfect pet
User-friendly website with detailed information about each pet
Offers a platform for individuals and organizations to post pets for adoption

Weaknesses:

The adoption process is handled by individual shelters and rescue organizations
The website's database may not be as large as some competitors
The website's interface and design may be outdated and unappealing to some users

Robinhood: Strengths:

A large and diverse selection of adoptable pets from shelters and rescue organizations across the US and Canada
Advanced search options for finding the perfect pet
User-friendly website with detailed information about each pet
Offers resources for pet owners, such as training tips and healthcare advice

Weaknesses:

The adoption process is handled by individual shelters and rescue organizations
Inconsistent or incomplete information provided by individual shelters and rescue organizations
The website's interface and design may be outdated and unappealing to some users

FEATURE ANALYSIS

Based on the feature analysis, I saw the opportunity in these features, but I will need to test my assumption after I will do user research.

Mobile app development: Since some of the pet adoption websites have a mobile app, there is an opportunity to develop a mobile app for your website to provide a better user experience for mobile users.
Advanced search options: Offering advanced search options can help users quickly find pets that meet their specific needs, which can improve the chances of adoption.
Resources for pet owners: Providing resources for pet owners, such as articles, tips, and advice, can help build engagement and loyalty among users.
Online adoption application: Offering an online adoption application can streamline the adoption process for both users and shelters, which can improve the overall experience for everyone involved.
Foster program: Providing a foster program can help build trust and credibility with users, as it shows that your website is committed to ensuring that pets are well-cared for even before they find their forever homes.
Social media integration: Integrating social media can help increase brand awareness and user engagement, as users can easily share pet profiles and adoption stories on their social media channels.
Responsive design for small screens: With a large percentage of users browsing the internet on mobile devices, having a responsive design that is optimized for small screens can improve user experience and increase the likelihood of adoption.

From the competitive analysis, the main competitor to stand out for me was Adopt-a-pet.

USER RESEARCH

I conducted a user survey to gather quantitative data and gain insights into users' behavior regarding pet adoption.

Have you ever adopted a pet before?
What type of pet are you interested in adopting?
What qualities are you looking for in a pet?
How important are certain pet adoption website features, such as filtering by pet personality or live chat support?
What concerns do you have about adopting a pet?
What motivates you to adopt?"
What factors influence your decision to adopt a pet versus purchasing one from a breeder or pet store?
What kind of information do you look for when researching pets to adopt?
What are you trying to accomplish by adopting a pet?
What barriers have you encountered in the pet adoption process, if any?

Out of the survey, I found out that:

Then I used qualitative research, by conducting a one-on-one interview with 5 people to understand their behaviour and motivations, identify their pain points, validate my assumptions, and uncover opportunities for innovation.

These were the main paint points the users had:

All five participants cited companionship as a key motivation for adopting a pet.
Four out of five participants described challenges in finding a pet that matched their lifestyle
One participant cited concerns about pet allergies and another cited difficulties in finding a pet that was good with children.
Three out of five participants expressed interest in a pet with personality traits, such as "playful" or "affectionate".
All five participants preferred a combination of online browsing and in-person visits to adoption centres or shelters, with most participants citing the importance of meeting a pet in person before making a decision.
Suggestions for improving the adoption process included providing more detailed information about each pet's background and behaviour, offering virtual meet-and-greet options for shy or nervous pets, and offering resources for new pet owners such as training manuals or online support groups.
All five participants expressed varying levels of comfort with technology, with two participants expressing hesitation about using an online adoption platform.
All five participants identified a need for ongoing resources and support after adopting a pet, such as veterinary care or behaviour training.
All five participants said that transparency and trust in the adoption process were critical to feeling confident and satisfied with their decision to adopt a pet.

DEFINE

In the second step of the design process, I will be creating a persona, an empathy map, a customer journey map, and finally coming up with a problem statement.

USER PERSONAS

Based on the research I have conducted, creating a persona is an essential step in the design process as it enables me to understand my user's needs, goals, and pain points. By developing a persona, I can get a clear picture of my user's behaviour and motivations, which will help me design a product that meets their expectations and provides a better user experience. Additionally, personas can also serve as a communication tool if I would work in a team to align our design decisions with the user's needs.

Let's meet Margot.

Name: Margot

Age: 26

Occupation: Health Carer

Goals

Save a life
Find a friendly healthy dog
Easier way to search for dogs
More details about the pets on the website

Frustrations

Many websites don’t have accurate information
The navigation system is too complex

Margot is a health carer with a busy schedule. She already has 2 adopted cats and she feels ready for adopting a dog. She wants an easy way to find her perfect dog that matches her personality. She is frustrated with her online searches because she is unable to find accurate information about the pets and the navigation system is too complex.

EMPATHY MAP

Creating an empathy map is crucial in the design process as it helps me understand the user's emotions, behaviours, and attitudes towards the product or service. By mapping out these elements, I can gain a deeper insight into the user's needs and motivations, which allows me to design a more personalized and engaging experience. Additionally, the empathy map can also help me identify potential pain points and areas for improvement, enabling me to create a product that better meets the user's needs and expectations.

What does a typical day look like for Margot? What do they value and think about? Are their actions different — or the same as their thoughts?

JOURNEY MAP

The next thing in my design process was the Journey map, which allowed me to visualize the user's experience from their perspective and identify pain points and opportunities for improvement. By breaking down the user's journey into smaller stages, I was able to focus on specific touchpoints and gain a deeper understanding of the user's emotions, motivations, and actions at each stage. This enabled me to create a more user-centric design and improve the overall user experience.

Problem statement:

Many potential pet owners struggle to find a reliable and user-friendly platform to adopt pets, resulting in frustration and ultimately a decrease in pet adoptions. This problem can be addressed by creating an easy-to-use and informative website that matches potential owners with their ideal pets while providing accurate and reliable information.

How might we create a user-friendly interface that simplifies the pet adoption process for potential pet owners like Margot?

How might we improve the accuracy of pet information available on the platform to increase trust and confidence in potential adopters?

How might we leverage technology to enhance the adoption process and facilitate communication between pet adopters and animal shelters/rescues?

IDEAT

In the next step of the design process, I came up with solutions and created an information architecture. Followed by sketches, mid-fidelity wireframes, usability testing, and a Design Guide.

INFORMATION ARCHITECTURE

Based on my research, creating an Information Architecture for this project is an important step in the design process. It enables me to organize and structure the information on the website in a way that is easy to navigate and understand for my users. By creating a clear hierarchy and labeling system, I can ensure that my users can easily find the information they need, which improves their overall experience on the website. A well-designed Information Architecture also helps me to identify any gaps or inconsistencies in the content and ensure that everything is cohesive and aligned with my user's needs and goals.

PAPER WIREFRAMES

As a solo designer, creating paper wireframes helps me to visualize and iterate on the design ideas quickly and cost-effectively. It allows me to test different layout options and experiment with different functionalities before moving to the digital stage. And if I would be part of a team, I could use this to get feedback from stakeholders and ensure we're aligned on the design direction before investing more resources into the project. Overall, paper wireframes are a valuable tool in my design process as they enable me to create a better product and save time and resources in the long run.

DIGITAL WIREFRAMES

LO-FI PROTOTYPE

Creating a clickable prototype was the next step in my design process. By translating my wireframes into a more interactive format, I was able to get a better sense of how my design would actually work and identify any usability issues.

Desktop

Mobile

USABILITY STUDIES

During usability testing, users expressed frustration with the Home page due to its numerous distractions and colors. They had difficulty focusing on their search.

Visual Herarchy

Users struggled to find focus on a screen

Search bar

Users wanted a search option on the home page

HOME PAGE

Before

After

Search

I added a search option right in the Navigation Menu

Visual Herarchy

Improved hierarchy enables users to easily locate the information they are seeking and guides their attention to important areas of the website

HI-FI SCREENS

Desktop

Mobile

HI-FI PROTOTYPE

Website

Mobile

Seamless Exploration

Users have many ways to explore all the pets options.

"Share the love"

Users are able to share a pet normally on social media or to send a direct message to a friend that is looking to adopt a pet.

"We are live, how can we help?

Not always do people want to talk on the phone or email when they could ask just a simple question on the 'live chat'.

Filter options

Users can find their perfect pet to match their personality much faster with this option.

STYLE GUIDE

Accessibility considerations

Screen reader compatibility: The app should be designed to be compatible with screen readers, which are assistive technology tools used by visually impaired users to navigate and interact with digital content.
Colour contrast: Ensure that the app uses high contrast between text and background colours to make it easier for users with visual impairments to read and navigate the app.
Text size and font: Allow users to customize the size and font of the text to make it easier for users with visual impairments to read the app.
Keyboard navigation: The app should be designed to be navigated using a keyboard, as some users may have difficulty using a mouse or touchscreen.

Key Takeaways and what I learned

At the beginning of this project, I assumed that most pet owners adopt animals primarily for their companionship. However, through my research and user interviews, I learned that there are several other reasons why people adopt pets, such as providing a home for an animal in need, helping with mental health, and even as a way to become more active.

I also discovered that the adoption process can be an emotional experience for both the adopter and the animal. Users expressed feeling overwhelmed and stressed by the process, which often involves filling out lengthy applications, meeting with adoption counsellors, and waiting for approval. It was important to design a website that would make this process as easy and stress-free as possible, while also ensuring that the animal's well-being and safety were a top priority.

I also discovered that users have a strong desire for easy navigation and a search feature to quickly find pets that match their preferences.

Next steps

If this would be a real project I would use these steps:

Conduct another round of usability studies to validate whether the pain points
users experienced have been effectively addressed.
Work on bridging the information flow between shelters that offer pets for adoption
and the team that uploads them and updates the website.
Identify whether pet trends influence users’ needs and work a feature that allows users
to see and follow up on trendy pets, races, characteristics, personality traits etc
If the budget will allow, I would consider mobile app development.
As part of the next update, I would plan to introduce two new features to the website - a section on resources for pet owners, and a foster program. To ensure that these features meet user needs, I will create a minimum viable product (MVP) and conduct user testing to evaluate user interest and feedback before fully implementing them on the site.

Other Projects

A banking app.

An app to help communities in extreme heat.

A booking app for a restaurant