Haley House Mobile App
Creation of a philanthropy focused mobile app to alleviate engagement challenges and revolutionize the donation experience
Project overview
Haley House is a nonprofit organization based in Boston, MA that currently utilizes a responsive web app to connect users with their incredible mission. The platform also serves as a means to collect donations and recruit volunteers for a variety of philanthropic opportunities.
There were, however, a few pain points with the current website including sign-up forms being extremely outdated, and mobile devices having major responsiveness issues. Both of these have contributed to extremely high bounce and churn rates. The goal was to find ways to help Hailey House by simplifying the process of getting involved through a simple, intuitive native mobile app design.
Project objective
Timeline
4 day Hackathon
My role
UX Researcher
UX Designer
Collaboration
3 UX Design classmates
from General Assembly
Tools
Figma
Adobe Photoshop
The process
Discover
Define
Design
Deliver
Next steps
Secondary Research
Competitive Analysis
Comparative Analysis
Persona
Problem Statement
How Might We
User Flow
Mid-Fi Wireframes + Prototype
Design System
Hi-Fi Wireframes + Prototype
What are Haley House's goals?
This project started with a deep dive into the Haley House website to learn more about their core values, as well as the primary goals they are hoping to accomplish, and three stood out as most prominent.
Get
volunteers
Get
donations
Get users to read the
news letter+ updates
Secondary research also uncovered that Haley House’s total liabilities are over $3.1 million per year, and that donations are only meeting around half of that goal.
Given the tight deadline and the importance of financial support for survival, this sprint would focus on the donation aspect of the website
How does Haley House compete?
Competitive analysis
To better determine and understand the pain points Haley House is having with their current donation process, a competitive plus delta analysis was conducted.
This uncovered that Haley House was:
-
lacking a modern design and simple flow when making donations
-
missing most modern forms of payment
-
had a more complicated / cumbersome process
Comparative analysis
Having analyzed the process of making a donation with Haley House, it was also important to compare the number of steps required to make a donation with other industry leading platforms.
This analysis showed that:
-
The average number of steps required to complete a donation with the above comparators was 6.5
-
Haley House required 14 steps, confirming a more simple donation process was needed
With a better understanding of the areas of improvement with the current online donation experience, it was time to uncover the target audience.
Who is the target audience?
Having only four days for this sprint, information was collected on current Haley House supporters, and put together with data from current donation demographics to create a proto-persona to represent all of the users.
With a solid understanding of Melody’s likes and frustrations, the next set was defining the current problem for Melody when using the Haley House Website.
Defining the problem
Problem statement
Melody needs a more convenient and flexible way to discover philanthropic opportunities with Haley House that are compatible with her lifestyle and interests
How might we
How might we leverage technology to enable Melody to take advantage of the variety of philanthropic ventures Haley House has available?
Determining the best media
By analyzing Melody’s wants, needs, and lifestyle, as well as a variety of secondary research, it was determined that she was most likely to interact with Haley House in the following three ways:
On her way
home from work
Visiting the
Haley House Cafe
On her way
to work
The Haley House website currently has some major issues with the responsiveness of the website when using a mobile device and analytics of the current site show that over half of the visitors use mobile devices. This presents major issues for making donations and keeping people on the platform.
This gets unfortunately worse by uncovering that 70% of website visitors are also leaving after visiting a single page, most likely due to the design and layout issues as well.
Given Melody's lifestyle and pain points on the current website, the solution was a native mobile app that focuses on the three main goals of Haley House:
Making donations | Getting volunteers | Promoting the newsletter
Creating the design
In order to move into the design of the mobile app, it was important to develop a user flow that reduced the number of steps needed to make a donation, simplified the overall process, and make sure the needs and wants of Haley House were also met.
Design studio sketches
A design studio was conducted to bring the user flow to life. By taking several sketches and design ideas and combining the best features and components into a final design, moving into wireframing came much more quickly.
The design system
As the end of the four-day sprint approached, it was also important to develop a design system at the same time as the mid-fi wireframes. This would allow for a seamless transition into Hi-Fi once the Mid-Fi wireframes were completed.
The design system took inspiration from the current website while pulling in modern design elements, payment options, and navigation design that met industry standards.
As this sprint was only four days, we were unable to do complete usability testing on our design. To combat this, we focused on using as much inspiration from our competitors and comparators as possible to develop an intuitive and clean design that would feel simple and familiar.
What should happen next?
For a four-day sprint, the results were fantastic! A viable solution that solved real problems for both the business and the user, while allowing for growth and flexibility in the future. To continue pushing this project forward, there are several next steps and recommendations that should be considered.
As a next step, we would highly recommend conducting a series of contextual inquiries on the current website. This will help us gain valuable insights into how we can enhance the existing user experience through the app. Our goal is to identify the features, actions, and content that hold the most value for both the users and Haley House.
By doing so, we can strategically focus on specific goals (ie: increasing donations and volunteers, simplifying the application process for X, etc..) allowing us to streamline the app to strategically exclude any information that doesn't align with the specific desires or goals of Haley House, investors, and app users.
This will make sure that we are focused on increasing overall participation, reducing potential bounce and churn rates, and increasing our overall donations and volunteer signups per month.
Contextual inquiries
Although we were able to move all the way into a hi-fi prototype, we didn't have enough time to do any usability testing. Doing these tests would help explore the following:
-
The clarity of the overall design
-
Wording and titles of buttons/headers/text boxes
-
Test the overall flow for the donation process
Usability testing
Lastly, we would also like to test the design and clarity of the menu bar to ensure that the information architecture (and contents included within each menu button) matches what users would expect to see when they enter that page.
Doing this testing now is crucial as it allows us to finalize the design before dedicating extensive time and resources to building these pages, preventing potential back-stepping and costs later on.
Information
architecture
