Empowering communities through volunteerism – a purpose-driven app fostering connection and positive impact.
Creating an End-to-end App
Lead UX/UI designer
4 - 6 weeks
Tools
Project type
Figma, Procreate, Maze, Optimal Workshop
Independent project
Timeline
My Role
As someone who's passionate about community engagement, I've seen firsthand the challenges people face when trying to find the right volunteer opportunities. Many of us share a desire to make a positive impact, but we're sometimes held back by the complexity of finding the perfect match. So, I started wondering – how can we make this process easier and more efficient?
There is a significant gap between individuals who are eager to volunteer and organizations seeking dedicated volunteers, often resulting in missed opportunities for community engagement and social impact.
The problem
So, I rolled up my sleeves and created Wave, a user-friendly app that simplifies the volunteer discovery process, connecting like-minded individuals with opportunities that fit their passions and timetables.
The solution
Laying the foundation
What are the main reasons why individuals in America are not actively volunteering their time, despite expressing a desire to do so?
Research questions
What are the specific challenges and obstacles faced by potential volunteers?
How can technology and gamification be leveraged to address these challenges and motivate individuals to engage in volunteering activities?
What are the key features and functionalities that users expect from a volunteerism app (i.e. volunteer opportunity postings, user profiles, scheduling tools, communication channels, and digital incentives)?
Preliminary research
The benefits of volunteerism are abundantly clear, so, why are only 23.2% of Americans actively volunteering their time although data shows that up to 90% would like to?
I started with white paper research to examine volunteerism trends at both national and local levels. One article published by the Associated Press interviewed various volunteers, inviting them to talk about their experiences with volunteering. One person's response really stood out to me:
“There are people that maybe want to do something, but they don’t really know that there are organizations out there that offer them that opportunity, that experience. And it is that lack of knowledge that sometimes prevents people from going out there and participating in community service.” Gadi Hernandez-Corado
User Interviews
4 out of 5 interview participants reported a decline in their volunteer engagement over the past year
Background research revealed that there are multiple benefits of volunteering. However, I wanted to pin down what would motivate people to utilize a volunteering app.
I conducted interviews with five people between the ages of 21-28 who actively volunteer, have volunteered in the past, or desire to volunteer their time. I asked them a series of questions to determine current pain points in their process for finding volunteering opportunities and to get an idea of what motivators/barriers exist when considering volunteering. I then organized this data using an affinity map to highlight key themes and insights of my findings.
A look into the competition
There are currently no platforms that seamlessly integrate volunteer opportunity discovery with robust tools for users to efficiently track and manage their availability and schedules
While assessing the top four competitors in the volunteer sector and drawing insights from user interviews, a significant gap became evident. There's a lack of prominent volunteer discovery apps that effectively assist users in integrating volunteering into their schedules.
Among these competitors, POINT comes closest by allowing users to filter opportunities by preferred days. However, it still falls short of providing the comprehensive scheduling and tracking features necessary for users to manage their volunteering commitments effectively.
Among the volunteer discovery services I examined, none successfully combined volunteer opportunities with a community-driven approach. While these platforms typically concentrate on listing volunteer options, they often neglect the crucial aspect of creating a sense of community and belonging among their users
Only one competitor, Golden, stood out in terms of offering incentives for volunteer activity
Key findings
Defining the user experience
Crafting a detailed affinity map was crucial for distilling insights from both volunteer and volunteer management perspectives. Initially, my data collection covered both areas, contributing to a comprehensive map. As the project progressed, I focused more on the volunteer experience.
Overall, my interviews highlighted key themes of community and social responsibility in shaping the volunteer experience.
Insight generation
Key
insights
One thing that really struck me in my user interviews is that convenience and ease are key to encouraging volunteering. Many users mentioned struggles finding the right opportunities that match their interests and schedules, so there's a need for a more user-friendly, personalized experience. They also want clear info on their impact, showing they seek fulfillment and accountability in their volunteering.
These insights highlight the need for a user-centric platform that addresses these concerns and boosts volunteer engagement.
I created two user personas because individuals have diverse interests and motivations for volunteering. While debates exist about the ethics of intrinsic and extrinsic motivations, as a designer, my focus is on creating a solution that caters to both types of people.
Meet the
users
The "aha moment" crystallized when merging insights from competitive analysis and user interviews.
From this point, I knew that I had to create a user-centric, streamlined solution that would:
The map to volunteerism
Site mapping was a key part of the process because it helped me visualize the whole app, showing how the pages are organized, connected, and how users will navigate through it.
Understanding that time constraints were a primary concern among my research participants, I placed significant emphasis on calendar management within the app.
By establishing the calendar as a central feature and reference point within the app, I aimed to ensure that users could conveniently consult their schedules to make well-informed decisions about volunteer commitments based on their availability. Through the calendar, users can easily set their preferred dates and times and maintain a record of their commitments. I also provided users with indirect access points to the calendar via their profiles.
I developed three user and task flows by leveraging the sitemap I designed, and tested them to align with common tasks performed by the target user. The aim was to ensure that the user could intuitively navigate through the site.
Early design concepts
During this phase, I started to experiment with different layouts and design, keeping my sitemap and user flows in mind as a guiding tool. Careful sketching and low-fi iterations allowed my app to take shape.
Defining solutions through iterative design
Volunteer
Card
The primary goal was to provide users with essential information to quickly assess the suitability of a volunteering event.
I considered key details like the event name, date, time, and organizer as crucial information for users. However, feedback from peers highlighted the importance of proximity, prompting me to include distance details at the bottom of the card.
Based on my research, which emphasized users' strong desire for community involvement and contributing to important causes, I reconsidered their preferences. It became evident that the organizer thumbnail, which is visually prominent, wasn't as essential as other information (although this changes when considering donating money to a cause).
Users prioritized details like event popularity and capacity. As a result, I replaced the organizer thumbnail with a donut chart indicating event popularity.
The final design provides users with a quick and easy glance at the volunteer event. I’ve added event popularity and capacity via donut chart, along with other essential details, to spark their interest and encourage further exploration. The goal is to inspire users to explore event specifics in more depth, empowering them to make informed commitments.
The volunteer card and donation card have a few small differences. First, the donation card has a tag at the top labeled "Giving Opportunity." Second, while users didn't pay much attention to organizer details in the volunteer context, it mattered more when making monetary donations, so I included it in the donation card. Lastly, I switched from a donut chart to a bar chart in the donation card, which aligns with common UX design practices in this context.
Dashboard
My research findings revealed that users are motivated by making a positive impact in their communities. Keeping this insight in mind, I began thinking of ways for users to track their overall impact. I believed a dashboard would be the best way for users to monitor their hours and view trends in their volunteering activities.
Initially, I envisioned using a pie chart to quickly and effectively display the ratio of types of volunteer activities that the user partakes in. While the pie chart was a good start, it provided limited information and context that would help users quickly visualize their impact by itself.
To address this limitation, I experimented with different ways to provide users with more data and context. However, these designs felt visually overstimulating and confusing.
In response, I decided to transition to a semi-circle chart for a less clunky feel. This change allowed users to have a clear visual breakdown of their volunteer history. To provide users with additional context and motivation, I included additional cards below the chart in a horizontal carousel.
❌
✅
This final design not only offers users a better visual representation of their volunteer history but also provides valuable context and analysis to keep them engaged and motivated.
Bringing it back to the users
After establishing qualitative and quantitive success metrics and accessibility guidelines, I carried out usability testing with 5 participants between the ages of 25 and 32 over a period of 1 week. The results were organized into an affinity map to uncover key themes and patterns.
Theme 1
Getting lost
Users deviated from the expected path and got lost when critical entry points were overlooked.
Theme 2.
Distracting UI
Users were puzzled by the placeholder text in the input fields, thinking it limited their ability to input their preferred date and time.
Refining the prototype
After analyzing user feedback and usability testing results, it was time to prioritize and implement key iterations on 3 key screens for each task flow. The results aim to streamline each task flow, and give the user a more enjoyable and intuitive experience.
SIGN UP
You look new here
Users frequently attempted to use the input fields for signing in before exploring the sign-up process. I added dedicated screen for new users to redirect them back to the new user flow
CALENDAR
Declutter
In the previous design, some users found the filler text within the calendar input fields confusing when trying to adjust their availability, so I removed it. This simple change resulted in a cleaner and more user-friendly experience.
HOMEPAGE
Wayfinding
A common issue observed was a high misclick rate among users when attempting to access volunteer events. The Discover icon, nested within the bottom navigation, often went unnoticed. To address this, a secondary button labeled "Explore events" was strategically placed on the homepage beneath the recommended events section. This simple addition offers users a more intuitive pathway to discover volunteer opportunities.
Crafting a brand
I started off by creating a style tile to help guide my overall branding and messaging at every step of the design process.
Color Palette
Primary
Secondary
Logos
Icons
Check out
the prototype
The MVP
Flow 1: Sign up
Homescreen
Flow 2: Sign up for an event
Flow 3: Edit availability
Profile and Volunteer dashboard
Reflection
Main takeaways
As someone who tends to lean toward perfectionism before sharing work, I felt that I sometimes went down design rabbit-holes. However, my main a-ha moments were often when I shared my progress with my peers and my mentor. In retrospect, I could have jumpstarted the iterative process by sharing work more frequently.
Iteration is key
Throughout this project, I aimed for a harmonious design, keeping things visually cohesive. I paid special attention to interaction design, ensuring buttons and input fields felt just right. Subtle animations chimed in with user feedback, making tasks smoother. This project refined my approach, underlining how structured design systems, user-friendly interactions, and smart state management can create a smooth and approachable interface.
Design Systems
I’m interested in delving deeper into understanding user motivations related to impact tracking. Uncovering more about what truly motivates users to track their impact in volunteer activities would enable me to create more tailored and engaging features. For example, I’m intrigued by how the use of gamification can be more effectively integrated into the app to tap into users' intrinsic motivations for making a positive impact on their communities, kind of like Duolingo does. Additionally, I really would like the opportunity to build out the volunteer management side of this app. Although I embarked on this project with the intention to do so and got some really good research, it ultimately wasn’t feasible in timeline and scope. I look forward to expanding on that research and putting it to use.
What next?
Check out ANZ Billing
Check out ANZ Billing
Crafting a responsive website for a medical billing company to showcase its value proposition and deliver a smooth browsing experience.