The target audience for the Front Steps website seemed to change with every group we interviewed. My initial assumption was that those experiencing homelessness would be some of the main users of the site, as they may want to look up what services the organization has to offer. The original site, however, seemed to be geared towards donors, or those looking to get involved in some other way (volunteering or donating food, clothing, etc.).

‍

Interview Insights

Some key insights were that people living on the streets seemed to be well informed about the resources available to them, especially regarding food or clothing. Their main goal, obviously, was to find long term housing, but most organizations can only offer immediate assistance. We created an affinity diagram splitting up the resources that people said they already had access to, the needs or goals that aren't being accomplished, and what issues arise when working towards these goals.

‍

Affinity Diagram

‍

After this, we decided to collect some data from volunteers or donors to nonprofits. This data was ultimately of little use; although they remained a target audience of the site, the key insight was mainly to keep the information on how to get involved clear and prominent. We went back to create a user persona for someone experiencing homelessness.

‍

User Persona

‍

Stakeholder Interview

Interviewing the Director of Communications at Front Steps helped focus the target audience and organize and prioritize the information that the organization wanted to present to its clients. The director thought the current site had too much unnecessary information; they could save immense amounts of valuable time if most of their frequently asked questions were easily found on the website, without having to comb through a FAQ page.

‍

‍

For the home page, the call to action asks which demographic of the target audience is visiting: someone experiencing homelessness, their loved one, or someone at risk of becoming homeless. Below the fold, I showcased some attractive statistics to show how much of an impact the organization is already making in the community, and buttons to donate or volunteer if you wanted to contribute to that impact. The about page showcased the organization's main programs above the fold, followed by impact statistics again, success stories, and so on.

‍

‍

‍

‍

‍

‍

Because donors and volunteers were still a large part of the organizations audience, a page for those looking to contribute was essential. This 'Get Involved' page was broken down into three sections, donate, volunteer, and donor events. The page starts with a hero image and blurb about why one should support the organization. Below the hero but above the fold is a large donate button, followed by other ways to give to the organization (donating clothing, etc.). Below that is the volunteer section, with another large image and blurb, followed by a button to view all the available opportunities and a button that sends you to the general volunteer application. Finally, the events section is a carousel element featuring upcoming donor events.

‍

‍

‍

Final Prototype

Adobe XD Prototype

‍

Lessons Learned

The scope of this project ended up being very large due to the multiple target audiences the organization aims to help. Despite that, we did as best we could do unite the needs found in the interviews of those experiencing homelessness and those working to end it. With more time, I would have loved to build out the entire prototype in order to test all scenarios and audiences.

‍