volunteer match
VolunteerMatch allows volunteers to search, find and connect with volunteer opportunities. Their users are their to connect with organization or conversely find volunteers for their organization.


teammates
Dwayne McFarlane
Tania Dawer Kanoujia
role
ux researcher
ux/ui Designer
goal
tools​
post-its
whiteboard
paper and pen
figma
sketch
methods
screener surveys
user interviews persona/development
problem statement
journey mapping
design studio
wireframeing
usability testing
iterative testing
rapid prototyping
To redesign VolunteerMatch in a responsive site in order to help users connect with volunteers and volunteer opportunities.
understanding the problem
We wanted to talk to participants who have volunteered in the past two years and who have visited VolunteerMatch.com or a similar website. After sending out a screener survey we met with 6 participants to see what their experience is like with volunteer sites. From their we synthesized our data.

While looking at our data we noticed similarities between the participants. We were able to interview people from all over the country and found that transportation in volunteer opputunites as well as flexabilty in availabilty were key facotrs to picking an oppurtunity.
Bryn, 33, teacher, Queens, NY
scenario
Bryn is an elementary school teacher who loves working with students both in and outside the classroom. She is looking for a volunteer opportunity for her and her friends.
goals
Wants to improve the lives of underprivileged children in her community.
needs
Local access to volunteering oppurtunies.

pain points
Relies on public transportation.
​
Does not like having to go through so many steps to volunteer.
behavior
Likes to work with non-profit organizations.
how do we improve our users journey?
For our team it was important for us to map out how Bryn finds volunteer opportunities. We wanted to understand and then explain how Bryn finds volunteer opportunities currently before we make any changes to the site. Through this exercise we found Bryn
s experience to be negatively impacted by the clutter of the site and by not being able to apply the correct filters she needs from the homepage.

search
review
-
Googled local volunteer opportunities on phone.
-
Selected volunteer website
-
Searched by available filters (location, type)
-
Browse results
-
Adjusts filters
-
Selects appropriate opportunity
-
Signs up
-
Completes volunteering event





refine
select
volunteer
defining the problem
Giving back to their local community by volunteering and
outreach is important to many people. Bryn loves to organize volunteer events for herself & her community, but has limited free time in her busy schedule. How might we help Bryn quickly find desired volunteering opportunities that fit her busy schedule?
getting to know what we're working with
We conduct a usability test on the current website to gain more understanding as to how users, like Bryn, are currently navigating through the site. Through three users we were able to pinpoint a few problems with the site.

User wanted the ability to search by date as many users had limited time to volunteer. Furthermore, user did not want to filter through opportunities that did not meet their time constraints.
We found that users do not want to sign up to the website before they were confident that they will find relevant opportunities that meet their criteria.


Users found the open field to be daunting. They were not exactly sure what they should type into this field and wished they had more direction.
After testing the existing sites we moved forward with a design studio. Implementing our new designs we created a mid-fi prototype to test. We discovered minor problems in our mid-fi and made changes based off our tests for the hi-fi.
homescreen
features
-
Users are able to register to the site using existing accounts from Google, Facebook, LinkedIn or by signing up with email.
-
Volunteers can select the available time slots that fit best fits their schedule.
-
Volunteers can enter the date that they wish to complete the volunteer engagement.
-
Automatically updates based on how many spots are left.

success rate
5/5 users were able to navigate through the menu.
findings
2/5 of users were confused by “spots left."
the progression of our designs

features
-
Modified location search bar.
-
Date selection. When clicked, the calendar will pop up allowing the user to select desired date.
-
Redesigned start button to reveal available matches.
-
Dynamic categories of available options that slide in based on the user’s input for location and date.
success rate
5/5 Users were able to navigate through the site and match with a volunteer program.
findings
1/5 of the users got confused clicking between icons. Users found that there was excess info on this page.
analysis
There is a lot of information on this page, which creates confusion for users.
sign up/volunteer pop-up
analysis
Combining the registration with the volunteer form made it easier for users to navigate. Users tried to skip over sections of the form.
creating a secondary breakpoint
We wanted to create a simple yet easy to use version of the mobile app, that would allow users to quickly look up oppurtuites on the go. While interviewing users we found that 4/5 of particpants would equallly look up the site on their phone or desktop.


features
-
Reduced amount of text on home page.
-
Stacked positioning of location and date search boxes.
-
Filters are stacked and clearly labeled. Location, settings and date automatically transferred from homepage.
-
“Causes Area” selection moved from homepage to filter page on mobile breakpoint.
takeaways
From our usability testing we recognize that there are several steps that can be taken to further improve the VolunteerMatch website. Conducting a usability test on the icons on the homepage drop down to see if users are able to understand them. In our next sprint we would focus on the search page, conducting a cord sort to understand how the filters should be categorized and simplified. One key takeaway from this project is how important it is to design information fields in a way that make filling out the required fields more enjoyable and less like a chore for a user.