UX Design
Improving Volunteer Onboarding at Code for Chicago
Project Overview
The Project
Designing a new onboarding process with Slack API to increase successful onboarding rates and lessen the burden on admins, making onboarding more accessible and efficient.
The Organization
Code for Chicago is a volunteer-driven nonprofit organization that provides technology solutions to local nonprofit organizations. The organization works with a wide range of partners to develop solutions that address specific challenges in the community.
Timeline
3 weeks.
The Problem
The onboarding process for new volunteers is long-winded - not just for volunteers, but also for admins.
The current process requires new volunteers to switch back and forth between 6 different platforms in order to complete the necessary tasks. The diagram below displays the entire process, from start to finish.
User Research
To help us understand how users navigate and what factors influence them to continue (or drop out of) the onboarding process, the research team took a deep dive into the data collected over the years.
They found that admins spent an average of 14.43 hours a month towards volunteer recruitment, totaling 158.75 hours in 2021.
Identifying Pain Points
01
Admins frequently followed up with inactive volunteers making it a time-consuming task. As a volunteer-led group, there wasn’t enough capacity to monitor volunteers and their progress to this level of detail.
02
The old process required volunteers to switch between several platforms such as Slack, Google Forms, Trello, and Miro. Only 30.5% of participants who started the onboarding process joined a project.
03
Admins and volunteers had no clear way to ask questions or communicate expectations about moving forward in the onboarding process
Design Implications
Based on the research, I concluded that the new design should…
Reduce # of hours spent monthly in volunteer management from 14 hours to 5-10 hours monthly
Improve volunteer initiative by asking more questions and communicating status
Reduce ratio of volunteer ghosting/departure from 13:59 to any ratio that is less than that🙂
Design
Iteration 1
I mocked up a single message that could be sent to volunteers once they join the Slack channel. This iteration would allow volunteers to have all the steps in one place, in the required order, with necessary links.
The Figma and Miro Slackbots should be automated to send links to relevant files once the user completes the checklist.
Feedback
Findings from user testing and feedback from my team lead included:
Make items more interactive so it feels less like a list to read
Wording is too specific and needs to be broad enough to apply to multiple projects
Automating Figma and Miro Slackbots was too advanced for our dev team
Iteration 2
In the second iteration, I introduced the checkbox block elements to create actionable items that would increase interactivity and help users keep track of their completed + outstanding tasks.
Once they finished the tasks, the user would type a response based on the prompts, triggering an automated message:
If the user were assigned to a project, they’d type “assigned” and Vomatron would send them relevant Figma/Miro boards to join.
If the user were waitlisted, they’d type “waiting” and Vomatron would tell them that whenever a spot opens up, it’s theirs.
Feedback
One of the pain points is that there are too many links leading to external platforms — try to reduce the amount of external links.
The response module puts a lot of responsibility on the user to type the exact message they need. Explore more ways to automate the process that require the user to do as little extra work as possible.
Intermission
Establishing a user flow to address different scenarios
I took a step back to understand the different scenarios that could come out of this onboarding process. By creating this user flowchart, I could see the entire process clearly.
This was immensely helpful as I moved onto the 3rd iteration.
Design
Iteration 3
I decided to explore the Slack website and dive deeper into using Slack block elements, which opened up a world of possibilities. After doing some research, I made the following changes:
I replaced message triggers with radio buttons to reduce user error/burden. I also adjusted the message to give users more agency in accepting a new project.
I replaced external links to forms with modal blocks in order to create pop-up forms that can be completed within Slack, rather than making users open an external Google form.
I created message options for additional scenarios:
if a user is waitlisted
if a user has been inactive and admins want to know if they’re still interested in volunteering
Feedback
Due to tech limitations, I should make sure that all text in the checklist was general enough to apply to any project.
Final Designs
01
Initial Onboarding Checklist
02
Project Assignment Checklist
03
Scenario: User wants another project
04
Scenario: User is no longer interested in volunteering
05
Scenario: User is put on the waitlist
06
User is inactive
Next Steps
The first release of this process is currently being built! With more time, there are a couple areas I would love to explore for future releases.
How might we prevent users from cutting corners?
In this current process, users can check off every box to move along in the process. Of course, they’ll never get a project assignment because admins will see they haven’t filled out any forms. For future iterations, I would consider exploring the following questions:
How can we add more points of validation?
Is there a way to program the Slackbot to move on to the next part of the process after the modals have been completed?
How can we further automate this process so that admins don’t have to look through each response to see if users filled out the forms?
How might we further decrease the number of external links in the checklists?
These links include links to Trello, Figma, Github, etc. While having a couple of external links might not be the worst thing, I would love to explore how we can reduce them as much as we can. Some ideas:
Explore using modals that contain text/written information that users might otherwise access on Google Slides or Trello.
Video walkthroughs to give virtual “tours” of each platform. We also currently have a couple of links to YouTube videos. I would look into using the Slack Video Block to embed these videos into the Slackbot so that users don’t have to leave the platform to watch them.
Lessons Learned
Make use of available resources
I started this process relying on my limited understanding of Slackbots, rather than looking into any available resources that Slack offered, such as block elements. The prospect of delving into the Slack API initially intimidated me, and this apprehension acted as a barrier to my exploration. However, as I progressed through the project, I took the initiative to delve into the Slack API, and I am grateful that I did. Through this experience, I recognized the importance of research and preparation before starting a project to save myself time and stress of having to start with a completely blank slate.
Teamwork makes the dream work
Even though I was initially a bit hesitant due to my limited design experience, I was pleasantly surprised by how my ideas were embraced and improved upon by team members with more expertise. Collaborating with designers, administrators, and developers gave me a well-rounded perspective on the project. Their constructive feedback not only refined my ideas but also deepened my understanding of the project's complexities. I loved having the freedom to experiment and brainstorm ideas in this collaborative environment. This experience has made me a strong advocate for teamwork and the importance of including a wide range of voices in the design process!