top of page

Boston Children's Hospital X Bentley HFID

Redesigning the Digital Health section of the Boston Children's Hospital site to more effectively promote digital health offerings 

TIMELINE: 9 weeks

TEAM: 3 graduate students in the Bentley HFID Master's Program; HF770: Prototyping and Interaction Design

MY ROLE: Managed the Figma prototype from start to finish, supported research and client presentation design


TOOLS: Figma, Miro

The Challenge

Boston Children's Hospital is a leading provider of pediatric healthcare services.


For this sponsored project, representatives presented our class in the Bentley MSHFID Program with the challenge of redesigning the Digital Health portion of the hospital's site.

bch-logo-452-78 (2).png
EAT Patient.jpeg

The Scope

Wording, placement, order & organization of Digital Health site content

Design of Digital Health site menu navigation, homepage, and subpages

Specification of how users would navigate to the Digital Health site from the main BCH site

Copy and word choice optimization

Integration of informative photos & visualizations 

The Solution

Our team created an updated design that showcases the hospital's offerings in a more user-friendly format. This solution incorporates changes to site information architecture, layout, and copy while maintaining brand standards. 

Screen Shot 2023-01-10 at 7.57.33 PM.png
Screen Shot 2023-01-10 at 7.54.51 PM.png

Highlighting the benefits of Boston Children's Hospital digital offerings

Making offerings easy to find and understand 

Incorporating clear & concise copy

Maintaining brand consistency & site standards


The Journey

Information Architecture Studies

Before beginning the design process, we wanted to lay down the structure for an updated site information architecture. Through tree testing and card sorting, we determined how our team would name and categorize digital health services so the user can understand and locate them more easily.

Q1: Where should the Digital Health section live on

Currently, there is no entry point to Digital Health from the Boston Children's homepage. Part of the project scope was to determine how users will get there. In our tree test, Digital Health products & offerings were most often placed under Digital Health (52 times) or under Patients & Families (38 times) in the Boston Children's Hospital main site menu.


Place Digital Health under the Patients & Families top-level section of the BCH main menu to help guide parents who are looking for offerings for “patients & families.”

Screen Shot 2023-01-17 at 1.41.17 PM.png

Consider renaming the Digital Health section to “Digital Healthcare”; “Health” is an overly broad term that is less closely related to patient care than “healthcare” is.

Screen Shot 2023-01-17 at 1.41.17 PM.png

Q2: How should digital offerings be organized and named?

On the current site, there are nine different digital health products and services. We conducted a card sorting test with 13 participants to determine how best to organize and name these services. 

MyChildrensPatient Portal

Findings: Grouped inconsistently within inpatient or at-home tools 

Recommendations: Remove as a dedicated subsection and instead add a Call-To-Action (CTA) at the top of the Digital Health homepage to help users quickly get to this tool if they miss it in the global header

Virtual Visits & Video Visits

Findings: Placed in the same groups by all participants, with top associations with virtual/remote/telehealth groupings and appointments/visits

Recommendations: Place Virtual Visits in Virtual Care (vs. In-person Care) to reflect association with virtual services, and include a reference to Video Visits under Virtual Visits as these two offerings were often associated with one another.

Online Second Opinions

Findings: Most consistently grouped as a virtual/remote/telehealth or secondarily, as digital services/tools

Recommendations: Place in Virtual Care (vs. In-Person Care) to reflect association with virtual services.

Voice Transcription

Findings: Grouped most often as general tools & services and inpatient/outpatient, but also had a large variety of other groupings

Recommendations: Assuming it’s only offered for in-person visits, place this offering in In-Person Care (vs. Virtual Care) to make this association clearer. In the offering name and description, make it clearer that it is a service (e.g., Voice Transcription Service). NOTE: Sponsor indicated in discussions that this is offered for Virtual Visits as well, so we ultimately placed it under "Related Programs and Services" in our updated IA.

Remote Patient Monitoring

Findings: Associated with a range of groupings, incl. general tools & services, inpatient/outpatient tools, and patient care. As it appeared in a wide variety of groupings, could point to confusion about the service itself.

Recommendations: Place in Virtual Care (vs. In-person Care) to reflect association with virtual (and non-inpatient) services. Also consider updating the name to be clearer it involves a physical tool (e.g., “Remote Patient Monitoring Tool”).

Voice-Powered Care Assistance

Findings: Most often appeared in general tools & services and in/out-patient, and was grouped most of the time with Remote Patient Monitoring. In the Tree Test, it was also placed incorrectly the second most often. Participant feedback pointed to potential issues with understanding the scope of the offering overall.

Recommendations: Place in In-Person Care (vs. Virtual Care) grouping to make clear it’s only available in the hospital. Also update the name to reflect terms that are more familiar to consumers (e.g., “Voice Assistant-Powered Care” may make more sense to users).

