Big thanks to everyone on the GLOCAL team for making this happen and being so helpful throughout the process 🎉
01 Introduction
02 Problem
03 Solution
04 Research
05 Stakeholder Alignment
07 Crafting Design
08 Final Design
09 Metrics
10 Reflection
Uncover complexity in volunteering with 1-1 User Interviews
4 track managers, 11 volunteers, 6 tracks, 20+ hour long audio with hundreds of quotes...
I had interviewees recreate their GLOCAL journey step-by-step, if possible, sharing screens to uncover firsthand insights. This approach helped me capture user pain points in a more visual, detailed way.
GLOCAL Volunteer Management Platform
Developed a comprehensive product strategy from 0 to 1 and led the end-to-end visual and interaction design of a virtual volunteering experience.
GLOCAL is at risk of losing government funding due to a decrease in KPI.
GLOCAL is losing government funding due to lower KPIs caused by missing volunteer hours.
As a non-profit organization, volunteer hours are a key factor in determining KPIs for securing financial support from the Canadian government. However, we noticed that users face challenges that often affect their ability to track volunteer hours and manage activities effectively.
How might we design a simple volunteering process to help user focus on tasks, improve productivity and satisfaction as they work towards their goals?
A simple experience for volunteer is key.
Virtual Volunteering
Offer an online program for people from diverse backgrounds to make meaningful contributions, no matter where they are located.
Skill Development
With six specialized tracks, volunteers gain hands-on experience and receive feedback from industry professionals to enhance their skills.
Industry Engagement
Volunteers engage in meaningful civic activities and drive positive change through resources and workshops.
Understand the problems from our users
Heuristic Evaluation and Shadowing
I decided to go through the onboarding process firsthand, including booking and attending the online orientation and receiving my own GLOCAL email address afterward. Throughout the process, I encountered frustrations like unclear directions and excessive documentation.
By putting myself in the volunteer’s shoes, this experience helped me understand the context and identify potential issues. It also allowed me to prepare relevant interview questions and target key areas, ensuring valuable insights were gathered and all aspects of the user journey were thoroughly covered.
70% of interviewed volunteers shared the same frustrations about the overwhelming and unclear onboarding experience.
Just as I experienced firsthand,
Volunteer
I couldn't differentiate the one that we need to do at that exact moment. There were many things in front of us that we can go.
Going through all the different links and sheets for onboarding, it wasn't very clear.
Shaping the accurate user journey
Using affinity mapping, I categorized and highlighted user insights, organizing my observations into a user journey map. By breaking down each particular action, it became much easier to validate the process with stakeholders to pinpoint stages with the most user frustrations later on.
User Journey Phase 1
Onboarding (2/3) : Welcome Email
Onboarding
Find task
Complete the task
Productionalize & Reward
Read Glocal welcome email and follow the onboarding journey
Step One: Read NYSN Program Guide
Receive feedback from track manager
Step Five:
Join Discord channel
Step Four: Add office hours to calendar
Step Two: Complete onboarding challenge form
Step Three: Explore Glocal Warm up tasks
Take warm up tasks and submit the task submission form after completed
NYSN Program Guide
Email
(Glocal)
Sheets
Challenge
Form
Sheets
Task submission
Form
Email
(Glocal)
Google Calendar
Discord
Challenge
Warm Up Tasks
Discord
Office Hours
User Journey Phase 3
Complete tasks
No hard deadline, encourage volunteers to work at their own pace
Hold meeting with volunteers to discuss progress if needed
Go through task submission form every other day
Provide feedback and questions to volunteers within 2 days
Receive notification from the volunteer saying the task has turned in
Read the instructions that are given in the task description
Work on the task
Fill in each required section and submit task submission form
Receive feedback from track manager
Inform the track manager she completed the task through email
Work on the task
Submit task
Task Approval
Document volunteer hours
Check the hours volunteer filled in the submission form and work journal
Collect these work hours in the hours tracker for each volunteer
Sum and compile total work hours from the track each quater
Document her completed task info into volunteer work journal
Onboarding
Find task
Complete the task
Productionalize & Reward
Locate the “Hotspot” and leverage from it
During the stage of Complete Tasks, the most user frustrations were mentioned in the interviews.
As I analyzed those user actions occur in each stage, a patter of shared frustrations emerged. With that insight, I can leverage this understanding to develop a better experience.
From rough to concrete, ideas to actions
Start by jotting ideas on Post-its, organize them into object cards, sketch the flow, and finally create high-fidelity wireframes. With each design stage, my solutions became more defined and clear.
BEFORE
No centralized platform, leading to a highly manual process with a steep learning curve for volunteers.
Centralized management with separate platforms and workflows for volunteers and track managers.
AFTER
#3
Bothersome Manual Service
Track managers shared how the manual and white glove services impact efficiency, limiting the number of volunteers they can handle at once.
#1
Challenging Onboarding
Volunteers found the onboarding process too complex and overwhelming, leading to frustration before they even started their tasks.
#2
Fail to Document Hours
Volunteers said inconsistent task submission processes reduced their motivation to log hours, leading to transparency and accuracy issues.
After completing a thorough research process,
I held a research report presentation to validate our findings with stakeholders and track managers
I presented a design solution proposal to align design decisions with our stakeholders
Volunteer’s user journey
Red dash indicating this journey has significant frustrations compared to others.*
Track Manager’s user journey
Fill in each required section and submit task submission form
Check the hours volunteer filled in the submission form and work journal
Collect these work hours in the hours tracker for each volunteer
Document her completed task info into volunteer work journal
User Journey Phase 3
Complete tasks
Surprisingly, this revealed a significant reason why the KPI is being impacted:
75% of interviewed volunteers shared that they failed to document their volunteer hours.
Volunteer
Track Manager
How to count the hours? I have to go through different sheets to see how to fill in the hour.
I am manually filling in the record. Volunteers tell me how much time they have spent on this task, I add the hours for them one by one.
I do feel it's not quite worth going through all the trouble of filling out work journal.
It’s definitely a challenge. A lot of the volunteers just don't fill up a work journal even they do the work. So it's difficult for us to find out the exact hours.
“This is the most professional user research report I have ever seen!
You did a very solid interview and figure out something that I'm not aware of.”
Founder of GLOCAL:
During alignment meetings, we clarified the three main issues affecting the organization's KPIs. We then used those insights to brainstorm design opportunities for the enhanced GLOCAL experience.
Aligning on 3 focus areas
Volunteers want to avoid extra hassle and focus on more meaningful tasks from their perspective
😩
Ensure task submitting process is simple and intuitive for volunteer to complete whole journey
✅
Reduce manual process and avoid recurring task for track managers
✅
The ability to track accurate records easily and maintain transparency for all parties
✅
Difficult to obtain accurate records and leading to significant impacts on KPI
🙁
The highly manual process limits track managers' time and resources, reducing their efficiency
😓
After several rounds of design critiques from my mentor, other designers and potential users, here are some highlighted iterations:
06 IA Exploration
Setting up the structure and user flows
Listing objects like [Track Manager], [Volunteer] and [Hour] highlights what users value.
1) Clarify design context
Defining object relationships ensures consistent and logical navigation.
2) Develop consistent navigation
Defining object attributes helps create a clear, user-friendly design.
3) Structure intuitive interfaces
Due to the complicity of the this management system, I explored a variety of methods to help me achieve a reasonable information architecture.
One of the most helpful methods is the Object-Oriented method. Before adopting this method, I often felt like my wireframes came out of nowhere. This method has helped me to:
Onboarding
Find task
Work on task
Submit task
Notify submission
Task approve
Track hours
Certificate reward
According to our user research, 90% of track managers are frustrated by the highly manual process and recurring services.
Given the organization’s capacity and resource limitations, we will focus on improving the user experience in the areas that require the most manager involvement.
I also conducted a feature prioritization exercise, keeping the stakeholders' constraints in mind, with the following goals:
Prioritize essential features throughout the design process
Brainstorm the variation of solutions for each stage
Categorize them with tags to ensure each feature has a clear purpose
Additional expectations that stakeholders emphasized as priorities during the meeting:
Collect accurate hours with ease
Able to review past task records
Learn how many participants will join prior to the event
Iteration #1 - Volunteer Dashboard
❌ Initial Wireframe
✅ Final Design
1) Easily adapt to the familiar system layout while allowing room for future feature expansion
Change the top navigation to side navigation to align with common visual hierarchy.
2) Users can focus on saved tasks and avoid unnecessary searches
Reduce navigation steps by separating saved and unsaved tasks into distinct categories in the menu.
3) Better track task progress and stay informed about key metrics
Enhance the prominence of the progress bar and statistics to highlight crucial information.
Simple guided onboarding
The spotlight-style onboarding wizard guides volunteers through the new system
Task-based onboarding allow volunteers to seamlessly navigate and accomplish tasks sequentially
Minimize repetitive inquiries by integrating crucial information into the onboarding tasks
Streamlined task taking and hour logging
Centralized task management for easy submission
Automated hour logging during task submissions to enhance data accuracy
Easily track current and past record efficiently within the system for future references
All-in-one management platform
Dashboard offer track managers a comprehensive overview of performance
A notification tab consolidates all crucial messages and organization updates
The ability to review and provide comments on inquiries related to tasks all in one convenient page
Volunteer’s View
Volunteer’s View
Track Manager’s View
Understanding the context is necessary
One lesson I’ve learned is the importance of understanding the product’s role in its industry before diving into design. Since GLOCAL targets a volunteer-based audience, it’s challenging to push them or disrupt their workflow. Therefore, it’s crucial to design a solution that fits their working style and ensures a comfortable experience. As a product designer, staying curious, learning from users, and understanding the company’s operations within time constraints are key.
Designing for different perspectives
This project was challenging as I built the solution and design system from scratch for two distinct user groups: volunteers and track managers. Constantly switching perspectives to meet the different needs of each group and deciding what information was essential versus what could be left out was a real learning experience. As I designed components, I made sure they served both user types effectively while aligning with the product style and meeting stakeholders' goals. This experience taught the importance of planning ahead and setting clear guidelines to maintain design consistency and minimize trial and error.
Flexibility under constraints
Due to time and resource constraints, it’s quite normal that we can’t always conduct every single step we want with our stakeholders. I learned that by working within these constraints, we can still reach our goals, but I need to be extra prepared and provide something beyond their expectations in every discussion to create more room for compromise.
Sole Designer (Me)
Mentor: Jinjia Huang
Team
Timeline
Timeline
18 Weeks
UX/UI Designer
UX Researcher
Role
Tools
Meet our Users
Define constraints and prioritize features
User testing and rounds of iteration
I conducted usability tests to gathered their valuable feedback for further iteration. During the user testing, I asked users to:
Go through the designed user flow to complete the given prompt
Share any positive or negative thoughts about the design
Review multiple design versions to identify which one best suits their needs
Iteration #2 - Exploration of Card Design
The colored tags on the top is drawing attention away from the task title. I can only focus on the colors when I see it.
User 1
The grey tags don't pop and aren't vivid enough, making it hard to differentiate between tasks at a glance.
User 2
❌ First Version
✅ Final Version
❌ Second Version
1) Better viewing hierarchy
Put task title at the top to emphasize essential information
2) Reduced visual clutter while maintaining color variation for task categories
Lower tag saturation
3) Enhances task understanding
Replace tag “Track” with “Skillset” to indicate a more valuable information
Design System
I created a style guide from 0 to 1 to ensure a consistent and user-friendly design throughout the new system. The primary color choice was inspired by GLOCAL's existing brand colors while creating a palette that harmonized with them. I also took inspiration from leading management and online learning platforms to ensure the design was something users could easily adapt to.
All designs passed the WebAIM contrast checker to ensure usability. Tap to view each category.
12px
20px
Poppins
Typography
Aa
Regular
Aa
Medium
Aa
Semibold
Large Heading | 20px
Lorem ipsum dolor
Medium Heading | 18px
Lorem ipsum dolor
Medium Title | 14px
Lorem ipsum dolor
Regular Body | 14px
Lorem ipsum dolor
Small Body | 12px
Lorem ipsum dolor
Colors
Primary
Tag
Semantic
Greyscale
Primary Dark
#471B5E
Beginner
#F0F6CD
Notification
#FC5555
Header
#1F2329
Primary Light
#F3E9F4
Advanced
#F7DEE4
Hour
#E0ECFF
Outline
#D1D9E2
Primary
#89288D
Intermediate
#FFDCB2
Body
#5F6367
Typography & Colors
Controls & Icons
Navigation & Cards
Introduce: The GLOCAL Volunteer Management Platform
Measuring the success
Aran, the volunteer
Sarah, the track manager
He hopes to build professional skills through task-taking and collect volunteer hours for an official certificate.
She loves connecting volunteers with opportunities, ensuring their experiences are both rewarding and impactful.
Iteration #3 - Task Submission Flow (Swipe to view iteration)
50% ↓
Onboarding Time
There's no learning curve for volunteers, as they can start taking tasks immediately without browsing through various onboarding materials.
75% ↑
KPI Tracking
Hour documentation increased from 25% to nearly 100%, eliminating delays and ensuring accurate, timely volunteer KPI tracking.
60% ↑
Manager Effeciency
Reduce time spent on manual processes and repetitive services, allowing track managers to focus on more strategic activities.
I used to spend 2-3 hours just to reply to email, now I can focus on other meaningful work, like strategy and content improvement!
Track Manager
Discord update
Based on our recommendations, GLOCAL was able to start improving its volunteer user experience by making changes within its constraints and budget. For example, they separated the Discord channels for badges and announcements. Now, volunteers can easily find important announcements without being overwhelmed by the flood of achievement badges.
Volunteer
I need to scroll through all the notifications. One of the form feedbacks, I never get responses to those.
One single channel that mixes all types of messages, important announcements, or inquiries. It can easily lead to important information being overlooked and require excessive scrolling to catch up.
Before
Discord is quite confusing for me. A lot of messages are others achievement. Yeah, I don't like it.
Volunteer
Organizing announcements into separate channels based on categories makes it easier for users to find relevant information.
After
Documents are disorganized with duplicates across locations, while multiple channels are used for submissions, time tracking, and communication.
Overview
As the UX/UI designer of the team, I redefined GLOCAL’s management process by designing a scalable SaaS platform that transformed their fragmented, manual workflows into an efficient, automated system. This solution eliminated cluttered documentation, streamlined operations, and empowered teams with a seamless, data-driven approach to management.
Key Impact
75%↑ KPI tracking, securing essential funding from the Canadian government
60%↑ workflow efficiency, streamlining operations for track managers
50%↓ onboarding time, allowing volunteers to quickly familiarize themselves with the process and prevent frustrations
Logato
Designing an AI-powered social gamification mobile app that enhances piano practicing for children
Bullet Journal
Growing an online presence to 500K+ by enhancing social media engagement
© 2025 Ariel Lee. All rights reserved.
