UX Researcher
UI Designer
2 Designers
7 Developers
2 Marketing
Adobe Illustrator
Miro
Overview
Introduction
Tech4Good aims to help charities with digital transformation by connecting student volunteer resources with them. Under the support of a list of non-profit organizations, our team built a mobile application that connect student volunteers and charities. We collaborated to design and develop the app.
Problem
- Many high school and college students are looking for opportunities to practice skills under real-world scenarios. However, it is hard for students without much experience to find an intern in a company.
- Charities face issues when transferring into the digital world. Many of them do not have enough budget to hire professional workers such as developers or designers. Without technical support, fundraising and recruitment become even difficult.
Goal
Build connection between students & charties and match the skills
- Encourage students to donate time and skills to projects they are interested and feel engaged in a new community
- Provide technical support and bring innovative solutions to charities.
SOLUTION
Final Outcome
1. Personalized volunteer opportunities
- Know about users' interests through onboarding
- Custimize the exploring experience
2. Explore projects
- Search and filters according to keywords
- Highlighted skill sets and areas with tags
3. Read detailed information about charities
- Understand their missions and values
- Build trust with the organization
- Learn about what types of skills they are looking for
4. See application and progress
- Record past experience and track applications submitted
Design Research
Interview
We want to understand students' attitude on volunteer work and their motivation from their past experience.
I interviewed 4 college students as well as 2 workers from chartiies to get insight from different stakeholders.
Insights
From Students
More than 95% of them believe that volunteer work can make the world a better place and would like to contribute to social good. However, many of them complain that the works are sometimes tedious, and they cannot learn skills they want based on their past experience.
.jpeg)
From Charities
Many charities find it difficult to recruit volunteers with technical skills such as coding, design, marketing, research, etc. They want to have more conversations with the student group to receive innovative solutions from them instead of just providing them with repeated labor.
"How might we create a platform that
help college students to look for volunteer opportunities they are interested in and encourages them to donate time & skills to charities?"
IDEATION
User Persona
Student Echo: looking for volunteer opportunities
Student tony: Seeking for real-world problems and projects
Charities coordinator Emma: Asking student with skills for help
Pain Points
Students need a platform that integrate volunteer work opportunities at one place so that they can quickly find works and projects that match their skills sets.
Charities need a process of recruiting student volunteers with a variety of skills.
Design Goal
The goal is to design and develop an easy-to-use mobile App to match students with volunteer opportunities in charities. It helps college students look for volunteer opportunities they are interested in and encourages them to donate time & skills to charities.
Brainstorming Features
Based on the user pain points, I thought about possible features Tech4Good could have.
.jpg)
Key Features
- Project based opportunities. Charities provide detailed information about a specific project the students are going to work on.
- Sort and search function when displaying information.
- Organize informtion about charities and organizations. Help students to know about their values and past projects, and make decisions about whether to join.
- Application Tracker. Students can quickly know where they are during the application process
Information Architecture
Key features are included under the four main sections: Projects, Charities, Progress, Profile.
DEsign Process
Wireframes
Low Fidelity 1.0
User Testing
I asked 5 users to test the prototype and collected feedback. 2 of them found difficulty when using the homepage and it struck their process of exploring other pages.
I redesigned the home page to keep it clean and informative.
Color and Typography
I chose blue and red as primary colors since these are the two that correlated with "tech" and "social good." Blue implies the efficiency of technology. Red is often used for charities and it symbols a warm heart of the donators. The two colors can symbolize the two communities that our team is trying to connect.
Logo Design
I designed the logo for the app based on our mission of "tech for social good." The plug is similar to the Chinese character character of 益, which means good. The plug also implies our belief that tech can empower the charity sector.
How to improve
Next Steps
A version for non-profit organizations
Currently we have a questionnaire that ask charity workers to fill out about their requests. Then the data would be uploaded to our system. We are going to work on a website for the organization end to help them send requests and manage application more easily.
Our continuing effort
We held Tech4Good Hackathon in December
Tech x Good 48 hour Hackathon
In collaboration with VMware, DFRobot, LadiesWhoTech, we organized a Hackathon that looked for participants to solve 3 real-world problems faced by 3 charities, including topics on accessibility, data privacy, and education inequality. We attracted 100+ participants submitting 20 technical solutions.
As one of the co-founders, I designed graphics for marketing and engaging activities that allow participants to better understand the charities' situations and enhance their experience.
Reflection
What I Learned from the Experience
1. Leadership and effective communication
In this project I worked with a large group with project manager, developers, marketing and outreach teams. As the Design Lead, I learned how to organize team meeting to communicate efficiently and hand in works between teams.
2. Understand limitations
Due to time constraints, we are only able to design the app for student to look for projects they are interested. It is important to scope the product by reviewing limitations. We also want to design a website version for charities to create posts and manage applications in the future to bring a closer connection.
3. Consider with all stakeholders
Although this app focused on students as primary users, it is also important to consider the feasibility for charity workers since we are helping to bridge the connections. I hold constant meeting with charities to present our ideas and report our progress.