The Animal Hope and Wellness Foundation
Summary
A two week case study that delves into redesigning the AH&W by restructuring their IA, UX and UI elements to promote adoption through their site.
Tools
Adobe XD
Photoshop
Illustrator
InVision
Role: UX/UI Designer
Storyboard
Style Guide Redesign
High Fidelity Prototype
Research
https://animalhopeandwellness.org/
The Animal Hope and Wellness Foundation is a non-profit organization focused
rescuing abused and neglected dogs
providing full rehabilitation services
providing adoption services
Based on the AH&W’s mission statement, however, our group realized that their current interface did not encourage users to adopt. We decided to rebrand the AH&W by focusing on redesigning their UX and visual systems for the adoption process.
opportunity
Our team began with a SWOT analysis to identify the problems of the current Animal Hope & Wellness site in order to redesign it better.
Key Findings
Dead social links
Inconsistent alignment and spacing
Irrelevant images
Little to no icons
User Interviews
Our team then decided to conduct interviews with people who had adopted dogs in order to gain better insight about the adoption process since none of us had first hand experience.
NICKI KIM
“The hardest part was choosing a dog that would fit with our personal lifestyle and home in general. We wanted a dog that we could take hiking and running but that would also be gentle enough to have around my at-the-time very young brother.”
Most people were not looking for a specific breed or purebred when choosing to adopt. Instead factors like personality and temperament were highly considered because most people wanted a dog that would fit their home, family and lifestyle.
Concept
The current adoption process on the AH&W site is confusing to navigate for the average user. The poorly designed UI and grid system loses legitimacy with the user and fails to provide information in a visually pleasing way.
Our goal was to redesign the AH&W site to fit a warmer voice and increase adoptions by:
Condensing information in a way that’s not so text-heavy
Increasing the use of visual aids through icons to further break up the text
Incorporate a warmer color palette
Include higher quality images that fit the overall concept
USER PERSONA
STORYBOARD
style guide
Wireframe
High-Fidelity Prototype
We were inspired by dating apps like Bumble for our redesign because attraction to anything is instant.
We prompted for a 3 column layout to best present the cards and make use of the space.
We also decided to list the information of highest priority such as the name, age, breed, and gender of the dog on the card.
On the individual dog card, we included a carousel that users can use to see different images of the dog.
Along with a description of information, we also added a bar highlighting 3 personality traits to help users get to know the selected dog better.
Future Development
The 2 week time constraint limited our project but some opportunities for the future would be:
There are approximately about 30 dogs available on the current directory so we would hope to partner with more shelters to provide more adoptions.
Adding more filters to help users narrow down their choices.
Creating a log-in account for users to save the application process which would allow them to move forward and backward in the application process.
Use consistent images by shooting dog profile images on a backdrop or consistent background and inputting videos.