Erik Zimmerman
Project Vision
The Little Rock Animal Village (LRAV) is much more than your average animal shelter and is responsible for over 20,000 animals adopted. However, I found their current website well below average from a UX/UI standpoint. For this project, I worked with the staff and volunteers of the village to provide their website with a much-needed overhaul. Adopting the right pet from a shelter is a difficult process and my redesign aims for simplicity to facilitate the next 20,000 adoptions.
Challenges
1. Balance stakeholder requirements with target user needs
2. Promote the animals while also highlighting the mechanisms that keep the shelter staffed and funded
3. Create a minimalistic interface to maximize the attention given to animals and other services
4. Make the adoption process as simple and linear as possible
Understanding the Organization
To kick off my redesign, I contacted the animal shelter and managed to sit down with two staff members from LRAV. After all, who would understand the target user better than the people that interact with them on a daily basis? Their insights would prove to be invaluable as I gained a better understanding of their organization. This knowledge was used to establish a framework for what their website should accomplish and the problems with the existing one that needed to be addressed.
Out of all adoption applications that are submitted, 25% come from online submissions
People frequently show up outside of adoption or visiting hours and leave disappointed
Around 1 in 10 adoptions fail, with the animal being returned to the shelter
Due to consisting largely of volunteers and their amount of responsibilities, only 70% of animals are represented on the website at a given time
Understanding the User
Meeting with the organization helped me identify my target user group. These users are between 30 and 65 years old, usually have a family, and it's not uncommon for them to already have at least one pet. Typically, the people on their website are there to browse adoptable animals and will reach out to inquire about them if they find one that catches their interest. While this is unsurprising, the current website gives higher priority to volunteering and fostering opportunities as well as donations.
Of the four research participants, all of them felt the current website was cluttered and difficult to navigate. They wanted a better way to check out the animals to know if it was worth visiting the shelter to meet their candidates in person. My main challenge was to meet this need while promoting the other aspects of the shelter that are vital to its continued operation.
Meet the Users
PRIMARY
Name: Deborah
Age: 43
Occupation: HOA Manager
Deborah has been married for almost 15 years and has two boys and a girl that all agree they want a new pet. Her husband works full time and she does part time work for her HOA while taking care of her kids and Benny, her golden retriever. Benny is getting older and an amazing dog that could use a new friend at home.
SECONDARY
Name: Andrew
Age: 31
Occupation: Personal Trainer
Andrew is a single young adult that teaches fitness classes at a local gym. He promotes an active lifestyle and recently lost his pitbull fitness partner whom he would jog with every morning. He is seeking a new companion to spend his alone time with and to pet in between sets during his at-home workout routine.
SUPPLEMENTARY
Name: Eugene
Age: 64
Occupation: HVAC, Retired
Eugene has recently retired from a career as a HVAC contractor following the passing of his life partner. He has two kids, both with families of their own that visit a few times per year. He is interested in finding a relaxed, older pet to spend time with at home to care for.
Key Pain Points
1
Failed Adoptions
There is a notion that animals in shelters can suffer from behavioral issues that can lead to a poor fit, especially when other pets or children are involved
2
Breed Information
Adopters want to know the breed of the dog along with common characteristics such as health concerns, size, and temperament
3
Adoption Process
People want to focus on the animals and choose one. A complicated adoption process divides this attention, leading to frustration and an increased drop-off rate
4
Forms
Long and confusing forms lead to failed conversions. The adoption application should be human and respectful of the users time
The User Journey
I constructed a diagram of the flow showing the steps the user needs to take to achieve the primary goal of choosing an animal to adopt and submitting an application. This framework helped to understand how the navigation would align with user goals.
Wireframes
Homepage
Business information, including the adoption hours and button for the donation menu are top of page to be the first thing users see.
The mission statement and video introduction to the shelter are shown above the fold to give users a quick overview of LRAV. This promotes volunteering and fostering, two critical aspects of keeping the shelter running.
Since most users are here to look at the available animals, immediately after introducing the shelter is a horizontal scroll menu for users to view the available dogs and cats.
Clicking"Adoption Procedures" triggers an overlay outlining the process for adopting the type of animal in the corresponding list. Within the overlay is a button for submitting the adoption application. This allows users that have already visited the shelter and chosen an animal to access the adoption form in two clicks.
Pet Profile Page
Specifics regarding the selected pet are shown above the fold, providing an overview of the animal.
Adoption procedures are shown on multiple pages so the user can access this info when they are ready. The call-to-action button is placed prominently
User research indicated size, lifespan, and health concerns along with temperament are crucial pieces of information to consider when adopting an animal.
This is an idea taken from Petfinder and is a stat sheet showing a 1-5 rating for characteristics such as friendliness to other pets and ease of training. A disclaimer at the top advises users that while these ratings are typical of the breed, every dog has a unique personality and to contact the shelter for further information.
Low Fidelity Prototype
The low-fidelity prototype shows the primary user flow of browsing adoptable animals, selecting and viewing an animal, and submitting an adoption application.
Usability Testing & Iteration
Usability testing revealed a few issues with the horizontal scroll of the adoptable animals on the homepage. Due to the length of the list with each button click only revealing three more animals, most users found this ineffective to browsing. Additionally, the hover effect was distracting and unnecessarily hid the dogs' information.
The first change I made was shortening the length of this list by only featuring the new animals available for adoption. Most users mentioned they would prefer to wait for the right animal to adopt rather than selecting from what's available at that time. This allows returning users to have a quick overview of their new options. A drag-triggered scroll bar replaced the button-based scrolling, the cards were redesigned to appear more clickable, and a radial gradient was applied to the background to give a spotlight effect, drawing focus to the center of the screen
My original adoption application tested poorly with users, with most saying they would dread filling out the form I designed. Since the submission of this form was determined to the primary user goal, a complete overhaul was required.
First, I asked the staff at LRAV what questions were necessary to see how I could shorten the list of questions to be answered in order to respect the user's time. Then, I broke up the fields into multiple steps while organizing the prompts by relevance to one another to make the process feel less daunting. A single-column layout was implemented to lessen the strain on the user's eye. Finally, a breadcrumb trail allows the user to assess their progress through the application and to go back as needed.
High Fidelity Prototype
Home - Pet Profile - Adoption Procedures
Mega-menu for Donations, Fostering, Volunteering, and Merchandise
Adopt - View Dogs - Search
Adoption Application Flow
Conclusion and Next Steps
The new LRAV site is designed to prioritize the animals while also promoting the other facets of the shelter that keep it running. A more straightforward adoption flow with a streamlined application led to a 25% higher conversion rate compared to the original designs, equaling more animals adopted into happy homes
Redesigning the Little Rock Animal Villages website showed me the challenge of balancing stakeholder requirements with meeting the needs of the target user. I also learned about the methodology of creating responsive design and enjoyed the challenge of adapting my layouts to varying screen sizes while retaining visual consistency between pages.
1
Work with the LRAV organization to iterate on the merchandise section with more high quality photos for consistent sizing between items to create a more conventional marketplace layout
2
Conduct another round of user research to develop the “Resources” section with information that would be effective in helping people decide what type of pet to adopt
3
Implement videos of the individual animals on their respective pages for further representation of the animal without having to drive to the shelter. Take testing data from this to stakeholders to advocate for this feature