OVERVIEW
Fourth and Hope is a non-profit organization based in Woodland, California. For over 40 years, Fourth and Hope has provided services to the most vulnerable populations of Yolo County. They provide housing, meals, emergency shelter, and addiction recovery for those in need. Fourth and Hope is looking to give their website a refresh, with the aim of driving donations and increasing functionality.
OUR CHALLENGE
OUR APPROACH
In working with the client, we established critical needs and pain points. After an initial meeting with Fourth and Hope, we determined that our main goals were to:
UNDERSTANDING THE PROBLEM
WORKING TOWARDS A SOLUTION
In my sketches, I paid special attention to organization and call-to-actions. I wanted to make it very clear where users were supposed to look by limiting conflict through clear visual hierarchy. I used compartments to separate important sections, ensuring that information was well placed by drawing attention with shape.
After getting feedback on my initial designs, I moved to creating low and mid-fidelity mockups. I kept my general organization the same but added in more space for copy and images. I additionally payed more attention to the flow (top to bottom) of information and ensured it occurred in a logical order.
Between my first and second iteration of the home page design, I worked to improve the navigation of the quick access bar by changing the buttons to have better contrast and balance. Our group added a slideshow showcasing stories at the bottom of the page as well as several quick link sections so that site visitors could easily access any programs or resources they may need.
A LOOK AT THE DONATE PAGE
For all of the pages, we used responsive design to ensure pages would remain viewable on mobile devices.
Our final designs took after the branding established by the client and our team. We chose a sans-serif font for its clarity and maintained the same basic color palette Fourth and Hope used. We created a design system consisting of font styles and components to be used consistently across pages.
Our final designs were presented to the clients and to our developer team, who brought our work to life!
FINAL HOME PAGE DESIGN
FINAL DONATE PAGE DESIGN
FINAL DESIGNS
