SPARC Redesign 🐾

Santa Paula Animal Rescue Center Redesign
Overview
Since the pandemic, adopters have heavily relied on digital platforms to learn about adopting pets. They’re looking for a reliable platform where information about pets is transparent and easy to locate. The combination of a streamlined adoption process and virtual interaction with the animals will help potential adopters patronize rescue centers.

The goal of this redesign is to help potential adopters better navigate rescue centers via the combination of a streamlined adoption process and virtual interaction with the animals.
Role
UX Designer
User Research, Visual design,
Prototyping & Testing

Tools
Miro, Figma, Procreate, Photoshop, Zoom

March 2021
*Please access this project on a desktop or tablet for a better viewing experience. Please also note that all testing was conducted virtually through zoom due to pandemic restrictions. Parts of the material shown was made in collaboration with creators Jacob Vazquez, Yusra Iqbal, and Kyle Cheng.
Background
Problem: The current Santa Paula Animal Rescue Center site is difficult to navigate and text heavy. Its key workflows — adoption, donation, & volunteering — are complex and tough to follow.
‍
Solution: An overall visual revamp for the site to become more engaging for the user and a streamlining of its key functionalities: adopting a pet, donating to the center, and applying to be a volunteer.
Research Phase: Discovery and Definition
To the right is a proto-persona, a representation of a target user for WIC. Looking at the assumptions of different stakeholders helps to round out these target users and connect the design with real people.
Collecting Insights
After user interviews, we collected and noted some main points for each user
To the right is an affinity diagram sorted into categories
Survey
Conducted via Google Forms
Total responses: 26

This survey served as an add-on to initial interviews to help widen limitations amid the pandemic.

The four categories represent how the responder obtained their pet (no pets, from a breeder, adoption, from another household).
Interviews & User Insight
After user interviews, I collected some main points from each user and put together this visual to keep our pain points in the foreground for the remainder of the project.

Usability Testing

Four users were then led through Usability testing. They were requested to perform five tasks on SPARC’s current website.
There tasks were to: 
            1. Go through the cat adoption process
            2. Make a General Donation
            3. Find out information about volunteering 
            4. Locate hours and address of the center
            5. Learn about the Bungalow Sponsorship

Takeaways:
Most subjects had difficulty with tasks one and four; there was no explicit location listing both the hours and the address of the rescue center and since the cat adoption workflow is interrupted by a third party website or an optional PDF application, they were unable to get to the last stage.

Some other feedback heard from the users included:
            • Overly outdated website look
            • Decentralized application process
            • Text heavy pages, overloaded with information
            • Not enough pictures of pets listed for adoption

Breakdown of SPARC's Current System

Competitor Analysis

User Persona
Since the pandemic, potential adopters like Isabelle have heavily relied on digital platforms to learn about adopting pets. They’re looking for a reliable platform where information about pets is transparent and easy to locate. 
Ideation
Brainstorming can help generate new ideas and inform which features to consider.

I like/I wish/What if is a brainstorming tool that finds ideas through the lens of the present, near future, and distant future.
Feature Prioritization is a graph-like tool that helps identify the most important problems to solve first. This tool helps highlight which features optimize for feasibility, desirability, and viability.

Storyboards are a great tool for visually predicting and exploring a user’s experience with a product; I decided to create this story board in order to facilitate visualizing the impact of the product experience and user-product interaction of SPARC.

Site Map
Here's a look at a basic site map for the site navigation, focusing on the adoption workflow.
And the footer site map, including social media and contact buttons grouped into utility features.

After some structural organization, we pieced together a comprehensive user flow for our redesign, concentrating on the
"Adopt", "Donate" and "Volunteer" branches.

Wireframing Sketches
I focused on the home page for the mobile design, trying  a page with a hamburger menu and one without.
Here are some other wireframe sketches produced by the rest of the team; one set highlights a laptop interface and the other focuses on the mobile donations workflow.
LowFi Wireframes
To the right are some examples of the low fidelity wireframes we pieced together. From left to right is the home page, cat profile page, Buddha Buddy page, and an adoption application.
LowFi Guerrilla Testing & Iterations
While we weren't able to conduct our guerrilla testing in coffee shops or other public settings, we did our best to replicate the experience virtually by collecting a randomized set of 10 subjects and treating the calls as you would if you were to have a quick chat with someone on the street. We also asked the subjects to come prepared with a warm drink of their choice to soften the tone of the call and rewarded them with Starbucks gift cards after the testing.

From our testing results we created a few iterations to pass onto our HiFi model.

First, focusing on our donation page, we removed the donation type hierarchy for a more streamlined browsing experience (as shown in the image on the right). I also combined “Become a Sponsor” and “Bungalow Sponsorship” into “Be our sponsorship” for clearer categorization.
Next, I took a closer look at the Cats and Kittens page and made these changes:
‍
 1. Moved the filtering options to the center so it’s easier to read from top to bottom (this also helped ease up the margin).
2. Resized the pet images so it’s easier for the eyes to browse and scan the page.
3. Added a search bar so that users could search by pet name.
Style Guide

HiFi Prototype

HiFi Usability Testing

Four users were requested to perform the following tasks to test the high fidelity prototype:
            1. Go through the cat adoption process (apply to adopt a cat)
            2. Learn about the Buddha Buddy program and make a donation (any amount)
            3. Find out information about volunteering 
            4. Learn about the Bungalow Sponsorship
            5. Locate hours and address of the center

Takeaways:
Our users were able to complete all of their five tasks. They also reported that locating information was generally straight forward. Additionally, most users noted that they found the design including the pictures and colors engaging and interactive.

Points for improvement:
           • Content display is too large (users reported needing to scroll a lot)
            • Too much colored text
            • Confusing wording for a link in the cat adoption page
            • Some users found the fixed donation button distracting

Final Thoughts
Usability testing has helped to show that the new site infrastructure for SPARC is easier to navigate. Users had less difficulty completing tasks and many noted that the overall look of the design felt nicer to interact with and left them with a positive experience.

There is still much left to accomplish with this project -- accessibility testing, prototyping the virtual features, and branching out the educational side of SPARC's mission such as pet owner information and pet health.

We were lucky enough to be in contact with the Santa Paula Animal Rescue Center, sharing our updates and iterations along the way, however an important next step would still be to meet with them and demonstrate our current prototype (this has been a little difficult due to pandemic restrictions) and go from there.

More projects