Centre for advancing collaborative healthcare & education
PROJECT OVERVIEW
The Problem
The Centre for Advancing Collaborative Healthcare & Education (CACHE) is a strategic partnership between the University of Toronto and the Toronto Academic Health Sciences Network. Their mission is to promote interprofessional collaboration in healthcare.
Our team was brought in to help redesign the website’s information architecture and interface, since users have reported difficulty finding information quickly—especially when it's a time-sensitive matter.
Project Information
- Capstone Project for Master of Information Degree in UX Design, University of Toronto
- Client Team: The Centre for Advancing Collaborative Healthcare & Education (CACHE)
- Duration: January - April 2025
- Working in a four-person UX team
- Acted as the main point of contact, resolving blockers, coordinating meetings, and communicating updates
- Led content audit, user interviews, card sorting, and usability testing
- Analyzed findings and presented insights to stakeholders
- Designed and prototyped high-fidelity mock-ups; cleaned and organized Figma files for handoff and presentations
- improve the CACHE website’s structure and usability so internal staff could quickly find and share information during their day-to-day work.
- 9 high-fidelity design mock-ups aligned with the design system
- An information architecture diagram and accompanying spreadsheets outlining site page recommendations
User Research
Heuristics Evaluations and Competitive Analysis
Before diving into primary research, we wanted to better understand the existing site and clarify what questions to ask. Following our initial client meeting, we conducted heuristic evaluations of the current website and analyzed competitor sites to identify baseline issues and opportunities, such as:
Lack of clear indicators showing where users are within the site’s structure.
Cluttered pages with excessive text, images, and hyperlinks
Search functionality is limited, reducing discoverability of information
Visual and video content is less engaging compared to competitors
Snippet of Heuristics Evaluations
Example of Competitors
Primary Research to Discovery Painpoints
Knowing that Information architecture is one of the most significant issues of the website, we decided to conduct an open card sorting/interview session.
We talked to 9 users to understand what their intuition would be for grouping the pages on the website. We followed up with interview questions as well, mainly to understand what works well and what their pain points are.
Snippet of Card Sorting Sessions
Snippet of our interview note-taking template
Insights
Quantitive + Qualitative Analysis Process
We utilized Optimal Workshop, a powerful tool that supported our open card sorting process. This allowed us to collect and analyze quantitative data to inform the website's information architecture. We paid close attention to outputs like the similarity matrix and dendrograms, which revealed how users naturally grouped content.
Similarity Matrix Table
Affinity Diagram
For qualitative analysis, we synthesized themes from interview transcripts, clustering insights around topics such as navigation, content clarity, design/accessibility, and user needs. This process helped us uncover recurring pain points and suggestions.
Insights by Categories
- Hard to Access: Key content isn't immediately visible.
- Misplaced Content: Info appears in unexpected sections (e.g., reports under tools).
- Too Many Pages: Stand-alone pages with little content lead to extra clicks.
- Wordy Content: Too much text makes it hard to extract key info.
- Outdated Information: Content like podcasts isn’t current.
- Site maintenance: Hard to manage without dedicated support.
- Visually Plain: Looks professional but not engaging.
- Inconsistent Layouts: Page designs vary across the site.
- Accessibility Issues: Text-heavy images hurt readability.
Design Solutions
Solution I: Site Map
Our first proposed deliverable is a comprehensive site map, which is also accompanied by an Excel inventory that details our recommendations for the update, removal and renaming of the pages. What we did includedthe following:
1. Reassign misclassified items based on the card sorting similarity matrix
2. Condense or rename pages as needed for clarity
3. Group content and finalize the main navigation categories
4. Redesign the header and footer navigation to reflect the updated structure
Snippet of the Site Map (Click to see the full map)
Snippet of the Excel Inventory (Click here to see the file)
Solution II: Redesigned Mega Menu
As part of our information architecture improvements, we also identified the mega menu as a critical navigation component. During our discovery, we found that the original layout had significant findability and readability issues. In the updated design, the following changes are reflected:
1. Reorganize content based on the remapped IA Diagram
2. Incorporate design strategies (e.g., layers of text sizes, grouping and spacing) to increase information hierarchy and readability.
Mega Menu: Before
Mega Menu: After
Solution III: Redesigned Interfaces
Our final solution was redesigning key interfaces to improve readability and modernize the overall design. We created templates for the most important pages on the website. While each page was customized based on its content needs, we followed two core design principles throughout.
Balance, Aesthetic Appeal and Brand Alignment
The original layout was visually heavy and hard to scan. For example. on the Reseach Integration Page, the updated version features cleaner typography, streamlined sidebar navigation, and branded visuals—making the page more readable, professional, and user-friendly.
Research Page: Before
Research Page: After
Visual Hierarchy and Readability
The original Contact page was text-heavy and hard to scan. We redesigned it with clear section headings, icon-based contact cards, and staff photos. These changes improved scannability, reduced clutter, and aligned the page with the organization’s branding.
Contact Page: Before
Contact Page: After
User Testing
Tree Testings
To test the effectiveness of our site map redesign, we designed eight tree testing tasks targeting the structure where we made the most significant changes.
Despite the general success of the tasks, we found that participants performed poorly when we moved some pages to the footer or header only, with the aim of increasing direct access. To accommodate this, in the final IA design, we put those pages back into the primary navigation structure.
Snippet of the Tree Testing Interface
Snippet of the Tree Testing result/analysis
User Feedback Sessions
Snippet of the Usability Testing Session
In addition, our user feedback sessions were helpful in helping us identify some of their thoughts on our updated interface design. They offered feedback on the layout, the structure and whether information is overloaded.
For example, to address the comments about the size of the homepage, we slightly reduced the size of the hero banner and changed the image to better support visibility. For the Giving section, users indicated that it lacked visibility, prompting us to add a supporting image to help the section stand out and feel more inviting.
Before Usability Test
After Usability Test
Design Hand-off
After finalizing the design, we prepared for hand-off by creating both a written report and a comprehensive Figma deliverable. I was primarily responsible for organizing and polishing the Figma file, ensuring that the final deliverable was clean, consistent, and built using our design system.
I also documented design patterns used on each page and offered suggestions for potential workarounds in areas where the CMS might restrict certain layout or styling options. This ensures the design remains practical and adaptable during implementation.
Reflection
We designed with constraints in mind, proactively identifying areas where the CMS could restrict implementation. I included workaround suggestions and flexible layout alternatives in the hand-off to ensure that the final design would remain practical and feasible.
Through this project, I learned a lot about communicating with clients who have limited design experience. I realized the importance of avoiding jargon, using visual cues, and even sharing tutorial links when needed. These small steps made the file easier to navigate—and will help me work more effectively with future clients too.
Early on, we divided up the work before setting clear file organization standards, which led to inconsistent components and naming. I learned that aligning on structure and standards early is crucial—not just for consistency, but to make collaboration smoother and the final hand-off stronger.
