Los Angeles Homeless Outreach Portal
3-day hackathon site redesign
The purpose of the hackathon was to use our skills to combat homelessness in LA. We collaborated with LAHSA - Los Angeles Homeless Services Authority - to redesign their Outreach Portal to increase usage and make it more user-friendly. This portal enables users to request help for people they see on the street that look like they aren’t getting the help they need. Once the request has been made, LAHSA goes out to the spot and tries to identify the person and see if they are getting the help they need and if not, to make sure they are aware of all the resources that are available to them.
Steps we took to achieve this design.
The Problem
My team and I worked together to redesign the tool used by homeless advocates to report someone in need.
The Design Challenge
Since this project was for a government non-profit organization and this portal is part of the larger site, we thought it best to not change anything drastically in order to cut down on costs.
Our Solution
We focused on improving the site's usability to provide and easier, more efficient experience for the user. We took a mobile-first approach because when users are making the request, they are most often on their phones as it is usually right after they encounter the homeless person.
We began the process in the Discovery phase.
-
Evaluation of Current Site
-
Competitive & Comparative Analysis
-
User Surveys
-
User Interviews
Evaluation of Current Site
We chose to have a mobile focus, as users would most often be on their phones to use the service.
​
Evaluating this current site was a good starting point to help us get a feel for what needed to be done in order to provide a better user experience.
These FAQs are very lengthy & are front & center when the user opens this site. While this info is necessary, the location could change & it could be collapsible.
FAQ Page
.jpg)
This is the 1st step in making a request. Nothing has been typed yet, but it feels like the user has made a mistake. The location button is also not obvious.
Address/Location
.jpg)
Lots of text boxes might feel overwhelming to the user, possibly making them want to exit the site before they complete the form.
Descript. of Location
.jpg)
While this description is necessary for LA-HOP, it could get reworked so users understand why this info is important & why LA-HOP is asking for it.
"About You"
Competitive & Comparative Analysis
We analyzed the homeless help portals in New York City and San Francisco with the one in Los Angeles. The two main points we discovered from this was the ability to take/upload a photo - this feature could be helpful for homeless advocates trying to find the person in need, or it could be a breach in privacy and disrespectful. We also wanted to dive further and understand why it was required that the submitter of the form provide so much personal information, such as job title and phone number.
User Surveys
We surveyed an array of potential users (40 to be exact) from highly populated areas, particularly in the Los Angeles region. We learned that many people are open to helping a person in need but they were not sure if filling out the form would be beneficial or detrimental. They would also primarily use their phones to submit the form, as they would usually be outside of their home or office when encountering a person that needs help.
Mobile First
We discovered 85% of respondents would use a mobile phone to submit the form.
Online Form
90% of respondents would be willing to fill out an online form if it meant helping a person in need.
Post Request
77.5% did not know what would happen after they requested support for a person in need.
User Interviews
We spoke with 5 users who currently use the portal. From speaking with them, we learned that the flow is not currently intuitive, requests should be detailed but not so detailed that users will exit the site, and lack of closure after submitting the request often leaves people wondering what happened and if the request actually helped somebody.
Current User 1
“The current request flow is not intuitive and is difficult for people to use.”
Current User 2
"Incoming requests need to be detailed, but not so detailed that that no one wants to complete them."
Current User 3
“Lack of follow-up and closure after submitting a request leaves people distrustful of the system.”
Phase 2
Define the problem.
​After working with the research, we were able to take a step back and define the problems users face as they go along this journey. We used some key tools to help us define this.
-
User Personas
-
User Journey Map
-
Prioritize Features
User Persona
Neighborly Nancy embodies the audience that LAHSA aims to target - concerned neighbors that want to help out their community.
User Journey Map
This map identifies all of the pain points, as well as the delights, that Neighborly Nancy experiences as she goes through her journey of discovering and using the LA-HOP.
Feature Prioritization
Based on the research we gathered about users needs and pain points, we developed a list of features that should be prioritized.
Re-defining the problem statement
How might we enhance and streamline the LA-HOP form used by homeless advocates to increase participation?
Phase 3
Time to start Designing.
-
Wireframes
-
Usability Testing
-
Logo Redesign
-
High Fidelity Prototype
We conducted a design studio with the whole team.
We each sketched some ideas for the screens rapidly. We then agreed upon the elements we liked most, then drew out the updated and combined screens on the whiteboard before proceeding to our low-fi prototype.
Paper Prototype
3 users tested - Key Findings
-
Users were still unsure what kind of journey they would be putting the homeless person through - would they be getting the help they need, or getting them in trouble?
-
Description of location where homeless person was last see was unclear.
-
Users did not like having two "Submit" buttons at the end of the form - one to submit the form, the next to submit their own information if they wanted to stay informed.
Mid-Fi Prototype
3 users tested - Key Findings
-
On Step 2, the purpose of the plus symbol was not immediately understandable. To fix this issue, in the next prototype we included the words "Add another person" next to the plus symbol.
-
Also on Step 2, users repeatedly thought the form was asking for their personal contact information. This part continued to be tricky.
-
Text size was too small
Logo Redesign
The current logo of the LA-HOP felt outdated and not mobile friendly. We created a survey with 20 participants to test two new logo options against the current logo. 64% preferred this logo, stating that is easy to read, modern, and clean.
High Fidelity Prototype
For this final iteration, we went to the streets and tested with users walking by. Users had very positive feedback overall and considered the form to be fast, easy, and intuitive to use. One aspect that users really appreciated was not having so many text boxes that they have to write in - rather, there are dropdown lists and buttons users can select multiples of, and if they still don't see the option they are looking for, they can type it into the "Other" field.
.jpg)
Results & Takeaways
This hackathon project was an invaluable learning experience for me and my team. We ended up winning all the awards at the presentation, which made us super proud. LAHSA incorporated some of our designs into their update, which is incredibly awesome. Yet there is always room for learning, iteration, and improvement! If I had more time to work on this project, here are some things I would like to update.
