KELTY MENTAL HEALTH RESOURCE CENTRE
Resource Centre Redesign
ABOUT THE PROJECT
Although the Kelty Resource Library is robust and offers strong user engagement, it poses significant challenges in navigation and access to general help and information. Its design currently caters primarily to Kelty’s Peer Support Workers—users who have a clear understanding of what they need—leaving other user groups underserved.
Kelty Mental Health is a comprehensive mental health resource centre affiliated with BC Children’s Hospital, dedicated to providing valuable information for parents and caregivers. The website aggregates a wide range of resources, both from external sources and internal databases.
MY ROLE
Lead Product Designer
TOOLS
Figma, Storybook
PROJECT LENGTH
8 months
01.
Exploration & Discovery
User Personas
At the outset of this project, we had a clear understanding of our target audience. The existing Resource Library was primarily designed with the needs of peer support workers in mind, which caused parents and caregivers to be overlooked. To address this gap, we began by creating detailed user personas for parents and caregivers, ensuring our design decisions were grounded in their specific needs from the start.
Competitive Analysis
This competitive analysis evaluates three mental health resource websites—Kids Help Phone, Anxiety Canada, and Mental Health America—in comparison to the Kelty Mental Health Resource Library. By analyzing key factors such as usability, content organization, and accessibility, this comparison highlights opportunities for Kelty to enhance its user experience, streamline access to relevant information, and implement accessibility features to better serve its audience.
1. Kids Help Phone
Kids Help Phone provides mental health resources and support for youth, offering tools for both children and caregivers. The site features a range of content, including articles, toolkits, and access to professional counselors.
Usability
STRENGTHS
The site is user-friendly, with clear, intuitive navigation. Its design prioritizes quick access to help via hotlines and live chat options.
WEAKNESSES
While the resources are easy to find, there’s an overwhelming number of links on the homepage, making the user journey feel somewhat cluttered.
Content Organization
STRENGTHS
Content is well-categorized into sections for youth, adults, and indigenous people, making it easier to find relevant information.
WEAKNESSES
The breadth of content can be overwhelming, especially for new users unfamiliar with the platform.
Accessibility
STRENGTHS
The site offers accessibility options like screen reader compatibility and language translation.
WEAKNESSES
Content could be presented with better visual hierarchy to enhance readability for users with cognitive disabilities.
2. Anxiety Canada
Anxiety Canada focuses on providing information and tools for managing anxiety across all age groups. The website offers resources for parents, youth, and educators, including articles, worksheets, and apps.
Usability
STRENGTHS
The website has a clean and minimal design, making it easy for users to focus on specific information. It provides easy-to-find resources and actionable tools like the “MindShift” app.
WEAKNESSES
While the navigation is simple, the homepage lacks prominent calls to action, potentially making it harder for users to know where to start.
Content Organization
STRENGTHS
The site uses straightforward categories, separating content by the type of user (adults, youth, professionals), which streamlines the search process.
WEAKNESSES
Some resources are buried within multiple subcategories, requiring users to dig for specific tools or guides.
Accessibility
STRENGTHS
The website includes downloadable PDFs for offline access, and tools are available in different formats (e.g., app, video, audio).
WEAKNESSES
The site lacks robust visual accessibility options, like adjustable font sizes or high-contrast modes.
3. Mental Health America
Mental Health America is a large U.S.-based platform offering a vast library of mental health resources, including screening tools, educational content, and support for various mental health conditions.
Usability
STRENGTHS
The homepage features clear navigation and immediate access to screening tools, making it easy for users to assess their mental health. The layout is simple and user-friendly, offering direct access to key resources.
WEAKNESSES
The large amount of information can be overwhelming, and some users might struggle to quickly locate region-specific resources.
Content Organization
STRENGTHS
Content is well-organized into categories like mental health conditions, screening tools, and treatment options. The website makes good use of quick links and FAQs to guide users.
WEAKNESSES
Due to the site’s sheer size, some niche content or smaller topics may get lost, making it harder to access specific resources quickly.
Accessibility
STRENGTHS
Strong accessibility features, including alt text for images, accessible PDFs, and a clean, readable design for users with disabilities.
WEAKNESSES
Some longer articles could benefit from additional headings or summaries to improve ease of reading for those with attention difficulties.
Summary & Takeaways for Kelty Mental Health Resource Library
Strengths to Leverage
TARGETED USER CATEGORIES
Like Anxiety Canada and Kids Help Phone, Kelty could consider expanding clear categorization for different user groups (e.g., parents, youth, caregivers) to help users find content faster.
SIMPLE NAVIGATION
Kelty’s clean design and simple navigation are on par with competitors like Anxiety Canada but could be improved with more prominent calls to action and easy-to-find support services.
Areas for Improvement
CLUTTTERED EXPERIENCE
Like Kids Help Phone, Kelty’s library could benefit from decluttering to reduce cognitive load for users. Focusing on key information above the fold can streamline the user journey.
CONTENT DEPTH
Expanding content types (e.g., interactive tools, videos, apps like Anxiety Canada’s MindShift) could engage a broader range of users and improve retention.
Accessibility Changes
VISUAL ACCESSIBILITY
Kelty could benefit from stronger accessibility options, such as font adjustments or high-contrast modes, which are common features among leading platforms like Mental Health America.
02.
UX Design Process
User Flow
Because we were making some architectural changes to the way users browse through the resource library, it was important to establish what that new user flow would be. We wanted to make sure there was more than one way for the user to discover and access any particular resource.
Wireframes
Now that we had established user groups and a solid user flow, we began making wireframes for the new Resource Library page as well as the new resource cards.
Resources Card Wireframes
One of our initial ideas to improve navigation was to create uniquely designed cards for each resource type. Since each resource type required specific fields and content within its teaser card, we aimed to make them visually distinct. With that in mind, I designed tailored resource cards for each type to enhance clarity and usability.
03.
Final Design
Summary
The final designs aimed to help parents and caregivers navigate the resource library more efficiently. By introducing a more structured, "on-rails" experience through a redesigned landing page, we made the resource library scalable and grouped content into categories that better reflect users’ needs. One of the key design decisions was to create unique resource cards for each resource type, which emerged as a solution during the design process when we realized that trying to fit all resources into a single card template was impractical and visually unappealing.
The updated resource library and pages now feature a cleaner, modern UI that enhances both the visual appeal and accessibility. This redesign not only improved the overall user experience but also led to tangible results—within the first two months of launch, the drop-off rate for the resource library decreased by 22%, and peer support workers reported receiving far fewer inquiries about locating specific resources. These outcomes reflect the success of the final designs in addressing both user and business needs.
