Warriors First Inc. is a non-profit organization who works to help underserved military, first responders, and their families, especially in rural areas, in their times of need. The NPO team approached me to revamp their website to increase donations and improve user engagement with their core mission.
6 weeks
Website
Sole UX Designer
As the sole UX/UI designer on this project, I was responsible for:
.png)
The outdated color scheme and overall UI design failed to engage users or encourage exploration. Key elements like the “Donate” button on the landing page were poorly positioned, buried within images, making them difficult to locate and interact with, which reduced user engagement and action-taking.
The landing page offers little to no information about the organization, its mission, or how donations are used. There are no clear calls to action or incentives encouraging users to explore the website further. As a result, the page feels uninviting, lacks engagement, and fails to motivate users to stay, contributing to higher bounce rates.
.png)
.png)
The donation page presents different actions depending on the chosen payment method, such as Venmo, PayPal, and others. For Venmo, users must scan a QR code, while PayPal requires clicking a provided link. However, for other payment options, a third-party link is used, leading to inconsistency, confusion, and a lack of motivation to donate.
How might we create a more intuitive and informative landing page to ensure users can easily find the information they need and take action?
How might we create a seamless experience for donors, enabling them to complete the donation process effortlessly?
To better understand the needs, goals, and expectations for the redesign project, I conducted stakeholder interviews. However, due to time constraints and the need to deliver the design within six weeks, I opted for a user survey instead of conducting in-depth user interviews for a more comprehensive user research process.
Support the organization through donations.
Prefers a simple and intuitive donation process with the option to use their preferred payment method.
Needs clear information about the organization's mission, goals, and impact.
Seeks transparency on how charity funds are utilized, ensuring their contributions are making a tangible difference.
Looks for social proof, such as testimonials or success stories, to validate the organization's legitimacy and impact.
Lack of transparency or unclear fund utilization may deter them from donating and complicated donation process.
Explore partnership opportunities with the organization.
Multiple iterations were done to visualise the solution for the problem.
The new donation process is designed to be straightforward, with simple steps and clear instructions to guide users at every stage. This keeps users informed and ensures the process is intuitive. Multiple payment options are available, allowing users to choose their preferred method for a more convenient and seamless experience.
The previous website design used multiple fonts inconsistently. Since it was for a non-profit organization, different developers worked on the site without a clear font usage guide. To address this, I created a comprehensive design system that provides guidelines for consistent font usage across the entire website.
I developed a color system that defines the proper usage of colors for text, icons, backgrounds, and other components across the website. This ensures consistency and clarity, making it easier for developers and designers to apply the correct colors, resulting in a cohesive and user-friendly interface.
I created reusable components for text fields, buttons, card details, and country search, each with predefined states. This ensures consistent usage across the website and simplifies the design process. Developers and designers no longer need to create these component states from scratch whenever they need them, making the workflow more efficient and cohesive.
During this project, I learned that early user research can significantly reduce the time spent on design iterations. One key finding was that users prioritize the credibility of the landing page over the simplicity of the donation process.
Although time constraints limited my research to user surveys rather than comprehensive interviews, usability testing revealed a clear pattern. While users appreciated the intuitive and easy-to-use donation flow, they were hesitant to donate without being assured of the organization’s trustworthiness. This emphasized the importance of establishing credibility upfront to encourage donations.