ST. JUDE CHILDREN'S
RESEARCH HOSPITAL
St. Jude is leading the way the world understands, treats and defeats childhood cancer and other life-threatening diseases.
Team
Chelsey Pinke
My Role
UX Researcher & Analyst
Time
Platform
Website
1 week
Responsive Website
OVERVIEW
To do a thorough analysis of the St. Jude’s website, I needed to evaluate the site on a macro and a micro level. I started by gaining a high-level understanding of the landscape by completing a competitive and comparative feature analysis.
Next, to understand the user’s first experience with the site, I used my own lack of familiarity as an advantage and started by conducting a heuristic evaluation of three primary pages.
From there, to gain a sense for how a user would move through the site with a specific cause, I came up with a scenario and determined the corresponding user and task flows. This exercise led me to the realization that the navigation of the site required some serious attention.
To the best of my ability, I created a sitemap of the current site, then tested it with three rounds of card-sorting: closed (with existing primary navigation), open (to determine new primary navigation categories), and closed again (to confirm new primary navigation categories). With the information from these three rounds of card sorting, I was able to produce a revised sitemap.
Overall, the St. Jude’s site is inviting and full of useful information. My recommendation to improve the usability of the St. Jude Children's Hospital website is to build a more intuitive information architecture, use consistent labels throughout the site (especially in the primary and secondary navigation), and standardizing page layouts.
COMPETITIVE & COMPARATIVE FEATURE ANALYSIS
As a starting point, I wanted to gain a baseline understanding of the content and layout of other children’s hospital websites. I chose three competitors and one comparator to St. Jude Children’s Hospital. The competitors I chose were other highly regarded children’s hospitals in the US. I also wanted to compare their site to a non-profit organization, a differentiating factor for St. Jude, so I chose Planned Parenthood.
Planned Parenthood
Children's Hospital of Pittsburgh
Cincinatti Children's Hospital
Boston Children's Hospital
St. Jude Children's Hospital
From there I determined 12 features to compare across all five websites. The features ranged from basic layout and design, to navigation trends, to content offerings.
-
Basic Organization Profile
-
Homepage Layout
-
Homepage Headline
-
Primary Navigation Categories
-
Quicklinks
-
Doctor Search
-
Language Options
-
Patient Stories
-
Patient "Portal"
-
Options for Giving/Volunteering
-
Patient Publication
-
Second Opinion
Insights.
Click to view the full matrix.
St. Jude has one of the nicest looking websites with a clean, friendly and trustworthy tone enhanced by a lot of high-quality photography and videos. It is also highly responsive at breakpoints.
St. Jude offers most of the basic features of the competitor’s sites, including a patient portal, numerous patient stories, additional language options, and a patient publication.
In comparison with the other sites, two features not present on the St. Jude site are a Doctor Search and an Electronic Second Opinion.
Most sites allowed the user to get direct information about volunteering or donating directly from the homepage. The St. Jude site included both options, however the secondary navigation within these areas overlaps some and is generally confusing.
HEURISTIC EVALUATION
To gain an initial understanding of the St. Jude website, I chose three primary pages, targeting three different user groups, and analyzed them using the Abby Method of heuristic evaluation. This method uses ten evaluation criteria ranging from findability to delightfulness.
Care & Treatment
PATIENTS + FAMILIES
Get Involved
VOLUNTEERS + DONORS
Patient Referrals
MEDICAL PROFESSIONALS
Insights.
The site overall has a friendly, inviting look and feel. Pages aimed at patients and medical professionals have an authoritative tone, while pages aimed at volunteers and donors are more playful.
Pages relating to donating and volunteering have a lot of overlapping and poorly organized content.
While individual pages might have good information and resources, the usability of the site as a whole is inconsistent and the navigation requires considerable attention.
Learning.
While the Abby Method of evaluation did facilitate a thorough reading of each page, in the future, I will look to other methods that are a bit more flexible. This method seems more tailored to evaluating a website in its entirety or a user flow, versus isolated pages within a website.
FLOWS
From the heuristic evaluation, it was clear that the content organization and navigation of the primary donor and volunteer pages needed work. To better understand the experience of those users, I created a user and task flow. The scenario I chose focused on a young woman wanting to register as a volunteer for the hospital. As I created the flow, I found many circuitous paths, confirming the complicated navigational structure of the site. The flow presented here is the most direct route to the form.
User Flow
Task Flow
Findings.
There are numerous places where the name of a clicked button or link does not correspond with the linked page - this is clearly illustrated in both the user and task flow and leads to a confusing user experience.
The volunteer registration form is extensive and daunting, likely discouraging potential volunteers from signing up in the first place. Incorporating basic UX best practices could significantly improve the form, which might lead to increased volunteer interest.
SITEMAP &
CARD-SORTING
At this point, it was clear that the navigation and information architecture of the site were the primary problem areas. So I created a sitemap of the existing site. I then took the research I previously collected and conducted three rounds of card-sorting to determine a more intuitive organization.
CLOSED
Existing Categories
ABOUT US
CARE +
TREATMENT
RESEARCH
TRAINING
GET
INVOLVED
WAYS TO
GIVE
The first round of card sorting was a closed session using the existing primary navigation as categories. The data confirmed that the existing categorization was confusing to users and needed to be reconsidered - especially the pages within "Get Involved" and "Ways to Give".
EDUCATION +
TRAINING
TREATMENT
PROGRAMS
DEPTS + SERVICES
PATIENT CARE
BUSINESS
ABOUT ST. JUDE
OPEN
User Categories
RESEARCH
CAREERS
+ STAFF
GIVING
The second round of card sorting was an open session, I wanted to see how users would organize the 30+ pages into their own categories. There were many similarities among the participants in this round, which was a good sign. I consolidated the participants categories into nine basic groups.
I then did a round of “card-sorting” of my own, using the categories my participants had created to determine some trends that I could use for a final round of card sorting with revised categories.
GIVING
EDUCATION
+ TRAINING
RESEARCH
DEPTS +
SERVICES
PATIENT
CARE
ABOUT
ST. JUDE
CLOSED
Revised Categories
WORKING
WITH US
The third round of card sorting was a closed session using the categories I had created based on the data from the open sort. Users in this round had no difficulty organizing the pages into the seven new categories.
By analyzing the trends in the final round of card sorting, I was able to create a revised site map using the new categories for primary navigation. This is a very high-level reorganization but has the potential to substantially improve the user experience.
SUMMARY
Within one week, I was able to attain a basic understanding of the areas of strength and areas of growth for the St. Jude Children’s Hospital website. The competitive feature analysis showed that, in comparison with other top children’s hospitals in the country, the SJCH website has a friendly, welcoming and trustworthy feeling with a wealth of high-quality information. Though there are some missing features, especially the second opinion and doctor search, on a superficial level, the SJCH site bests its competitors’ websites in multiple respects.
The heuristic evaluation brought me deeper into other areas of the SJCH website and revealed some issues with regard to labeling, information architecture, and navigation. Both the competitive analysis and the heuristic evaluation pointed to problems with the donate and volunteer sections. By creating a user flow, I was able to more directly experience the user-experience deficiencies with regard to organization, labeling and navigation. Finally, moving from a micro-lens to a macro-lens, I created my own sitemap that I tested with three rounds of card-sorting. I was then able to make some high-level adjustments to the primary navigation and general organization of pages to create a more intuitive site structure.
With more time, the next steps in this process would be:
1.) to do a deeper investigation into each of the new primary navigation categories to re-organize the pages in the most intuitive manner
and
2.) To determine the best labels for each section and page and ensure consistency throughout the site.
Finally, there are some accessibility issues on the site, especially with text over images, that should be addressed.
Thank you for reading!