Westside German Shepherd of Los Angeles
Background
Westside German Shepherd Rescue has successfully saved and found loving homes for 13,000 dogs to date. As rescues continue to increase, WGSR needs a robust, responsive platform to match dogs with new homes.
In September 2020, I worked as the UX designer in a 4-person team to redesign the website interface with the goal of build trust and empathy of users, and also support organization for future website maintenance.
My Role
UX/UI Designer
Domain Research
Usability Test Interview
Methods
User Research
Design Strategy
Wireframes
Future Proposals
Design & Research Tool Kit
Challenge
The trust level from user to the organization is low, but why?
When I first start browsing on the website, as a user, I find it is hard for me to trust this organization because some information on the website are either mismatched or irrelevant. I cannot be confident about every click, thus if other users have same feeling as well, this organization might lose out on potential adopters.
How do we provide users with a trustworthy website experience without removing essential information and requiring frequent maintenance?
Research Phase - Domain Research
Understanding the needs and vision of a non-profit organization
To understand what users real need, I did some research about animal rescue organization and their users. WGSR’s target users are divided into two types: those who come to adopt a dog and those who wish to donate or help the organization. We need a way to entice the two types of users with the information they are interested in.
Major users who wish to donate care about 501(c)(3) certificate
Major users who wish to adopt a pet care about the cost
Research Phase - User Interview
Exploring adopters’ mental model and user behaviors
Then I ran a usability test on the current website helped us quickly discover users’ pain points and prioritize our tasks.
Research Phase - Persona
Visualize the target users as Charlie
After combining all of research results from our team, we have a clear path about what we need to do next. However, before jumping into design, we created personas to help us keep the user’s mental models in mind.
Concept Development
Our design went through a series of changes. First, we timed ourselves and brainstormed ideas on individual whiteboards, then we shared them on Slack to further develop the ideas and come to a common agreement. Finally, we brought our design into Figma and turned it into wireframes.
Final Design
Straightforward home page
To suit future maintain requests and build the organization's credibility, the re-architect of the home page is imperative.
Clearer the available dog page
Simple summarization on dog profile cards will help users easily find their ideal partner in massive data. The filter system also prevents the mismatch from the beginning.
Streamline adoption process on the application page
By differentiating the user flows, distinct user groups can see the information they care about most while using the new adoption application. The donation section after the completed application can arouse users’ empathy and increase the probability that they will also donate to WGSR.
Streamline the user flow of application page
Usability Test
We moderated tests for 3 desktop tasks and 4 mobile tasks with 3 different users
We compared the survey results from our 2 rounds of testing: the current website, and our new prototype. The results confirmed that we are going in the right direction, but there is still some space for improvement.
Self Review
Retrospective
Great organization leads to great efficiency. For this design, I did well by putting myself in the user's shoes to really understand their needs and solicit empathy for the dogs on WSGR. I also designed and organized my team’s entire library of components in Figma, and created our brand style guide.
Reflection
Keep being curious. We need to constantly be curious in order to learn new things. If we’re not familiar with the topic, do research! I learned by searching online until I felt comfortable and knowledgeable about the topic.