Revising An Existing Design for Reclaim! Mental Health
On a team, I audited non-profit Reclaim’s current website and consulted on how to implement user-friendly website layout and navigation, accessibility basics and utilize SEO.
The Problem:
Increasing access to mental healthcare for queer and trans youth lies at the heart of the client’s mission as they intend to expand their services but their website is confusing, counter-intuitive and inaccessible.
How I Solved It:
I audited their current website experience, learned how to utilize their content management system despite its limitations and along with a team, presented findings as well as accessibility and SEO basics.
My Roles on The Team:
• UX Designer
• UX Researcher
• UX Consultant
Tools:
Miro
Firespring CMS
Adobe
Methods:
• Heuristic Analysis
Deliverables:
• Heuristic Analysis/ Website Audit
• List of Accessibility Resources and Testing
1. Discover The Problem
The Project Brief
The Scoping Call
The project began as part of “Connected For Change: Tech Day”, an all day tech consultation facilitated by Hands-On-Twin Cities, a non-profit connecting other non-profits with pro-bono professional consultants for tech advice and training.
On a team of three UX designers, I met with the client non-profit Reclaim to establish a project overview and scope to discover what we could accomplish in one month of preparation and one day of live training and consultation.
We aligned our approach so we could outline the steps we needed in order to accomplish our tasks in the time allowed.
Reclaim’s primary and secondary users:
Notes from our first meeting
The Take-Away
What is the problem?
• Users have a hard time finding important things with an overwhelming amount of information on the main navigation menu.
What are the constraints?
• Reclaim team is small with limited tech knowledge and resources.
Why is this important?
• Users need simple, reliable and safe access to mental health care and resources.
What does success look like?
• Increased engagement via analytics, accessibility basics, SEO, UX basics.
2. Ideate & Prototype The Solution
Before Tech Day approached, I performed a heuristic evaluation on Reclaim’s website highlighting issues with usability as well as basic accessibility.
The heuristic evaluation I performed. View the PDF here.
Key Findings
The most problematic usability problems I found were:
Two navigation menus. One was hidden behind a hamburger menu that revealed a large menu with too much information. It was overwhelming and confusing for the viewer.
The titles for the subpages were also not descriptive enough for what content was available.
How to fix the usability problems:
Combine the two menus into one that is immediately visible.
Combine pages with similar or related information into one page.Under “Who We Are”, Staff” and “Board” could be combined into page. “Mission Statement” and “Strategic Plan Overview” could be combined. Under “What We Do”, combine “Therapy” and “One-on-One Coaching” into one page.
Rename titles of sub pages.
“What We Do” could be more descriptive like “Therapy & Resources”. “Who We Are” could be “About Reclaim”.
The most problematic accessibility problems I found were:
Difficult to read text
Low contrast text
How to fix the accessibility problems
Choose a different font, one that’s easier to read.
Choose a different color, higher contrasting colors.