Overview

Improving the adoption process is my goal, aiming to make it more seamless and enjoyable for both prospective adopters and the animals in search of loving homes.

Sammy’s Hope, a local shelter and non-profit organization in my area, has done an amazing job at connecting animals with their forever homes. The website offers a wealth of information, covering everything from adoptable animals and volunteer openings to upcoming events, along with a designated space for making donations. However, the current site is outdated. Combining my passion for animals with UX design, I saw this as the perfect project, driven by the belief that every animal deserves a loving home!

Current Website

The existing website's outdated and somber design result in a negative user experience, potentially driving visitors away which is counterproductive to the goal of helping animals find their forever homes.

Click here to view current website

Research

Research Goal

I wanted to understand how users approach the adoption process and perceive animal shelters, with the ultimate goal of enhancing user satisfaction, contributing to the successful placement of animals in their forever homes.

Shelters can have negative reputations due to misconceptions, limited resources, behavioral challenges, and negative media coverage. The emotional and demanding process of adoption can prompt individuals to seek alternative methods of obtaining pets. While making improvements to a website might appear insignificant to some, it has the power to entirely reshape someone's experience.

Competitor Analysis

It's important to strike a balance between encouraging support from users, such as donations and volunteers, and showcasing the animals in need of care and attention.

Click here to view competitor analysis

Some other key insights were:

Putting a face behind the brand and sharing the story behind it can create a more relatable and personal connection.
Demonstrating the tangible impact of the organization helps people feel confident and at ease when considering donating both their money and time.

User Interviews

Participants recognized the commendable role of animal shelters. However, they also acknowledged that these shelters can evoke feelings of sadness, leading some individuals to prefer ignorance over confronting the reality of animals in need.

I talked with five individuals directly over Zoom to better understand how people approach the adoption process for animals and perceive animal shelters. My main research objectives were the following:

Behavioral issues and health concerns are often the primary hesitations people have about adopting from animal shelters. Additionally, many assume it’s a cheaper and easier option; however, costs can vary significantly and the vetting process can be quite intense depending on the shelter. While many individuals can envision contributing through donations or fostering pets, they often struggle to see themselves volunteering, as the emotional weight of such work can evoke feelings of sadness that deter them from participating.

DEFINE

Affinity Map

Shelters face concerns about trust and reliability, emphasizing the need to offer extensive information, guidance, and support to individuals interested in adoption.

Click here to view affinity map

I organized the key insights by grouping them based on similarity and topic. Among the most important findings were the following:

People look for specific things when it comes to getting a pet. Shelter’s don’t offer animals with these specific things or don’t advertise for them enough
People think adopting is the cheaper and easier way to go, however it can get expensive depending on where you adopt from and can be a intense vetting process
People find animal shelters to be very necessary and admirable, however they can evoke feelings of sadness. People don’t want to know or acknowledge the animals in need, ignorance is bliss
User has to feel a sense of trust and reliability. At the same time, shelter's must be transparent and honest about the animals and what is expected when adopting an animal from there shelter

POV & HMW

To refine my brainstorming, I developed a POV statement and How Might We question to empathize with users and spark innovate solutions.

This approach ensured that every design decision was centered around the user's needs, desires, and pain points, keeping their perspective at the core of the process. It led to the formulation of an actionable How Might We question that guided and inspired all subsequent work.

User Personas

Potential adopters seek a shelter they can trust and rely on, highlighting the necessity for transparent and efficient communication.

Click here to view user personas

I created user personas by consolidating key motivations, goals, and frustrations from my findings to keep my focus sharp and ensure I address the most important priorities.

Ideate

Project Goals

My goal, for both users and the business, was to create a more positive and hopeful atmosphere that provides value and usefulness to those considering adoption.

A Venn diagram that illustrated the user and business goals of Sammy's Hope.

Click here to view project goals

User Flows

I prioritized three primary tasks: browsing the available animals (including dogs and cats), becoming a volunteer, and making donations to the shelter.

Click here to view user flows

Design

Low-Fi Wireframes

The existing website appeared outdated and disorganized, prompting me to design these low-fidelity wireframes with a modern, clean, and sleek user interface in mind.

View available animals (both dogs & cats)

Become a volunteer

Donate to Sammy's Hope

Branding

To better embody the shelter's identity and bolster recognition, I created a color palette and UI elements that align with their social media branding.

