Website Redesign
DOCPAC: Improving pet adoption, donation experience, and events
Overview
CLIENT: DOCPAC.net
ROLE/RESPONSIBILITIES: UX Designer
Team of 3 (part-time project)
PROJECT DURATION: July 2020-February 2021
About DOCPAC: Established in 1963, DOCPAC (formerly Six Flags Humane Society) has been part of Victoria, TX for a long time. Its mission is to shelter homeless pets and get them adopted.
Contribution to project:
- UX Research 60%: survey, user interviews, affinity mapping, card sort, site map, heuristic analysis, competitive analysis, user testing
- Design 25%: Design Evaluations, Iterations
- Design Direction & Discussion: 15%
To skip to sections:
Challenges
Selected Artifacts from Research
Design Changes
User Testing
Challenges
DOCPAC’s website looks outdated compared to pet adoption agencies such as Friends for Life animal shelter and major adoption agencies, such as ASPCA or Austin Pets Alive.
On closer inspection, there were many inconsistencies and critical failure on its donation page.
3 Goals for Website Redesign
1
Adoption
Increase Adoptions
2
Donations
Increase Donations
3
Events
More community outreach
UX Process
The UX process is typical but I started the process by combining user interview with user testing to discover areas for improvement.
1. Discover
Survey
User Interviews/User Testing on current site
2. Analysis
Heuristic Analysis
Competitive Analysis
3. Design
Prototype 1
Design Evaluation
4. Testing
Design Iteration
Selected Artifacts from Research
Current Website Analysis and Findings
1
Heuristic Analysis
Look for areas for improvement
2
Competitive Analysis
Find Opportunities
3
User Interviews
Find user wants, pain points
The website was analyzed using these techniques: Heuristic analysis, competitive analysis and user interviews.
Below is a summary of findings.
Heuristics: A Few Pointers
- need better page organization
- needs consistency in links, wording, process
- no search/sort/filter for pets
- disappearing/reappear donate button
Competitive Analysis: SWOT
Strength
Opportunities
Weakness
Threats
User Interviews
- missed opportunities: sharing, adopt button
- confusing forms
- streamline donation page
- image mistaken for banner ad
- cannot find event page
- photos are important
- dedicated to owning a pet and will go to length to secure one
- lack of right kind of information on pet adoption website for users to determine if pet is right for them
- users want a pet for family, as companion for another pet or for themselves.
Heuristic Analysis Example
From the donation page of the current website: submit button only appears after you check the “Agree” box. This affects donation because users could quit as they can’t see the submit button. For this reason, there is a failure in visibility of system heuristic.
A Snapshot of the Affinity Map
Some insights:
- users want to see large pet images
- users want to know the history/behavior/personality of the pet they are interested in adopting
- forms need clarification
- content writing can be improved for clarity or more “friendly” , less impersonal tone
Design Changes
current Adoption page
Adoption Page Iteration Round 1
Design Iterations: Before/After
Pet Page
(From left to right, top to bottom) the pet adoption pages went through several iterations. Some of the changes that were implemented included: larger pet images, changes to the wording (e.g pet size to include weight, pet fee instead of pet price, button to adopt, links to share pet info. These were all based on user interviews.
Adoption page later iteration
Final design
Event Page
DOCPAC did not have a “EVENT’ menu item on their website. Their event calendar did not have many events. Sometimes it is empty.
- Event page will allow them to post all their events. It would be easy to locate.
- Visitors can see past and current events.
Event Page Iterations
Event Newsletter
A Newsletter template was created. Why? One of the competitive advantage is keeping audience engaged and loyal.
This newsletter was created with this intention, with events and suggestions based on pet holidays to help foster community–through knowledge sharing and promotion of DOCPAC pet events.
This is a proposal–It depends on whether there is staff to implement the newsletter and measure user engagement. DOCPAC could use the pet holidays calendar as inspiration for their events, even if they do not want to do newsletters.
Of course, this would need to be tested with user to determine user needs. We would need to look at click rate and open rate to determine user interest and engagement. This is a low cost/easy to implement method worth checking out.
Site Map Improvement
Site map based on Google Analytics
Current DOCPAC Navigation
Google Analytics data for top visited pages
User Testing: Color Changes
Above are different “red” colors that were considered for the donate button, as well potential change to the navigation, should users have difficulty navigating.
Red colors above were from Google Colors tool.
Color Contrast
Potential rearrangement of Navigation
Challenges & Takeaways
Some challenges:
- finding users to interview: even when we received “yes” from survey
- limited data: google data for navigation/user data was limited from website
- interviewee preferred phone interview. We had to figure ways to record the phone conversation.
- It was challenging to recruit users from Victoria when we are 2.5 hrs drive away.
Some takeaways: What did I learn
- Not perfect but it’s a start: I leaned on my UX network for remote recruitment: user interviews and testing
- Do detective work on users to help to build during interviews
- Sharing and discussion: design is better via knowledge sharing and team discussion
Next Steps
The prototype is mostly done. We decided to go ahead, send the project to get approval, and put it in development. Once website is launched we will look at metrics and iterate where we find problems.