Spring 2023

Youth Mental Health Clinic Finder

  • Vue IconVue
  • Typescript IconTypescript

tl;dr

Vancouver Coastal Health began integrating a third-party, digital intake solution for Child & Youth Mental Health (CYMHSU) clinics. Because the platform did not offer the ability to triage new patients based on location, my team was brought in to connect new patients with the new intake flow. Using the Mapbox API and Vue.js, I created an interactive triaging tool that connects patients with a mental health clinic within their respective catchment area.

Background

As a part of Vancouver Coastal Health’s Child & Youth Mental Health & Substance Use strategy, the decision was made to offer digital intake for new patients. Digital patient intake forms allow for the rapid collection and processing of medical history data. It allows the clinic to efficiently gather essential details about the patient, streamlining the intake process and improving data accuracy.

Role

I was tasked with the development and implementation of a geolocation-based triage tool that efficiently directed new patients to the appropriate clinic’s intake form. By leveraging the power of Vue.js, TypeScript, and the Mapbox API, I created an interactive solution that streamlined the triage process and improved patient access to healthcare services.

Challenges

Each was presented to us as a list of complicated rules. This list was very much designed for a human to triage patients over the phone rather than something that could be used programmatically by an algorithm. To solve this, I turned triage into three steps:

Map boundaries

I converted the catchment area rules to a set of coordinate polygons representing the boundaries of each catchment area.

Geocoding

The Mapbox Geocoding API transforms the patient’s address into map coordinates.

Point in polygon

A small library implementing a point-in-polygon algorithm determines which catchment area the address falls into.

Becoming the VCH Service Finder

The first version of the clinic finder launched in Spring 2023 as a Vue app on a standalone Craft CMS website. The catchment polygons and clinic details lived in the app’s code, so any change to a clinic or boundary needed a developer.

In 2024, I rebuilt the triage tool as a reusable Service Finder module for the Drupal-based vch.ca. Rather than hard-coding the CYMHSU clinics, I made every part of a finder configurable in Drupal, so editors can define the search areas, results, and settings themselves.

Configurable

Search areas, results, map settings, and copy all come from Drupal content types, so editors can set up a new finder without a developer.

Address autocomplete

I switched to the Google Maps Places API, so patients get address suggestions as they type. The address they pick is then geocoded into coordinates.

Filters

Editors can tag results with categories that patients filter by. The map only shows locations that match the filters.

Triage mode

For intake flows like CYMHSU’s, the finder walks patients through numbered steps. Results only appear once their location and every filter are set.

I also save filter state in the URL, so staff can share links to a finder that’s already filtered. Logged-in editors get a generator for these links.

Getting location exactly right

Matching an address to the wrong catchment area sends a patient to the wrong clinic, so most of my problem solving went into the edge cases:

  1. Overlapping areas. Some search areas are broad fallbacks, like a whole region, that sit underneath specific catchments. When an address falls in both, I let the specific catchment win, so patients see the clinic that actually serves them, while anyone outside every specific catchment still gets a result.
  2. Full addresses. A catchment boundary can run right through a city, so a city name isn’t enough to pick one clinic. Finders can now require a full property address. Surprisingly, Google’s address filter still suggests streets without a house number, so I check each suggestion, then check the chosen place for a street number or a named building, since many rural addresses don’t have a number.
  3. One location across finders. A patient’s location is remembered for a day and shared by every finder on vch.ca, so they don’t have to type it in again. A finder that requires a full address ignores a city-level location saved by another finder.

Results

Catchment-aware

New patients are matched to the clinic for their catchment area, then sent straight to its intake form.

Drupal-backed

VCH’s content team creates and updates finders in Drupal themselves.

Modular

What started as one triage tool now powers every Service Finder on vch.ca.

design + implementation 
by
in
Vancouver