MySurrey volunteering hub

MySurrey volunteering hub

MySurrey volunteering hub

engaging the city of Surrey's under-19 population with local governments

my role

my role

my role

designer - synthesize insights, prototypes, interviews, secondary Research, heuristic analysis, user tests

context

context

context

I worked on a brief set by the City of Surrey with two other designers. The problem we were tasked with was engaging its under 19 population with the local government’s services and programs. We derived three insights from our research which helped us scope in on providing a redesigned volunteer hub that is of interest to Surrey students in Grades 10 - 12. Our final solution was an extension of the MySurrey web application offered by the City of Surrey.

The prototype can be found here.

highlights

highlights

highlights

MySurrey Main Page

Onboarding

Volunteering Hub Home

Filtering and Sorting

research during the pandemic

We conducted primary research through interviews and surveys for this project. We had two surveys posted on the Simon Fraser University subreddit and the Surrey subreddit asking about people’s experiences with their city services. This was useful for us to understand people’s perception of city services and how they use (or don’t use) some city services. Many of the respondents said there are no services the city offers that cater to them. I also personally conducted an interview with a high school student from Vancouver. It was insightful to get a high school student’s thoughts and feelings about engaging with city services.


Due to the COVID-19 outbreak, it was difficult to find primary sources for our research. We did not have easy access to high school students in Surrey. Some of our data was based on our own experiences in school and current high school students from Vancouver and Burnaby.

key insights

key insights

key insights

We used an affinity diagram shown below in Figure 1 and derived three key insights based on our research:

Figure 1: Affinity Diagram

1.

The content of the promotional information is too broad and lacks a target audience. The information is not reaching Surrey’s Youth because the majority of it is not of interest to them.

2.

Youth are most interested in services such as recreational activities and events, many of them wanted to volunteer and not necessarily participate themselves.

3.

There are too many services being offered that aren’t catered towards what Surrey Youth are looking for, so they tend to ignore the services in general, even though some would be beneficial or interesting to them.

reframing the problem

These insights helped us scope in specifically on providing a service that is of interest to Surrey High School students because it meets the need of fulfilling their volunteering requirements. We reframed the problem using a how might we statement:

"How might we engage with secondary school students regarding volunteer opportunities to help them complete their 30 hours of volunteer experience?"

their current volunteering website had tons of usability issues

The City of Surrey was using a third party platform called Better Impact (shown in Figure 2) to display their volunteering opportunities. This website was lacking in modern web usability standards and was difficult to use. We ran a heuristic analysis to dive deeper into the issues and find possible opportunities to use in our solution.

Figure 2: Better Impact Website

Figure 3: Heuristic Analysis of Better Impact Website

constraints

One of the constraints we worked within during the design process was navigating the challenge of a limited budget for implementing new features. The City of Surrey did not have the resources to create an entirely new app or website. Recognizing the need to utilize existing platforms, we ideated potential solutions focusing on the existing MySurrey website. This ensured that our solution could be integrated seamlessly within their platform without the need for an entirely separate app or website.

solution

Working within this constraint, we designed an extra section in the MySurrey website focusing on volunteering. I worked on the onboarding process for new users (Figure 4), volunteering history to track hours (Figure 5), and creating several filters to help users search for the right volunteer opportunities for them (Figure 6). I also worked on creating the interactive prototype using Adobe XD.

Figure 4: Onboarding

Figure 5: Volunteering History

Figure 6: Filtering and Sorting

key takeaway

key takeaway

key takeaway

A key takeaway from this project for me was working within the client’s constraints. Our team’s original idea was to create a new app and offer volunteer services from there. However, the City of Surrey does not have the budget or resources to build a completely new app for volunteering. Although this was a school project, we wanted to design a product that could be feasibly implemented upon completion. We changed our direction and focused on building our solution on top of an existing product or service the City of Surrey already offers.

© 2024 william dang

made with ceremonial grade matcha and oat milk