UX Design · Nonprofit · Patient Advocacy Platform
Migraine Canada. Making a Nonprofit's Knowledge Findable.
Migraine Canada's website was information-rich but structurally invisible: critical resources like a diary tool and a knowledge library were buried in top-nav dropdowns most users never opened. I was brought in as UX Consultant to run a live, in-person design workshop with Migraine Canada leadership and their existing development partner, translating years of patient research into a navigable information architecture.
A resource-rich site nobody could navigate
Turning a scattered nonprofit resource into a guided patient journey
Migraine Canada had already done the hard part, years of accumulated clinical content, patient research, and a genuinely differentiated idea (the "Migraine Tree," a visual metaphor for organizing everything from diagnosis to treatment to lifestyle management). What they hadn't solved was how a first-time visitor, often mid-crisis or newly diagnosed, would actually find any of it.
I led a full-day, in-person workshop with Migraine Canada's President, Vice President, and their developer to pressure-test their draft wireframes against real user pathways, and to resolve open questions about IA, navigation depth, and how much explanation the Tree metaphor actually needed before users would trust it.
What I shipped
Comparative Analysis · User Flow Mapping · Live Wireframe Facilitation · Information Architecture Restructuring · Stakeholder Education · WordPress Feasibility Review
Team
Migraine Canada: President, Vice President, Developer, Social Strategy Lead, Account Director. M&H Poly Studios: UX/UI Designer (me)
Act 1: The Challenge
Identifying why a resource-rich site was failing its own visitors
Before the workshop, I audited the existing site and synthesized prior patient research the client had already gathered, including insights from Toronto SickKids' health communication guidelines Migraine Canada was using to inform their content voice.
Problem 1: No "what next" on arrival
Users landed on the homepage with a standard top navigation but no directional cue for what to do first. Everything of value lived nested inside dropdown menus.
Therefore: high-intent visitors, often people newly diagnosed or mid-episode, bounced before finding anything useful.
Problem 2: Users didn't know what they didn't know
Migraine and headache disorders are poorly understood by the general public. The site assumed a baseline of medical literacy that a lot of visitors simply didn't have, with no on-ramp for "I don't even know what to ask."
Therefore: the site was educating people who already knew what they needed, and losing everyone else.
Problem 3: Article overload, no categorization logic
The existing article/resource library had volume but no user-friendly categorization, a classic "everything is technically here, nothing is findable" failure mode.
Therefore: the Library, one of the site's most valuable assets, was effectively invisible.
What the evidence said
Independently, the client's own instincts (documented in whiteboard sketches before the workshop even started), the current-site walkthrough, and the draft wireframes they submitted all converged on the same three-pathway shape: [Migraine or Headache] → [You are not alone] → [What can I do about it]. The structure already existed in the client's thinking, it just hadn't been translated into a navigable system yet.
Act 2: The Approach
Working live, in the room, to convert instinct into structure
- Current-state teardown: walked the group through the existing site's navigation live, pointing out exactly where the nested-dropdown problem broke the experience.
- UX principles briefing: before touching wireframes, I grounded the room in the why: white space, visual hierarchy, information hierarchy, intuitive search, and grid structure, translating design terminology into decisions the non-designers in the room (a neurologist, a computer engineer) could evaluate for themselves.
- User flow mapping (Sufferer + Supporter): built two parallel flow diagrams live, mapping how a person with migraine versus a person supporting someone with migraine would move through the three pathways into the Migraine Tree knowledge library.
- Migraine Tree page critique: reviewed two layout variations for the Tree page directly against the client's submitted wireframes, flagging where "above the fold" content needed tightening.
Rather than presenting a finished IA and asking for sign-off, I ran the session as a collaborative build: reviewing the client's own draft wireframes for the landing page and the Migraine Tree page against the emerging three-pathway user journey, then live-diagramming the result on a whiteboard with the whole team contributing.
Key Insight
The single biggest unresolved tension of the day wasn't information architecture: it was trust. Partway through the session, the President pushed back on the Tree metaphor itself: "Yes, the tree is there on the page, but I still don't know what that means." The team knew the Tree deeply; a first-time visitor wouldn't. That gap, between what the team understood intuitively and what a stranger would understand cold, became the real design problem of the day.
But we're trying to bridge the gap between when someone reaches the front page. It needs to make sense for people, and it needs to be intuitive.
Design Pivots
Three decisions that reshaped the IA mid-session
Pivot 1: The Tree needed a translator page, not just a landing spot
Rather than dropping visitors straight into the Tree's roots/trunk/branches structure, I proposed a dedicated explainer step: a short "rah-rah" page with a static tree image, a plain-language walkthrough of what roots/trunk/branches represent, and a clear call to action into the library, so the metaphor was taught before it was navigated.
Pivot 2: Breadcrumbs to fight "click fear"
To stop the Tree from feeling intimidating once users were several levels deep (Tree, then Branches, then Acute Treatment, then Triptans), I recommended persistent breadcrumb navigation, reasoning that not knowing where you are, or how to get back, creates real anxiety for someone already stressed about a health condition.
Pivot 3: Cutting the Supporter flow
The session had originally mapped two parallel user journeys, one for people with migraine, one for people supporting them. By the end of the day, the team agreed the Supporter path added complexity without enough distinct value: both journeys converged on the same Tree library regardless, so the flow was simplified down to a single primary path.
Act 3: The Outcome
A validated three-way IA, ready to populate
By the end of the session, Migraine Canada had:
- A confirmed three-pathway homepage structure (Migraine or Headache / You Are Not Alone / What Can I Do About It), replacing the nested-dropdown nav
- A validated Migraine Tree information architecture (roots = diagnosis/personal makeup, trunk = basic knowledge, branches = treatments) with an agreed-upon explainer step to introduce it
- A simplified single-journey user flow (Supporter path deprecated)
- A shortlist of best-in-class reference sites (American Migraine Foundation, Cancer Care Ontario, Cystic Fibrosis Foundation, American Cancer Society) used to benchmark navigation and content-hierarchy patterns
- A feasibility read on building the redesign in WordPress using the Jevelin theme
Research and Discovery
- Competitive/best-in-class analysis across 4 patient-nonprofit sites
- Live current-state navigation audit with the client
- Synthesis of prior patient research (incl. SickKids health-literacy guidelines)
Design Artifacts
- Live-facilitated user flow diagrams (Sufferer + Supporter, later consolidated)
- Migraine Tree page layout variations (A/B)
- Annotated homepage wireframe with per-section objectives
Cross-Functional Facilitation
- Ran the session for a mixed audience of clinicians, a computer engineer, and nonprofit leadership
- Educated non-designers on core UX principles in real time to build shared decision-making language
- Reconciled a client-side design instinct (the Tree) with usability concerns raised live in the room