Habitat For Humanity St. Louis Website Redesign

Matchbox Design Group
  • Score Awaiting client review
  • Date Published
  • Reading Time 4-Minute Read

Habitat St. Louis wanted to incorporate the branding of the national affiliate into a new, mobile-friendly website.

About the Project

Habitat for Humanity Saint Louis believes in a world where everyone has a decent place to live. A nonprofit organization that builds homes, communities and most of all, hope, they are dedicated to eliminating substandard housing locally by utilizing a comprehensive program in which hard-working local families invest their time into building and purchasing their own home. Learn more by reading our website redesign case study.


Habitat for Humanity St. Louis provides an opportunity for families living in a substandard rental housing to help build and then purchase a home they can afford to maintain. Having had the same website for nearly a decade, they were looking to overhaul its fractured layout, cumbersome CMS, and often confusing donation API. Habitat St. Louis reached out to us to incorporate the updated branding of the national affiliate into a new, mobile-friendly that not only reflected their mission but brought the goals of increasing donations and volunteers up to date with the rest of the non-profit world.


The national branch of Habitat for Humanity underwent a brand refresh recently, and as Habitat St. Louis is essentially a franchise of that brand, we were bound to follow the new color and typographic schemes. However, this was not a limiting factor for us at all, as it allowed us to think less about different color and type combinations, and more about the concepts the related to and worked well with the particular colors chosen from the nationally provided palette.

Pictures Tell the Story

Habitat St. Louis, just like the national organization, is a people-centric entity, and all people have stories. It was those stories that drove the image choices for this site, with each and every image being mindfully and deliberately selected to portray stories that cross all demographic and psychographic boundaries to impact us at our emotional, human core. The choice to utilize mostly lowercase headlines and subheads was a direct result of this, as the goal was to both bring attention to the headlines, yet not have them feel as if they were “yelling” at the user or overpowering the underlying message that they were meant to support.

Increasing Giving

One of the primary goals of this site was to design and implement a donation form that was a vast improvement over the old, cumbersome form and API that the previous site had been utilizing for over a decade. What most people don’t know, is that, while certain projects are heavily supported by the national organization, local Habitat branches get very little of their individual operating budget from the parent group and instead rely almost entirely on direct donations from the community.

Instead of utilizing one long form, by breaking the process up into “bite-sized” phases, we have been able to drastically increase donations over the old site, with the numbers currently still being compiled.

Sweat Equity

Contrary to the belief of large portions of the public, Habitat branches do not simply GIVE away houses. There is a lengthy application process that results in candidates that are ready, willing and able to put in not only a certain about of “sweat equity,” into their potential “new home.” It was important to Habitat St. Louis to make this point clear but also do so in a way that would make the time and effort worth it in the end for prospective applicants, but also reinforce the connection to their overall goals, as well as their approach to making those goals become a reality.