Boston Children’s Hospital is seeking a redesign of their IDHA website in order to attract internal and external investors and project collaborators.

context

The accelerator subset of Boston Children’s main website serves as an internal and external pipeline for innovations in medical technology that currently highlights a number of completed and ongoing med-tech projects.

Boston Children’s is looking to redesign the current site to give internal employees and external investors a way to easily view relevant projects and contact BCH in order to collaborate on current or future projects.

Stakeholder Requirements

Provide internal employees and external investors with a seamless way to contact BCH and collaborate with them on projects.

Clear contact option

Provide internal employees and external investors an intuitive way to find relevant information about projects of interest and BCH company sponsers.

Ease of search

High fidelity deliverables

Deliver a high fidelity prototype alongside wireframes that both adhere to BCH’s branding guidelines within a three month timeframe.

After consulting with stakeholders at Boston Children’s our team defined two personas that aligned with the goals of their IDHA.

define

discover

Existing Site Information Architecture

The existing IDHA site had a wide information arch with a number of category items that didn’t seem to align with the goals of investors and entrepreneurs coming to the site such as Telehealth.

In order to condense the existing architecture of the site and identify key areas of focus for our redesign we decided that a good next step would involve a heuristic evaluation of the site in its current state.

In order to evaluate the site in its current state, each team member conducted an individual heuristic evaluation using the Neilson Norman Group’s 10 usability heuristics.

Heuristic Evaluation

After compiling the findings of our analysis, the team decided upon 4 actionable insights that we referenced throughout our redesign of the site.

Reduce navigation items

Provide fewer, and clearer, entry points into website content

Use concise language

Reduce the amount of text heavy paragraphs and pages

Highlight relevant content

Emphasize information that is important for investors and entrepreneurs.

Remove vertical navigation

Replace lengthy secondary navigation menus with search and filter functions

Updated Information Architecture

Using our four insights, the team condensed the architecture of the site across three main navigation categories: Home, About Us, and Portfolio.

The most significant change involved condensing the Internal Innovation, Portfolio, and Digital R&D categories into a unified Portfolio section that allows users to search for and filter projects that BCH is involved with.

Using the top level findings of our heuristic evaluation our team created a series of mid fidelity wireframes for the sites landing page, about us page, partnerships page, and portfolio page.

Mid-Fidelity Wireframes

Shown below are the key changes our team made between the initial site and our mid fidelity wireframes.

deliver

Usability Testing and High Fidelity Wireframes

In order to help validate our design decisions, the team conducted 3 usability tests with stakeholders from BCH that had never used the IDHA website before.

Throughout the test users were asked to navigate through the about us page, search for a project of specific relevance, and use the partners page to partner with BCH. Below are the most prominent changes the team made post test.

High Fidelity Prototype

Problem 01

Boston Children’s wants to make their partnerships known to investors to promote social proof and secure new partnerships.

Problem 02

There is currently no way to search/filter through projects or receive high level information about projects at a glance.

Solution 02

A visual portfolio page with categorized projects that can be filtered and searched through.

Solution 03

A visual project details page that displays high level information, project partners, relevant news, and clear CTAs.

Problem 03

Investors need a way to view high level information about projects quickly to see if collaborating with Boston Children’s is in their interest.

Solution 01

A carousel partnerships page with multiple entry points that provides detailed partner information, involved case studies, and clear CTAs.

Style Guide

For phase 2 of this project the team and I would like to run an in-depth card sorting exercise with BCH staff and external users within the medical innovation space to validate the high-level project categories our team decided upon within the portfolio section of the website.

Next Steps

We would also like to conduct a usability test with our current high-fidelity prototype with the internal innovation team at BCH to determine feasibility of implementation with and to iterate further on designs, adjusting scope as needed.

Previous
Previous

Healthly UX/UI Case Study