The Problem

After meeting with Healing Action to see what the problem is, we found out that applicants need a more reliable, straight-forward, and condensed way to apply and receive responses for job listings so that their application process can be done seamlessly and efficiently; without being redirected to other postings and websites constantly and getting frustrated during the process.

So... how might we prioritize certain information provided by the website, to emphasize the more important information and to have the navigation be more accessible? And to draw attention to the users to apply for the positions on the website and to make the application process less confusing?

The Solution

As a non-profit organization, Healing Action wanted to create a new website for their newest program which shows job positions and volunteer opportunities for those who are passionate in Healing Action's mission. They purposely chose to have separate websites for donations, those seeking help from Healing Action and now, for Service Action Network. So, in order to improve the user flow and increase time efficiency for our users, we need to highlight and condense important information, shorten the amount of steps required to submit an application, and create an intuitive navigation system.

User Interviews

After conducting the user interviews, we collected data on the needs and pain points that the interviewees came across during their job search process. After compiling and synthesizing the data collected from these interviews into an affinity map and grouped together the notes, the team created some "I" statements and decided to focus on a few of them:

"I want a more direct way of finding this organization."‍"I want to easily navigate through a website."‍"I value the content that is provided on the site."

Key Takeaways...

In the user interviews that we conducted, we noticed a recurring issue that all of our users had... Which is that they were put into constant circles when looking for where to apply. They want a website to be more easily navigable while applying to non-profit organizations and to spend less time looking for what they need.

Affinity Map

After synthesizing the data we collected from the interviews, we put together the key points of our interviews and created an affinity map. After grouping together the notes, we were able to create a list of features that we can assume the user would want in the website and we can determine what the MVP from the "I" statements

From the affinity map we create, we were able to create 2 personas:

Hannah – A passionate youth who has a love for helping others.
Brandon – A dedicated man who loves his community and finds fulfillment in helping others.

Lo-Fi Prototype

We focused on a mobile prototype first since we wanted to create a responsive website and wanted to start in the smallest form. We wanted begin with establishing the information architecture and the layout of the web application in the first iteration.

Usability Testing

From the first iteration and onwards, we conducted user testing on several people to see how they went through the prototype. The users had to go through several tasks and through the heat maps and collected responses from the usability testing software, Maze, we changed and adapted the future iterations with the feedback we received from multiple rounds of usability tests.

Usability Test Findings

In the first round of usability testing, we had around 10 testers go through our low fidelity prototype. They were given 3 tasks to complete and these questions were consistent throughout all the usability tests that we conducted.

Imagine you are someone who is interested in working in a non-profit organization through AmeriCorp. Please show us how you apply to Americorp Public Health?
Imagine you are going through this website to find more information on a specific subject. How would you find information on the Missouri Resource Guide?
Imagine that you want to contact this organization. How you would get in touch with the Service Action Network organization?

The test results showed that users showed difficulty in finding various buttons to navigate through the mobile web-app and the heat maps showed mixed results.

65%

average success rate across all 3 tasks

25%

mis-click rate among all users for all tasks

Usability Test Findings

In the second usability test, there was more positive feedback and the users found it less confusing than the first iteration and more straightforward.

One recurring response that was received was that there was a lot of scrolling.

Usability Test Findings

For the third usability test, we bumped into some technical difficulties and the testing software did not want to cooperate. Troubleshooting was taking too long and we were on a time crunch so we decided to conduct the usability test with some participants over Zoom and manually recorded the data.
‍
After conducting usability tests we saw that:

100%

success rate across all tasks given

All Users

found it easy and straightforward to navigate through the site

Hi-Fi Design

One of the key features within our web application is a scroll to section feature from CTA buttons on the top of the page. Since Healing Action has a lot of content, we implemented this so the user can go immediately to the section they want to view.

During the usability tests, users commented on having to scroll too much, so in order to condense information even further, we included minimizable dropdowns so the user can choose what content they want to view.

Try it Out!

What's Next?

Since this is a fairly new program by Healing Action, they do not have a lot of content about this specific program available at this time so, the content we used within the web-app was information already existing on their current sites. If given more time, the team and I would have liked to work with the stakeholders on:

Creating and collecting more content from the stakeholders and implementing them into the prototype.
Conducting more usability tests with the desktop prototype.

Working with Healing Action was an amazing opportunity. After finishing this project, we will work with the stakeholders so they can make the hand off to the developers as seamless as possible and we will be available if they have any questions for us.

Reflection
As a team, we were able to organize our research findings and hone in on the MVPs of the project and decide which part we wanted to tackle and be responsible for.

As the Project Manager and Lead UI Designer of the team, I had to make sure that we were on track of the timeline that we set out for ourselves; so we did not fall behind on our work. I also had to clearly communicate the design decisions with the team and have it approved by the stakeholders to make sure everyone was on the same wavelength with the final design of the prototype.