CLIENT
Human Health Project
MY ROLE
UX Designer
TEAM MEMBERS
Nhung Le, Nicole Ulgado, George Halzeton
TIMELINE
September 2018 - Present
TOOLS
Sketch, Invision, and Zoom video conferencing
Summary
The vision for this redesign process is to effectively guide users through the donation process more smoothly and as efficiently as possible. The new webpage also needs to have a clear structure of the challenge sections, and explain how the users can sign up for a challenge to raise money to help the cause of Human Health Project. I focus in designing a beautiful and user friendly website to attract new users and help the organization accomplish its goals.
Features
Make one-time or monthly donations
Sign up for Human Health Project challenge with volunteering or without volunteering
Human Health Project (HHP) is a non-profit which is built upon peer-to-peer health information, education, and support. Through its programs, its objective is to empower individuals locally and globally to manage their health.
HHP was founded in 2002 by Dr. Phil Harrington who had spent three years trying to find a diagnosis which sparked the idea for HHP. Today, the organization is made up of a small core staff with 80+ volunteers, 30+ board members and advisers, spread around the world.
Official website launched in December 2018. To learn more, open the website at: https://humanhealthproject.org
After meeting with Human Health Project's CEO, Product team and Marketing team, I gathered some insights related to their current challenges, goals, and what their users were currently experiencing with the website. After a few conversations with the non-profit, I was given the task of redesigning the donation process and helping users sign up for new challenges. My approach to the task starts with the User Design Canvas.
Business
A non-profit that helps people who struggle with their health issues to share their experiences of how to overcome their medical illnesses
Users
Problems
Motives
Solutions
The goal of this design process is to structure the whole website, how pages are laid out, different levels of hierarchy within a website or application, and the organization of all the content to present clear information for the users of Human Health Project. My team worked on building out a site map for the whole website. I contributed to mapping out the different ways that users can make a donation, and how they can sign up for a challenge to raise money for the organization.
Make a one-time donation or a monthly donation
The old donate page had a lot of text, and it's really hard fot the users to undertand the main goal of what they need to do. There is no clear section for the users to make monthly donations, and one-time donation. Besides that, Human Health Project doesn't use donate by mail, eBay and Amazon Smile as a main source of receiving donations anymore.
To solve this problem, I used card-based design to organize the layout and content on the page. I also included a clear call-to-action on each card to draw the user's attention and engage them in completing the task. I also removed the section for donate by mail and other alternative ways to donate based on the lack of use.
Sign up for the challenge by Volunteering
There are some problems with the old HHP challenge by volunteering:
There is no white space in between the text, so it made the users feel confused by reading all the information.
The yellow background is inconsistent with the HHP brand, and the page doesn't have clear navigation.
To solve this problem, I use a set of questions and answers to guide the users through the process of signing up for the challenge. I add a section to introduce the users with the challenge, explain the necessary steps to become a volunteer, and how they can sign up for it. In addition, I also organize the content by adding a primary color, and an adjacent color to separate the sections, and include a clear call to action button "Sign Up".
Future Plans
Lessons Learned
Communication is key when working with a big team to establish the flow. I made an effort to keep the team up-to-date with all the changes in the design process.
I followed the color guide, typography, and design guidelines to be consistent between team members.
When choosing the photos for the non-profit, I was required to use licensed images.
Selected Works
Microsoft TeamsProduct Design, Desktop and mobile application
Human Health ProjectUX/UI Design, Branding, Web
Word of lifeUX/UI Design, Mobile App, iOS
Pacifier in the BackpackUX/UI Design, iOS
Perfect PropertiesVisual Design, Web, Mobile App, Tablet
SeedshareUX Design, iOS
© NHUNG LE 2019. All rights reserved.