PAWS Website Redesign
The Problem: Outdated or missing information on the PAWS website, lack of communication between the shelter and potential adopters, users feel lost and unsupported during the adoption process
The Solution: Add more info about the mission and priorities to the homepage, work on information architecture to reduce the amount of pages the user has to scan through in the nav
My Role: UX Researcher, Info Architect, UI Designer
Tools: Figjam, Figma, Invision
Time Frame: 3 weeks
Meet The Team
Meredith Burton
Matt Croft
Noami Guerrero
Bailey Ippolito
Background
PAWS Chicago is a local animal shelter that aims to achieve 3 main goals:
Build a No Kill community
End overpopulation of homeless animals
Transform animal welfare
Their website is a major asset in helping them spread awareness and achieve these goals.
Opportunities For Improvement
Navigation design & structure
The hamburger menu sits in the middle of the page
Information hierarchy/organization
The navigation menu is incredibly robust making it difficult to easily access info you’re looking for
Outdated visual design
The colors and design can be refreshed to modernize the brand.
Research
Proto Personas
The Donor
Lifelong animal lover looking to give back in her retirement.
The Adopter
First-time pet parent who wants to utilize PAWS adoption services.
The Volunteer
Animal Studies major who needs volunteer hours for a class credit.
User Interviews
We wanted to understand…
Why users chose PAWS over other shelters/breeders
Our team conducted 4 user interviews centered around these objectives.
How users used PAWS website to find information or services
How users felt after interacting with the PAWS website
User Persona
Anna Fernandez
“Being able to give an animal a safe and loving home is a huge gift and a huge responsibility”
Demographics
Age: 26
Location: Chicago
Occupation: Insurance Specialist
Salary: $75,000
Goals
Give another dog a safe and loving home
Do adequate research
Talk with people from the shelter
Feel supported
Context/Environment
Downtown apartment
Lives with boyfriend
5-year old beagle, Maggie
WFH 2 days a week
Challenges
Outdated information
Lack of communication
Unsure if she’s making the most informed decision
Outdated or missing information on the PAWS website
The Problem
Lack of communication between the shelter and potential adopters
Users feel lost and unsupported during the adoption process
How might we improve upon the overall PAWS website experience so users feel better supported during the adoption process and empowered in their decision to provide a homeless animal with the most safe, loving and comfortable home possible?
Ideation
With our research in mind, we started our ideation process with, our I Like, I Wish, and What ifs. Some examples:
“What if the organization I adopted through had a 24/7 support chat”
“What if the the donation form on the website is broken down by cost of items and vet services, so I can quickly and easily see what my money is helping with”
“I wish there was a mentor or someone I could speak to directly for help with my dog”
“I like knowing the information on a website is reliable and accurate”
We then mapped those out on our feature prioritization matrix, and decided that we wanted to focus on itemized donation, chat support, and adoptable animal compatibility
Then we had a turn of events.
Our stakeholder was able to meet with us and he made one thing abundantly clear –
Getting people to donate on the site is the #1 top priority for PAWS.
Right now only about 6-10% of people who visit the donation page complete the form.
90% of web traffic goes to the adoption page
Wants the user to leave the site feeling like they made an impact and feel happy
In order to meet both our users’ needs and our stakeholder’s needs our solutions are:
A chat feature, so users can have access to 24/7 support
An itemized donation button to illustrate the impact the user has when they donate and to make the donation process easy and fast
Navigation and Card Sorting
Add a compatibility feature so users are able to easily comb through the pets for adoption and find which pets would fit their lifestyles
Make sure the donation and adopt buttons are accessible everywhere
Card Sorting-some dropdowns were TL;DR
We knew we wanted to make resources accessible for our users who are fostering and adopting so we bumped that to the beginning of the nav.
after speaking with our stakeholders, we knew that donate and adopt were top priorities for PAWS, so we wanted to make sure those were the main calls to action and accessible from every part of the page.
We also learned that the page users visit most often are the adoptable animals at 9:00pm, so we wanted to make adopt shine too.
Responsive Web Design
Wireframes and User Tests
User Tests Highlighted Key features and Issues
Accessibility to make a donation
Confusing double menu and Herotater
Chat Features
Thank you page
ComPETability quiz
Style Guide and Components
HiFi Prototypes
Key Takeaways and Future Direction
Stakeholder research was very necessary. It gave us more direction and we had to iterate our problem and solutions based on the info we gathered from our user and stakeholder interviews.
In the future, we would love to A/B test a few features on our prototype, that as a team we weren’t able to come to a consensus