Jared McCleary
Good Work Hub Onboarding Redesign
Role(s): UX Designer, UX Researcher | Duration: 2 weeks | Status: Complete
Project Overview
Good Work Hub is a startup who's primary goal is to connect small charities with grants that they qualify for. There are millions of dollars in un-awarded grants each year. Good Work Hub takes advantage of this fact in order to help fund these smaller organizations.
​
The design team was tasked with making the platform more user friendly for users who are not overly tech friendly.
Discovering the Problem
Problem Statement
Brenda needs a better way to manage her multiple tasks and responsibilities because existing tools aren’t easy to use or navigate, and picking up new technology is difficult for her
Time to Design
Now it was time for us to start designing. We centered ourselves on a general solution: How might we ease the process of learning how to use the platform?
USER FLOWS
DESIGN STUDIO
HEURISTIC EVALUATION
Heuristic Evaluation
Prototype
We created our initial prototype in high fidelity since the platform already existed. All the design team had to do was replicate the design system already being employed by GWH. This allowed us to focus on making our new additions as effective as possible. We elected to use pop-over screens, and a faded background to guide users towards the correct parts of the screen. We also made sure to give each user the opportunity to exit the walkthroughs at any point.
This is the initial onboarding screen. This will welcome users and give them the general context of the platform, as well as the option to learn more about it.
It was important for us to actually walk users through different actions on the platform. The first example of this is on the right here. We help users’ add their first event to the calendar.
The second time we walk users through an action is featured on the left here. In the image we are prompting the user to add their first volunteer, and then taking them through the whole process.
Usability Testing
Our usability testing was conducted using a third party called Maze. The testing was remote and unmoderated. We prompted users to accomplish certain tasks that you can see below:
100% of our users were able to complete the signup process without error. The majority of our users struggled to complete onboarding without less than five errors. This forced us to do a deeper dive into where things were going wrong for users. The two screens with the steepest drop off points are below.
When iterating on our design we made sure to keep these two screens in mind. The changes required were quite simple in the end. The first screen involved changing the color of text, and moving the pop-over closer to the button to highlight where we want the user to click. The second screen involved removing some of the available options to not overwhelm the user.
Version 2.0
Our second version of the prototype had a few key changes. The first series of changes were a direct result of usability testing. We addressed our problem screens and fine tuned our organization. The second series of changes were onboarding options we did not initially have time for. We gave users a way of revisiting the onboarding from their profile page, and added a few more walkthroughs to cover all of our bases. Here is a closer look at these additions:
The addition being highlighted here is the drop down profile menu. This shows a users’ onboarding progress, and gives them the option to complete it.
This is what a user would see if they enter their profile page. It shows all of the tasks that they have already completed, what tasks they have left to complete, and finally gives them a drop down menu to select any specific onboarding tasks they need a refresher in.
If you would like to walk through the full prototype to get a better feel for it, follow this link here: Figma Prototype
Next Steps
We would like to create onboarding for the hub creator side. Based on our research, we focused on the volunteer experience, as that is where most of the confusion was. However, leadership at organizations will be setting up their hubs before their teams can start working. The current setup process is straightforward and quick, but there is always room to make the experience better.
Next, onboarding for new users is great, but great onboarding should be ongoing. While the initial flow will always be viewable by Brenda in her profile, are there other ways we can reinforce knowledge of the platform? Absolutely! Implementing tooltips within each feature of Good Work Hub would allow Brenda to see some tips and tricks for accomplishing her tasks.
