LAHSA Redesign A redesign for the Los Angeles Homeless Services Authority website aimed at getting volunteers to sign up for the annual Greater Los Angeles Homeless Count. Timeline: 2.5 weeks. Role: Collaborated with 2 UX design students with a personal contribution to user/client research, information architecture, early ideation, and ui style guide, and mid-to-high fidelity mock ups. Deliverables: User/client interviews, user persona, sitemap, UI style guide, user flow, sketches & wireframes, high-fidelity prototype Team: Kristine Chong and Mahsa Miri |
Overview
Assignment: Redesign an experience for non-profit website.
As a team we decided we wanted to focus on one of the biggest issues facing Los Angeles currently: homelessness. As of 2019, it is estimated there is 31,516 homeless individuals living on the streets.
As a team we decided we wanted to focus on one of the biggest issues facing Los Angeles currently: homelessness. As of 2019, it is estimated there is 31,516 homeless individuals living on the streets.
Competitive Analysis
We started by gathering research on current homeless initiatives within the city.
A Bridge Home
A citywide initiative, funded by the funds from Prop HHH. The idea is to provide housing and other services at the shelter to "bridge" the homeless into more permanent housing.
A citywide initiative, funded by the funds from Prop HHH. The idea is to provide housing and other services at the shelter to "bridge" the homeless into more permanent housing.
LAHSA (Los Angeles Homeless Services Authority)
LAHSA's primary role is to coordinate the effective and efficient utilization of federal and local funding in providing services to homeless people throughout Los Angeles City and County.
LAHSA's primary role is to coordinate the effective and efficient utilization of federal and local funding in providing services to homeless people throughout Los Angeles City and County.
PATH (People Assisting The Homeless)
PATH provides the support that homeless individuals and families need in order to successfully transition from living on the street, or in shelters, to thriving in homes of their own.
PATH provides the support that homeless individuals and families need in order to successfully transition from living on the street, or in shelters, to thriving in homes of their own.
While all the initiatives we looked into did valuable and impactful work, we discovered that all of them get funding allocated from data collected from LAHSA's Greater Los Angeles Homeless Count. With that in mind, we realized how invaluable it was that volunteer and participate in the homeless count. Without it, the local homeless initiatives would not get the funding needed to make an impact in one of the largest issues affecting Los Angeles.
Observations
Some things we noticed when looking into LAHSA's website that were working and definitely was not working.
Current sites
Current LAHSA.org and TheyCountWillYou.com are two different websites, even though they are run by the same organization. Both were a heuristic nightmare.
We did audited both websites to examine the current user experience for a volunteer trying to register for the Homeless Count. We looked at content, content structure, and user flow to understand how information was organized, framed, and communicated.
We did audited both websites to examine the current user experience for a volunteer trying to register for the Homeless Count. We looked at content, content structure, and user flow to understand how information was organized, framed, and communicated.
LAHSA Homepage
They Count Will You
What We Do
Way too many links, with no info about what you are clicking into
Doesn't link to volunteer page.
Drop Down is only way to get to information about Homeless Count Volunteering.
Lots of vague imagery with lots of text.
Different branding than LAHSA. They look unrelated,
Scary looking content that doesn't encourage volunteering
Findings
LAHSA wasn't catering specifically to gaining volunteers, the GLHC (Greater Los Angeles Homeless Count) content was hidden in a dropdown to a cluttered "about" page to another website entirely. This userflow wasn't going to encourage volunteers, it would frustrate them. So we wanted to find out what other barriers may prevent people from volunteering for the GLHC.
Initial Questions
In order to get people to volunteer, needed to learn about our users' perception of volunteering. These questions helped inform the kinds of questions we could tailor when interviewing/surveying user data.
1
What motivates people to volunteer?
2
Are there barriers to volunteering such as questions and concerns that make people lose interest?
3
How do people hear about volunteer opportunities?
4
Is there a way to motivate people to volunteer?
Empathy/Research
In order to answer our questions, we surveyed 38 individuals and did user interviews.
User Interviews
We conducted interviews with 4 male individuals ages 23-41 who occasionally volunteer, but aspire to do more. The goal was to verify assumptions about the user, learn about the user's relationship to volunteering, and gage his attitude towards the homelessness issue. We also got in touch with one of the neighborhood coordinators for LAHSA. With his help we got some insight into the difficulties of gathering volunteers.
Well I mean my biggest challenge has always just... I don't ever have enough time to [volunteer].
"I would like to say that I would volunteer (for the homeless count) … I would have to get more logistics."
"It's during this time where everyone's kind of thinking of other things to do and usually people don't sign up right away."
Research Insights
A few things kept being mentioned again and again from both our interviews and surveys.
Lack of free time
Many said that lack of time was a big factor as to whether they decide to volunteer or not.
Lack of clarity of expectations
Many expressed that they wouldn't be open to volunteering until they understood what is expected of them in the role of being a volunteer.
Lack of awareness of programs
Often lack of volunteers was attributed to not having awareness of such volunteer opportunities, as well as the impact they make in certain crucial local issues.
User Persona
Once we had a better idea of the needs, wants, and goals of our user, we created a User Persona: Victor.
"I want to volunteer for something that really makes positive changes in my community, I'm just not sure how and where I should commit my time."
Victor Bénévole
36 year old / High School Teacher / Lives in Boyle Heights, Los Angeles, CA
Victor lives and works in the Boyle Heights neighborhood of Los Angeles. While walking home, Victor has a empathetic encounter with the local homeless guy on the corner, Jerry. He wishes he could do something that would have a lasting effect on Jerry and the other homeless individuals he sees in his neighborhood. Unfortunately with reports cards becoming due soon, Victor has had less time to volunteer like he used to in youth.
36 year old / High School Teacher / Lives in Boyle Heights, Los Angeles, CA
Victor lives and works in the Boyle Heights neighborhood of Los Angeles. While walking home, Victor has a empathetic encounter with the local homeless guy on the corner, Jerry. He wishes he could do something that would have a lasting effect on Jerry and the other homeless individuals he sees in his neighborhood. Unfortunately with reports cards becoming due soon, Victor has had less time to volunteer like he used to in youth.
Needs:
- Outlets for community involvement.
- Access to accurate information on social issues.
- To feel like he is making an impact. To see positive change.
Wants:
- The feeling that he is working with friends/colleagues towards a humanitarian goal.
Goals:
- Inspire more peers to be agents of change.
- Stay informed about local issues.
- Make small efforts where he can within his schedule.
- Outlets for community involvement.
- Access to accurate information on social issues.
- To feel like he is making an impact. To see positive change.
Wants:
- The feeling that he is working with friends/colleagues towards a humanitarian goal.
Goals:
- Inspire more peers to be agents of change.
- Stay informed about local issues.
- Make small efforts where he can within his schedule.
Definition
We furthered our understanding of the experience we wanted to craft for our user Victor, by defining the details.
Problem Statement
We believe that Victor, age 36 has trouble becoming aware of a high-impact volunteer opportunity that will help the homeless population and will fit with his work schedule. We believe that if LAHSA communicates the volunteer logistics and impact of volunteering for the annual homeless count, this may solve this problem by clarifying the role of a volunteer and addressing their concerns.
Ideation
With a defined hypothesis we began ideating a concept to guide how we would execute our ideas. We ideated a revised sitemap, decision diagram, and a UX scenario to flesh out our concept further.
Experience Concept
We utilized content chunking and the rule of 3's to make sections 'snackable' and "easy as 1, 2, 3."
- 1Streamlinecontent into one website (LAHSA.org)
- 2Simplifysign up process into three easy steps
- 3Clarifyrole of volunteer and address concerns upfront
Sitemap
The revised sitemap streamlined flow with less navigation items, simplified content on each page which lead to overall furthering clarity for those wishing to volunteer.
Decision Diagram
We mapped out how Victor could become aware of the Homeless Count, and how he could learn enough information about volunteering, to motivate him to sign up.
UX Scenario
We further expanded Victor's experience by establishing the scenario in the context of him and his surroundings.
1
Victor walks home from his school, passing a homeless individual.
He feels empathy for the homeless in his neighborhood and wishes he could help in some meaningful way. However, he feels overwhelmed by the homelessness crisis and is not sure what actually will help, so he moves on with his day.
2
While on Facebook, Victor sees his good friend tagged LAHSA in a post."
He trusts this friend and is interested in learning more about his shared post.
3
He clicks the tag in the post and ends up on LAHSA's Facebook page, where he finds a link to their official website.
When he sees a possible solution to his earlier concern, he feels hopeful and curious. He wonders if LAHSA helps in a meaningful way.
4
On the homepage he is informed quickly of the ease of volunteering. He clicks the feature section to learn about the homeless count.
He still has a lot of questions about the project but so far it sounds too good to be true.
5
All of his other concerns and questions about volunteering are answered and he decides to click to sign up.
He feels more confident in the process and trusts that this will be a good use of the limited time that he can allocate to volunteering.
6
He puts his phone away, turns off the light and goes to bed.
He feels better knowing he is using his limited time for a cause that has high impact in his community for an issue he cares about.
Prototype/Testing
With the task flow decided, we started creating prototype content to test on users.
Sketches
We began by fleshing out initial ideas through sketches of RWD screens of the experience of getting a volunteer to sign up for the GLHC.
Testing
We tested 3 users on our mid-fidelity prototype. We wanted to see if we had made the experience convincing enough for them to sign up to volunteer. Through the feedback we received, we refined and tested again with a hi-fidelity prototype.
Insights
A lot of the feedback suggested that through our streamline, simplify, and clarify method; helped users feel informed and comfortable enough to sign up for the GLHC.
Style Guide
In order to rebrand the look and voice of LAHSA to be more engaging and motivating, we created a style guide.
Brand Voice
We identified 5 adjectives that would give LAHSA a more approachable brand identity.
Description: Bringing the community together for a common purpose that will mutually benefit the group.
Execution: Groups of people working together in community sessions; icons that show groups of people; language to use: join, help, community, neighborhood, together, friends, family, local, home.
Execution: Groups of people working together in community sessions; icons that show groups of people; language to use: join, help, community, neighborhood, together, friends, family, local, home.
Description: Many voices in the community becoming one.
Execution: Diverse body of individuals (age, gender, race, class) working side-by-side for the same common good.
Execution: Diverse body of individuals (age, gender, race, class) working side-by-side for the same common good.
Description: The force that drives the community to engage in social change.
Execution: Action shots of people giving high fives, checking items off a list, assigning roles, volunteers readily receiving their tools and getting prepared to count.
Execution: Action shots of people giving high fives, checking items off a list, assigning roles, volunteers readily receiving their tools and getting prepared to count.
Description: Encouraging fellow community members to participate in a local humanitarian cause that also uplifts the downfallen in their community.
Execution: LAHSA giving presentations and educating community members about the count; simplifying the process in 3 steps; streamlining information about the count; close ups of caring gestures such as giving someone a blanket or a helping hand.
Execution: LAHSA giving presentations and educating community members about the count; simplifying the process in 3 steps; streamlining information about the count; close ups of caring gestures such as giving someone a blanket or a helping hand.
Description: Being the change they want to see in their community.
Execution: Wide shots of the crowds of volunteers that show up to count.
Execution: Wide shots of the crowds of volunteers that show up to count.
Logo
The original logo wasn't very legible as the strokes on the three figures made it hard to understand the image. Also the colors had accessibility issues when it came to contrast. The logo only worked with a color in the background and wouldn't work in all black and white alone. The revised logo is more simplified and can be used in full color or in white on a single color background. Also it now has a proper lock up, all of it's elements positioned in a visually understandable layout.
Original Logo
Revised Logo
Colors
To keep to our brand voice we wanted to change the colors of the original brand. The combination of Teal & Orange is complimentary...on opposites sides of the color wheel. The Orange's warmth is uplifting, it is determined to be noticed, therefore impactful. The Teal is a cool, revitalizing and rejuvenating color that also represents open communication and clarity of thought. Bring these two together to collaborate and they become a metaphor for a community.
Typography
To keep it similar to the condensed typeface that initially branded LAHSA, we choose Barlow Semi-Condensed as the primary font and Roboto for the secondary font. Barlow reads well for titles and gives us longer titles due to it being condensed. Roboto is easy to read and provides clarity for long copy.
Iconography
To continue our goals of simplicity and clarity and community; we choose simple line icons that felt engaging. We wanted to show icons of gatherings, compassion, neighborhoods, and communication. Also icons of clocks, clipboards, charts in order to convey organization.
Photography
Photography would not depict the homeless much, instead it should showcase more the involvement as a community/volunteer. Discussing homelessness is difficult and can feel exploitive. Images of the city, community and individuals were used, showing the cycle of impact one volunteer can make for their neighborhood and city. Images are overlaid with orange or teal to make an image background. Other images are to show are leaders, community, and volunteers in action.
Conclusion
We believe that through our new sign up experience for volunteers, LAHSA can benefit by increasing the concerns of volunteers and therefore raising the amount of people signing up for the Greater Los Angeles, Homeless Count.
