Incomplete
Homepage
The original Rogers Home homepage was missing a ton of content and had problems with both usability and readability.
Close
Close
Overview
I put an ad on Craigslist to ask if any non-profits had a web design project they would like done pro-bono as I wanted to sharpen my Webflow development skills.
Frank Moreau reached out to let me know that Rogers Home’s web presence was lacking and that they needed help if they were to fill all of the rooms at the house.
Rogers Home is a non-profit sober living facility in Pawtucket, Rhode Island. Frank told me that Rogers Home was started by Milton Rogers, a former addict, as his way of giving back to the community and the people who never gave up on him.
I agreed to help create a new website for them as well as take on the responsibility of becoming their content manager.
Role
UX / UI Designer, Webflow Developer
Teammates
Frank Moreau
Duration
Fall 2018
Deliverables
Website, On-Going Consulting
**Note
Some research content is designed for desktop viewing.
Meet Frank
This is Frank Moreau, real estate agent by day and the guy who keeps Rogers Home running at night.
Frank works tirelessly in his free time to make sure Rogers Home has money to run its program, guys to fill the house, and coordinates community outreach events. In essence Frank is the man.
Wix, Not
So Professional
Rogers Home’s old site, if you could even call it that, was a half put together Wix site without the necessary program or contact info. We decided to scrap literally everything and create something new by taking the program guide
Incomplete
Homepage
The original Rogers Home homepage was missing a ton of content and had problems with both usability and readability.
To Hamburger
or not?
While hamburger menus are necessary evils on mobile sites due to smaller screen sizes; there is no reason to have one on desktop as they lead to less click-throughs.
Contact Blackhole
While there was a contact form on the original site, no one ever used it.
Our Mission
After talking with Frank about his goals for the new website, I cam to realize that more needed to be done to help get people to learn about Rogers Home and the service that they offered.
1.) Create a new site. Using the new site we could present a way for anyone to learn more about Rogers Home and the program that they offer.
2.) Get the word out. At the time, Rogers Home had no social media presence to speak of. We decided that we would sign Rogers Home up for a Google Business account and start a plan to run a Facebook business page.
Mapping
it Out
Starting from the ground up meant looking at what info we actually needed on the site. To help with this I created a very simplified user flow to show Frank what he could expect.
The Value of
Wireframes
Next, I created mockups of a few different versions of the site using copy taken from Rogers Home program documents. Together, Frank and I paired down the options and selected a simple concept that emphasized Roger Homes brand messaging and program details.
Brand &
Visual Design
Rogers Home didn’t really have a brand, messaging, or even a logo before this project. Helping them create a simple logo and creating brand messaging was a great exercise in moving the brand forward.
Logo & Typography
Rogers Home needed a simple logo to use accross print and social media. Together frank and I created a logo to use in the short term till Rogers Home decides to take a deeper dive into branding.
The site was meant to be clear and readable so we stuck to use Gotham, a great san-serif typeface, as the main font with a few pieces of messaging switching to Merriweather for emphasis.
Final Site
The final site launched in August 2018. You can check it out here or take a look at the site below. All photos were provided by Rogers Home or taken from Unsplash.
Home
Introducing people to Rogers Home.
Program
Specifics about the program and forms to get people started.
About
Info about staff and sober facility locations.
Blog
Past client stories and current fundraising events.
Blog Post
A simple post format to make it easy to update.
Donate
Donorbox integration for donations directly from any page.
Spreading
the Word
The second goal of the project was to help Rogers Home get the word out about the website and future events. We decided to sign them up for Google Business as well as create a Facebook account that they could update as necessary.
Using Facebook allowed Rogers Home to crosspost content from their website blog. Over the past half a year the Facebook page has been steadily growing.
Google Business
Surprisingly, Rogers Home was not listed on Google as a business. Setting up an account and get the company listed resulted in the website and Facebook appearing closer to the top of search results.
Unused
Concepts
Throughout the process there were a few concepts that were discarded in favor of the final site. You can click through some of these below.
Initial Sketches
& Wireframes
Doodles during meetings and initial wireframes are a great way to keep ideas fresh and flowing. Early sketches are the most fun as you can’t really mess them up!
Project
Outcomes
A couple months after the site went up, Frank contacted me to say that the website was generating enough inquiries to fill the house. This continues to hold true and Rogers Home is even looking to open another facility late 2019.
