Project Background
Ottawa has a large population of stray cats. Due to overpopulation, thousands of cats live brutish and short lives. Many of these cats are killed or injured by predators, vehicles, or the harsh winters. Groups such as Whiskers and Alley Cats have taken it upon themselves to make a difference. They are a volunteer-run rescue committed to providing care for stray and abandoned cats by placing them into permanent homes.
Problem Statement
Whiskers and Alley Cats currently operate through a Facebook page. They post cats available for adoption and communicate with people via Facebook; this was getting difficult to manage.
I designed a responsive website to make this process easier.
Secondary Research: Competitive Analysis
Skills used
I started the research for this project by looking at other cat rescue group websites and compared common features:
- List of adoptable cats with filters to sort through them
- Description and images of the cat
- Online adoption forms
- Options to donate and volunteer
This helped me understand user expectations and decide on which features to focus on.
Primary Research: User Interviews
Skills used
User research
Communication
I came up with some questions for 2 user groups:
- People who adopted or were looking to adopt a cat
Learn about their experience with cat adoption and understand how the adoption process can be improved
- People who were involved in running a cat rescue group
Learn about the challenges that rescue groups face and how a website can help address those pain points
Key Findings - Adopters
- Have specific behaviour traits in mind when looking for a cat e.g. good with kids
- Want to know about the cat’s medical history
- Want to view and fill out the adoption form online to save time
- Want to have details about the adoption process so they know what to expect
Key Findings - Cat Rescue Group
- Want to better organize the cats available for adoption and provide more visibility for the cats
- Want an easier way to manage forms
- Looking for more volunteers
- Require more foster homes. They hate having to turn away cats in need when there are no available foster homes
Low-Fidelity Wireframes
Skills used
Wireframing
Responsive design
UX design
I then created responsive low-fidelity wireframes to establish user flows and decide on design patterns.
The adoptable cats page has various filters to help adopters find the cat that matches their lifestyle.
The cat’s profile page contains detailed information to help the adopters decide if they would be a good match. Facts such as biographic and medical information are listed separately for quick readability.
The adoption form is digitized and broken down into 5 steps. This is easier for adopters to fill out and for the rescue to process.
High-Fidelity Prototype
Skills used
Prototyping
Interaction design
Responsive design
UI design
UX design
After iterating on the low-fidelity wireframes with the rescue group, I designed a style guide and created a high-fidelity prototype for user testing.
User Testing
Skills used
User research
User testing
I tested both the mobile and desktop prototypes with 7 participants.
All participants successfully completed the main task of submitting an adoption application for a cat.
I learned that participants wanted more filtering options:
- They expected to see ranges for the cats’ ages. Just saying kitten or adult was too vague
- 3 participants wanted an option to filter out cats who had special needs. They didn’t want to read paragraphs of text to find this important information. It might seem discriminatory, but participants would rather know this information right away since it usually comes with extra costs and time commitments
I made changes to improve the filtering options.
Version 1
Version 2