Innovation & Digital Health Accelerator

Findings: Stood out as dissimilar from all the other offerings. No participants placed it under Digital Health in the Tree Test; it was most-often placed under Researchers.

Recommendations: Keep this offering under the current “Innovation” section of the BCH site and frame it as a “related program” at the bottom of the Digital Health page, for users looking to learn more about BCH’s efforts in the digital healthcare space.

Precision Medicine Service

Findings: Groupings were unable to be standardized. It was not placed within virtual/remote/telehealth groups, and was assumed to be an in-hospital service. It was also placed incorrectly the most often in the Tree Test.

Recommendations: Remove from Digital Health section completely and consider updating the name to reference genetics to make it easier to recognize, understand, and find (e.g., “Genetics-Informed Medicine”).

Link back to Digital Health from the Precision Medicine Service overview page and add Precision Medicine Service under the Researchers > Innovation site section.

Below are the results of our studies shown in the form of IA diagrams. Due to time constraints, we focused on building out more in-depth subpages for Virtual Visits and Voice Transcription that could serve as templates for other subpages

Screen Shot 2023-01-17 at 1.28.56 PM.png

Original Information Architecture

Screen Shot 2023-01-20 at 3.09.08 PM.png

Proposed Information Architecture - V1

Initial Wireframes

We leveraged the study findings to create an initial wireframe that included the entry point to Digital Health from the Boston Children's Hospital homepage menu, a new Digital Health homepage, and a Virtual Visits subpage. 

Main Menu

Screen Shot 2023-01-19 at 5.33.05 PM.png

Place “Digital Healthcare” under “Patients & Families” based on tree test research findings; digital offerings were categorized under Digital Health (52 times) or Patients & Families (38 times) the most

Rename “Digital Health” to “Digital Healthcare” to make it a more approachable category for users

Divide offerings into “Virtual Care” and “In-person Care”, both directly accessible from the main menu, based on card sort & tree test findings

Digital Healthcare Homepage 

Screen Shot 2023-01-19 at 5.33.34 PM.png

Very brief explanation of Digital Healthcare to introduce the page along with convenient contact CTA

Menu with exposed main categories represented by (tbd) icons 

Standalone link to MyChildren's Patient Portal; it was placed in the most diverse set of groupings by study participants

All offerings are represented under menu dropdowns so users can easily navigate to the option they’re looking for

Order of services in the body of the page aligns with top menu structure to keep users oriented

Each offering is represented in an easily digestible card format with an image and concise bullet points followed by CTAs with specific action items

Categories with less information receive a different treatment with a simple icon 

Virtual Visits Subpage

Sections titled in question format to make it easier for the user to find information

they need; this was seen frequently on competitor sites

Info cards divide content into logical sections and provide details in the form of easily digestible bullet points 

Option to schedule a virtual visit directly from this page 

Tips section for patients who already have

a virtual visit scheduled 

Accordion FAQs at the bottom of the page 

Sponsor Testing Updates

After we created this initial prototype, representatives from Boston Children's Hospital visited our class. We had the opportunity to ask questions and conduct usability testing with them to refine the design.


First, there were several changes to our proposed information architecture that arose based on sponsor comments. The main updates were changing "In-Person Care" to "In-Hospital Care" and adding a "Related Programs & Services" category to host Voice Transcription and the Digital Health Accelerator. 

Screen Shot 2023-01-20 at 3.12.09 PM.png

Proposed Information Architecture - V2

We also updated our wireframes to reflect these IA changes as well as several other modifications based on sponsor feedback. 

Digital Healthcare Homepage

Screen Shot 2023-01-19 at 5.38.49 PM.png

Removed Contact Our Team button based on feedback that contact options are different per product offering 


“Contact our team” button might be difficult to implement; each product team is very separate… they would prefer that it’s not prominent.”
- Test Feedback 

Updated icons to better match new menu groupings, including additional Related Programs & Services section, and added Voice Transcription Service under this category after receiving additional information from the sponsor

Screen Shot 2023-01-19 at 5.39.20 PM.png

Virtual Visits Subpage

Added subpage menu to make contents easy to navigate and reduce scrolling.

“I didn’t see FAQ initially at the bottom…” - Test Feedback

Prominently featured the Virtual Visits tech support phone number. 

“(Technical support number) is important way to contact that team.” - Test Feedback

Screen Shot 2023-01-19 at 5.39.20 PM.png

“How Do I Schedule a Virtual Visit” section, including the option to solicit interest in cases where programs do not yet offer virtual visits. 


“Would like ways to encourage programs that discourage virtual visits to see the benefits of considering them.”
- Test Feedback

Usability Testing

We utilized the Maze platform to perform unmoderated usability testing. The test presented users with five different scenarios, each with a corresponding task that they were asked to perform using the prototype. We gathered several recommendations for prototype updates based on the results.


