How might we make the Senior Friendly Hospitals (SFH) toolkit more findable and structurally leaner?
A redesigned seniorfriendlyhospitals.ca that offers a more shallow information architecture, active and current resources, and new visual branding using colours and pictograms.
A successful website redesign that delivered a visually refreshed Home and About pages, a structurally leaner SFH toolkit, and a new pictogram and colour scheme for every SFH toolkit domain.
Senior Friendly Hospitals (SFH) is an Ontario-wide strategy aimed to guide hospital-wide improvements in services for frail seniors.
It puts in place benchmarks and priorities designed to optimize care for hospitalized seniors and minimize their risk for functional decline.
The website, seniorfriendlyhospitals.ca, compiles all the resources needed to build hospitals that are conducive to specialized senior friendly care.
I was brought in to assist the Regional Geriatric Program of Toronto (RGP) in figuring out how to make seniorfriendlyhospitals.ca structurally leaner. This was my first in-house role where I functioned as a “UX Team of One” while being supervised by some of the most brilliant and compassionate minds in geriatric care in Canada.
The SFH Framework is a highly-regarded geriatric care model from the province of Ontario.
Although the strategy itself gathers much acclaim, the Regional Geriatric Program of Toronto noticed that the SFH website was becoming a navigation challenge. Resources multiplied and became buried under layers of pages with unclear labels.
As I would learn later in the project, you know that something is wrong on the website when internal employees themselves could not find what they are looking for.
The SFH “refresh”, then, was about improving the SFH website’s information architecture and giving a new visual spin on its pages through new colours and pictograms. We wanted to make the clinical resources more findable by culling outdated or dead resources, and combine small pages into bigger pages.
It was a “full-stack” project that combined UX, visual design, and content strategy into one, all geared towards helping the RGP and its network partners build hospitals committed to senior-friendly care.
The redesign went through the entire web design process: Discovery, design, development, and deployment. The RGP worked on the discovery and design phases while the developers at North Studio implemented the design plans and the QA process.
Here are the key milestones in the discovery and design processes that led to seniorfriendlyhospitals.ca‘s look today:
#1: Expert review
I began the discovery process by taking a hard look at the SFH website and how it works from an interaction perspective.
Using Dr. David Travis’ 247 Web Usability Guidelines spreadsheet, I examined whether the existing site leveraged good visual contrast, had readable fonts, had copy written for the web, prevented errors, among other UX best practices. The expert review was meant to identify the primary usability issues on the site before moving to actual usability testing.
Here’s how (then) SFH scored:
- Home Page usability
- Forms and Data Entry
- Page Layout and Visual Design
- Task Orientation
- Navigation and Information Architecture (IA)
- Writing and Content Quality
- Help, Feedback and Error Tolerance.
I focused on SFH’s IA and content quality since these are the areas that required immediate work and attention.
#2: Initial wireframes
Working through the website suggested that an interventional approach might help solve the design problem, i.e. what ‘cure’ can we do for this ‘ailment’?
Enter the “Senior Friendly Hospitals Resource Gateway”, a searchable SFH Toolkit that sorts its pages and resources by topic, type, and relevance.
“If resource-heavy [healthcare] websites such as nice.org.uk, WebMD, and the Portal of Geriatrics Online Education use advanced search techniques,” I thought, “why not consider using it it on the SFH Toolkit? That way, users can specify the topic, page, or clinical resource they need and the site gets it for them.”
So I went with that gut feel and recommended faceted search for the SFH Toolkit.
My boss and my colleagues seemed to like this idea since it “cures” the problem of hard-to-find resources by getting users to specify what resource they need at that time.
But something seemed amiss. Soon, I was back on the drawing board exploring an alternative to this design solution.
#3: Usability Tests (and revised wireframes)
Some user tests later, I realized that faceted search might not be the best approach to our design problem.
I discovered that most of our users had to rely on their professional expertise to figure out where they should go next on the website, or worse guess where the “Get Up and Go Test” might be in the Toolkit.
Our team decided that this second-guessing had to go.
A couple of brainstorms later, we came up with a new design.
The SFH Toolkit Menu now lists all the components of each SFH Domain in one page. It is the first page the user sees upon clicking the “SFH Toolkit” tab on the navigation menu.
This addresses the guessing that happened in the usability tests and lays bare what the Toolkit is all about.
We also introduced a new colour and icon scheme to the SFH Domains for a stronger brand message.
Senior Friendly Hospitals has launched and enjoys a visually refreshed Home and About pages, and a rebranded SFH Toolkit Menu that contains a unique pictogram and colour scheme for every SFH Domain.
These pictograms have been adopted for all RGP collateral – a major breakthrough in the company’s visual brand.
The SFH Toolkit’s pages have been reorganized to reflect a more hierarchical, manual-like structure. This afforded familiar navigation techniques such as previous/next navigation and sidebar menus per toolkit entry.
Finally, I helped create a founding message architecture that captures the RGP’s brand values and voice guidelines for future copy.
I’m grateful for my time at the RGP and look forward to their continued success. I should be there for only 3 months. But 3 turned to 6; and at my 9th, we finally – and triumphantly – wrapped it up. I’m very proud of this three-peat contract extension and will also remember this company with fondness and gratitude.
Role: Information Architect
Company: The Regional Geriatric Program of Toronto