Increasing the adoption rate of an animal shelter
🐶 Berkeley Humane’s Website Redesign
—My Contributions:
User Research
Wireframing
Mobile Prototyping
Usability Testing
—Tools:
Figma
Miro
InVision
Trello
—Team:
4 UX Designers
—The Summary
Berkeley Humane, an animal shelter in California, gave us a goal of increasing pet adoption rates by redesigning their website to make it easier to navigate.
Problem: Based on heuristic evaluation & usability testing, the problems with the original website included pages with information dump that users had difficulty navigating, an impersonal feel to the adoption process, and lack of prioritization of users.
Approach: Taking a user-centered approach, significant research was conducted to understand the website’s main audience. Users were involved at all stages of the design through card sorting, concept & prototype testing.
Solution: We changed the information architecture of the website creating hierarchy and progressive loading, and added interactive design elements to make the adoption process feel warm and personal.
—The Problem
6.5 million animals enter shelters each year, but only 3.2 million are adopted. Berkeley Humane wants to increase adoptions from their shelter by improving their website.
How might we redesign the Berkeley Humane website to help increase pet adoption rates?
—The Process
—The Research
6 in-depth interviews, 5 usability tests and 4 competitor analyses were conducted to understand users and their goals.
Research Questions
1. Common characteristics of potential pet owners, especially who prefer adopting.
2. What prevents interested pet owners from adopting?
3. Difference in motivation for adopting as opposed to buying pets.
Research Insights
Customer journey map summarizes the main learnings.
—The Redesign
Our redesign addressed the user needs and goals by:
Simplified navigation & reorganization of information through research-based prioritization. We designed the user flow to load information progressively
Adding interactive elements & leveraging pet-dominant visual design to make the adoption process feel warm and personal.
1. Hero Image focused solely on adoption & animals
Why? Adoption of pets were the main reason users visit the website, so we dedicated the hero to the heroes: the pets! Our users also enjoyed spending time on social media so using social media-like interactions for a familiar introduction to the website.
2. Reorganized navigation bar with only one Call-To-Action(CTA) button
Why? Users got frustrated on encountering unfamiliar terms so all updated nav bar categories use universal language. Also, users found CTA buttons to be more remarkable when they are the sole item to stand out.
#3: Addition of interactive elements like choice box & input form to the user flow
Why? Interactive elements in the updated flow open up a two-way communication between the user and the website making the process feel personal.
4. Styling the website to make it feel warm, emotional and local
Why? From user interviews, we learned that users who want to adopt from shelters tend to be socially aware and are locally-oriented. And they spend time on social media following cute pet content!