Many users clicked “Schedule a Virtual Visit” to learn more about Virtual Visits and Participating Programs (rather than clicking “More about Virtual Visits”). Remove this button from the Digital Healthcare Virtual Visits card to reduce choice overload and support progressive disclosure of information.

Screen Shot 2023-01-23 at 2.43.04 PM.png

Additionally, re-enforce paths to schedule a visit by using more direct language in the CTAs on the Virtual Visits page. “Schedule a Visit with MyChildren’s Patient Portal” will likely catch the eye of someone looking to schedule rather than “Login to MyChildren’s Patient Portal.”

Some users clicked menu items other than "I Have a Virtual Visit" to locate tips on how to have a successful virtual visit. Update the “I Have a Virtual Visit” menu item to “Preparing for your Virtual Visit” for clarity.

Screen Shot 2023-01-31 at 10.51.34 AM.png

Additionally, replace the “Tips for Virtual Visits” section with a button that leads to the one-pager info in web form (vs. PDF) or remove references to guides/tips, as information already on the Virtual Visits page was seen as redundant.

Initial High Fidelity Design

After this round of usability testing, we translated our designs into high fidelity utilizing Boston Children's Hospital fonts, colors, and styles. 

Screen Shot 2023-01-19 at 5.41.57 PM.png

Main Menu

Screen Shot 2023-01-19 at 5.42.11 PM.png
Screen Shot 2023-01-19 at 5.42.25 PM.png

Digital Healthcare Homepage

Screen Shot 2023-01-19 at 5.42.42 PM.png

Virtual Visits Subpage

Screen Shot 2023-01-19 at 5.43.11 PM.png

The Final Product

Screen Shot 2023-01-24 at 10.56.58 AM.png

Proposed Information Architecture - Final

The final proposed information architecture incorporates menu structures for Virtual Visits and Voice Transcription subpages that could be used as templates for additional product pages. 

The highlights of the design are described below, structured based on the high-level goals of the Boston Children's Hospital sponsor team. 

Make Offerings

Easy to Find &


Large GIF (460x858).gif

There is a user-friendly path from the main site menu to the Digital Healthcare homepage.

"Finding the information seemed very intuitive"

- Test Participant

"Just was easy to click through didn’t have to think!”

- Test Participant

Large GIF (460x858).gif

"Virtual Care", "In-Hospital Care" and "Related Programs & Services" categories are accurately represented with Boston Children’s marketing-approved icons and proposed new icons. 

Products and services are categorized in a user-friendly manner according to information architecture research findings.


Digital Products

Large GIF (460x858).gif

A straightforward card format with representative imagery, concise bullet points, and a single actionable CTA displays offerings with subpages on the homepage.

Large GIF (460x858).gif

Key features of In-Hospital Care offerings without subpages are highlighted with clear bullet points.

Large GIF (460x858).gif

On the Virtual Visits page, a subpage menu with corresponding icons helps highlight important information and make page contents easy to navigate.

More direct language is used for the scheduling CTA under "How Do I Schedule a Virtual Visit" to facilitate engagement. 

Large GIF (460x858).gif

Detailed “Tips” section is replaced with a CTA link to a dedicated page to clarify location of important information.


"I did a lot of scrolling trying to find the best related link to get me the info I was looking for."

- Test Participant

Large GIF (460x858).gif

The new Voice Transcription subpage replicates the Virtual Visits subpage pattern to effectively highlight features and explain offerings in a consistent format.

Use Clear,

Concise Copy

Descriptive copy is integrated as needed while simplifying language and reducing sentence length. The Flesch Reading Ease Score was improved across all pages (Grammarly, 2022).

The Flesch Reading Ease Score measures on a scale of 1 - 100 the readability of text (100 being most easy to read and 0 being most difficult). It is based on the average length of words and sentences (Grammarly, 2020).


Screen Shot 2023-01-27 at 10.50.12 AM.png

Follow Brand


Standard Boston Children’s styles, fonts, and colors are utilized for consistency across pages.

Screen Shot 2023-01-31 at 11.56.16 AM.png
Screen Shot 2023-01-28 at 9.50.16 AM.png
Screen Shot 2023-01-28 at 9.50.54 AM.png
Screen Shot 2023-01-28 at 9.50.37 AM.png
Screen Shot 2023-01-28 at 9.50.44 AM.png
Screen Shot 2023-01-28 at 9.50.16 AM.png

Digital Healthcare Hero photo is updated to convey more engagement between patient, parent, and provider. Also chose a brighter photo treatment to add needed contrast to the blue color scheme.

Screen Shot 2023-01-28 at 9.50.44 AM.png
Screen Shot 2023-01-28 at 9.50.54 AM.png

Subpage hero photos are updated to better represent offerings while maintaining consistent look and feel.

bottom of page