Community Health Access Initiative

Improving access to inclusive and affirming health care resources for LGBTQ+ resources

Overview

I rebuilt a mobile and desktop website for the Community Health Access Initiative. The website amplifies the voices of LGBTQ+ youth to create a comprehensive health care resource navigator.

I presented my designs at the 2021 UMSI Student Exposition and won 1st place for the Diversity, Equity, and Inclusion award out of 200+ students.

Skip to Solution

Team

Christian Paneda  
UX Designer, Researcher, and Developer
Shannon Li
UX Researcher
Dan Delmonaco
UX Researcher
Gary Harper PhD, MPH
Principle Investigator
Oliver Haimson, PhD
Faculty Lead
CHAI Action Committee
Community Partner

Timeline

September 2020 -
April 2021

Skills

User research
Interaction design
Visual design
Mobile design
Web development

Tools

Figma
Webflow
HTML/CSS
JavaScript
Blush.design

Problem

Although there is vibrance in queer spaces, there is also hurt. Youth in the LGBTQ+ community has historically faced numerous mental health disparities due to stigma, lack of education, and systemic oppression.

63% of LGBTQ+ youth

in the United States have felt either sad or hopeless (CDC 2019)

48% of LGBTQ+ youth

have considered suicide (CDC 2019)

24% of LGBTQ+ youth

have misused prescription drugs (CDC 2019)

The Community Health Access Initiative (CHAI) is a coalition of community organizations, youth, and academic partners offering a free training and technical assistance program to improve the health and well-being of LGBTQ+ youth in Michigan. CHAI is focused on improving mental health and substance use outcomes among LGBTQ+ youth by increasing access to inclusive and affirming health care.

CHAI previously had a website to house tailored health care resources to help achieve their mission, but the disorganization of resources and accessibility errors (lack of color contrast, alternative text, and keyboard navigation) leaves it unusable. LGBTQ+ youth in Michigan are the primary users, and health care providers are secondary users.

CHAI Action Committee led by Elliot Popoff, MPH and Luna Hughson, MA

Question – How might we better communicate health care resources and trainings with a website by leveraging community partnerships?

Research

Because the target audience of CHAI is LGBTQ+ youth, I was in constant communication with CHAI supervisors and the action committee – a group of LGBTQ+ youth who create and curate CHAI resources and training – to receive feedback through weekly meetings and email.

Want more research? View the academic manuscript here

1 expert interview

conducted to understand what it means to be a sustainable creative small business and what experts hypothesize as to the largest competency barriers for operations and finances

9 interviews

with creative small businesses to gain a deeper empathy on what it means to be a creative small business and what are the end goals, investigate the workflow of a creative small business from conceptualizing to executing product sales

11 competitors

analyzed to identify what market gaps exist in existing tools for young people with creative small businesses

22 TikToks

observed to get a wider sample of data to further investigate our findings from a relatively small sample size of user interviews.

Research synthesis

The research highlighted the following opportunities

01
Have a centralized page to immediately give users a better understanding of CHAI

Because CHAI is a hub of many LGBTQ+ resources.

According to the competitive analysis, prominent websites aiding LGBTQ+ youth have a single landing page illustrating their mission and variety of services

When discussing the old website, individuals of the action committee in their interviews expressed that the purpose of the CHAI website is to empower the community by sharing LGBTQ+ resources with youth and providers. The website should be a hub for people to learn more about the initiative.

02
Redesign the website so that users can find resources specific to their needs faster

Because LGBTQ+ youth are browsing resources with limited time.

According to the competitive analysis, prominent websites aiding LGBTQ+ youth have multiple pathways for users to access the same information within a website

When discussing the old website, individuals of the action committee in their interviews expressed that the website should implement more elements for discoverability

Focus groups indicated that resource organization looks like lists and search functions.

03
Reorganize website information architecture to better showcase resources for a more curated experience

Because a website like CHAI has multiple audiences.

According to the competitive analysis, prominent websites aiding LGBTQ+ youth have resources can be general for all users or tailored for specific audiences (e.g. providers, youth, parents, etc.)

04
Emphasize imagery while making content accessible

Because LGBTQ+ youth prefer visual organization.

When discussing the old website, individuals of the action committee in their interviews expressed that information on the website should rely on spacing and images to convey information rather than words.

Focus groups also indicated that resource organization looks like visual categorization.

Ideation

I mapped the information architecture of the website and sketched lo-fi wireframes.

Onboarding to tailor recommendations to help users stay on track

User Testing

To make a robust website, I designed the mobile version before moving onto the desktop version to ensure responsiveness. After receiving feedback from CHAI and the research team, I created a high-fidelity prototype to test with the action committee. One key performance indicator included task completion for (1) successfully find specific health care resources and (2) find mental health provider training that is only available to providers.

Finding 01 – Redesign filter functions to be expandable to take up less space and allow users to focus on the actual list of resources provided

Finding 02 – Remove unnecessary visual embellishments, content, and provide real-life illustrations to better convey the purpose of the website's resources

During user testing, critical feedback emerged. Though it might seem purely aesthetic, it’s a safety issue:

Finding 03 – The current color scheme was too bright for some users

If I was like, in the closet, and I was trying to look up resources on CHAI, but my family was over my shoulder, this kind of like, brings a lot of attention to that. So maybe having like, an incognito mode for CHAI or like, trying to reverse the colors.” - Action Committee member

Hypothesis – visual affordances of the website should center on functionality.

Solution

Using user feedback, I moved forward with a final product with the CHAI team.

A comprehensive landing page

Quickly educate first-time users within seconds and reveal what CHAI offers

Filters and search function

LGBTQ+ youth can pinpoint resources relevant to them without wasting time looking at the ones that aren’t

Multiple pages for multiple audiences

Separate provider and youth content for a more curated experience for different audiences

Night mode

LGBTQ+ youth can safely browse the website without worrying that light emitted from a bright screen will attract attention.

This screen also displays the website's responsive. The website is designed for multiple screen sizes and devices.

Metrics

The CHAI website was deployed. Key performance indicators to track a success included:

01
Reduced time in searching for resources

to validate reduced friction within the website and the effectiveness among LGBTQ+ youth looking for healthcare resources

02
Event sign-ups through the website

to test the website's usefulness in addressing CHAI's goal of increased awareness of their resources for LGBTQ+ youth

Reflections

If I had more time, here is what I wished I could have done.

  • More usability testing – to test out my recommended quantitative metrics
  • Desirability testing – to gauge the acceptability of various visual design concepts and how they resonate with LGBTQ+ youth

Here were some final outcomes

  • 1st place out of 200+ students for the Diversity, Equity, and Inclusion award in the 2021 UMSI Student Exposition
  • The CHAI website is used as supporting material for Googled-funded research to support further work on LGBTQIA+ young people’s online information seeking.
  • My designs were used as examples to teach students in the undergraduate and graduate Interaction Design classes (a required class within the Bachelor’s and Master’s Curriculum).

1 expert interview

conducted to understand what it means to be a sustainable creative small business and what experts hypothesize as to the largest competency barriers for operations and finances

9 interviews

with creative small businesses to gain a deeper empathy on what it means to be a creative small business and what are the end goals, investigate the workflow of a creative small business from conceptualizing to executing product sales

11 competitors

analyzed to identify what market gaps exist in existing tools for young people with creative small businesses

22 TikToks

observed to get a wider sample of data to further investigate our findings from a relatively small sample size of user interviews.