Giv.

Website making volunteering easier and more accessible during the Covid pandemic

Context: HCDE 318: Intro to User-Centered Design

Duration: 10 weeks: Winter 2022

Tools: Figma

Team: Kristie Lee, Annie Lu, Abbie Sawyer, Daphanie Chan

FINAL DESIGN

*keep scrolling for our design process

Our final design came from an in-depth design process where we collaborated as a team with different research perspectives to fit the needs of our target demographics. We put our users first when designing our web-based platform.

Problem

Addressing the post-COVID shift in user needs, this case study focuses on designing a website or app that effectively addresses new challenges and requirements arising from the pandemic, ensuring relevance and usability in the current landscape.

Solution

Our website provides a service to post and browse volunteering opportunities. What makes us stand out is our "quickGiv" feature. Since quarantine, time seems to move faster as people have more and more to do. "quickGiv" features an option to find short and quick volunteering gigs.

RESEARCH

Key Insights

​These insights were gathered through our interviews with those with volunteering experience

  • Many of these nonprofit volunteer organizations lack adequate advertisement exposure to attract more volunteers to help out amid the pandemic, which leads to downsizing the organization and its efforts.

  • It can be helpful for the volunteers to see descriptions of the duties, the environment, and the situations they will be placed in.

  • In-person contact during COVID-19 may make some people wary, so finding alternative methods of allowing volunteers to contribute is critical during times like these.

  • There are few websites to find volunteer opportunities, especially since it’s not a money-heavy industry.

  • Creating an app/website that is very user-friendly and easy to navigate for those who aren’t tech-savvy is crucial to targeting the valuable, older generation that makes up a large population of volunteers.

Personas

​We developed personas that combined our interviewees, This gave us a specific persona to design our final web page for.

Our younger persona, Paige, who makes up a large majority of volunteers

Our older persona, Cindy, who also makes up a large majority of volunteers

User Journey Map

Our user journey map follows our key user's journey through our projected product, noting her emotional response through the process

Revised Problem Statement: How can we make the process before volunteering most efficient and highly functional for both the volunteering organizer and the volunteer?

Design Goals

Through combining our research above and comparative and inclusive design analysis, we compiled key design goals for our website.

  • Finding a volunteering opportunity that caters to the user's interests is easy, intuitive, and conceptual

  • Chatting between the volunteer and volunteering organization is simple to navigate to

  • Uploading a volunteering opportunity is intuitive and also customizable

DESIGN

Story Boarding

Storyboarding was a great way for our team to illustrate the many different features we wanted to include in our final product. It also helps our team brainstorm and prioritize the different features we should include.

Information Architecture

Our informational architecture allowed us to map out what features we include and the pathways feature brings us through. This helps organize our work in preparation for our low-fidelity wireframe

Wireframing

Our team used Figma to create a low-fidelity wireframe of our final website. This encouraged us to only focus on the functions and not get distracted by colors and other design features.

We realized here that we needed to shorten the amount of features that we had as we were dealing with two types of users. This included the volunteer and volunteer organizations. We simplified our functions and focused on making the usability of the few we kept. optimal.

FINAL DESIGN

We made it! Our final design came from an in-depth design process where we collaborated as a team with different research perspectives to fit the needs of our target demographics. We put our users first to design our web-based platform.

REFLECTION

Every step has a purpose: Initially, some of the processes in the research and design stages seemed to be busy work. However, as our team came together with ideas, we uncovered practical solutions we wouldn’t have initially thought of

Designing through Practicality: I wish our team could have gone back through the design process and made a cleaner and more defined brand to build our high-fidelity prototype. We gave our design an older look to adhere to older generations, however, looking back it could use another revision.

Overall: I am proud of my team for completing this project, especially since it was many of our first time’s going through the whole research and design process. I learned a lot about different design and research techniques and am excited to apply these design stages to future projects