Previously, the website featured a color scheme that did not align with their social media branding. Consistent branding fosters recognition and a unified identity across platforms, aiding user recall and building trust, professionalism, and credibility.

Click here to view style tile

High-Fi Wireframes

And with that, I created my high-fidelity wireframes, incorporating logos, colors, and images to provide a more comprehensive representation of this redesign.

View available animals (both dogs & cats)

Become a volunteer

Donate to Sammy's Hope

test

Usability Testing Goals

Getting initial thoughts the redesign...

I spoke with five participants directly over Zoom about their thoughts and opinions on the redesign. I asked them to complete three tasks on both mobile and desktop. e. Each participant took approximately 20 minutes to complete the three tasks as well as provide constructive feedback about the website. My main goals for usability testing were the following:

Assess users’ ability to independently navigate through the website
Identify completion rates and pinpoint potential barriers / sources of frustrations
Understand if users found this website to be enjoyable and user friendly
Gather insights how this website specifically addresses their needs when looking to adopt an animal and/or get involved with the shelter
Determine if the website now evokes a more vibrant and welcoming energy compared to the current website

Feedback

Participants praised the website's UI, highlighting its color palette and engaging copy!

I received some fantastic feedback about the app! All participants expressed how they can envision themselves, as well as their friends and family, using it.

Some other key insights from using testing were the following:

When asked about the emotions evoked, responses included happy, trusting, and hopeful, precisely reflecting the intended emotions I aimed for with this redesign.
Participants praised the website for its user-friendly design and intuitive navigation. They found it easy to use, encountering very few challenges.4o mini

Iteration #1

To accommodate both user and business goals, I incorporated two buttons in the hero section; one for donations and one for adoptions, effectively aligning with both goals.

Several participants voiced confusion about the primary CTA button in the hero section of the homepage, initially leading users to the donate page. While the main goal for users is to adopt an animal, the shelter relies on donations for its success. This dilemma raises the question; should user goals or business goals be prioritized?

Iteration #2

I decided to redesign the cards, which highlight various achievements, requirements, and ways to support the shelter, to clearly indicate that they are non-clickable elements to prevent user error.

Two participants attempted to click on the yellow cards. Given the lack of corresponding pages for most cards, I chose this approach as the most suitable option. By enhancing padding and reducing stroke size, I aimed to create a subtler design, mitigating user confusion and enhancing the overall user experience.

Iteration #3

To streamline user access to crucial information and facilitate convenient communication with the shelter, I created a centralized contact page housing all relevant contact details.

Previously, users could only contact the shelter through pop-ups or by locating the contact information in the footer. However, this posed an issue to some participants during testing. I decided to create a contact page so that users have access to all of the shelter's important information all in one place.

Final Prototypes

Desktop Flow

Interact with prototype

Mobile Flow

Interact with prototype

Metrics for Success

How will I measure success for this new feature?

To ensure your this feature succeeds, I would focus on these key metrics:

Website Traffic: Use analytics tools to measure the number of visitors and traffic sources. Look for growth in organic search traffic, social media referrals, and direct visits.
User Feedback: Gather qualitative feedback through surveys or user testing sessions. Ask visitors about their experience and what improvements they would like to see.
Conversion Rates: Set goals, such as volunteer sign-ups, donations, or interest forms and track how many visitors complete these actions.
User Engagement: Measure how long visitors stay on the site, how many pages they view, and how often they leave quickly.

Project Reflection

Taking a moment to reflect...

This project has been instrumental in my growth as a UX designer, particularly in the realm of desktop design. I faced challenges in adapting to desktop design requirements, leading to valuable learning experiences and skill improvements. Understanding diverse screen sizes and tailoring designs accordingly became clear priorities throughout this project.
‍
Underestimating the complexities of designing for both desktop and mobile interfaces was a notable realization. Navigating the amount of space available was a new challenge, and I found myself unsure how best to utilize it. Through practice and experimentation, I discovered various methods to utilize space effectively, a skill I aim to refine further in future projects.

Despite time constraints, I would have enjoyed delving further into branding, especially focusing on logo design to signify growth and better communicated brand identity. Despite finding this project more challenging than I anticipated, I found it to be a good learning experience. I now have a better grasp of the distinctions between designing for desktop and mobile interfaces, as well as the additional effort required for designing both. Plus, I really enjoyed getting to combine my love for animals with my newfound passion for UX design!