Children's Healthcare of Atlanta (CHOA): Finding What Really Matters
What I did: C&C Analysis, User Interviews, HiFi Wireframes, Usability Tests
Project Duration: One week
Tools I used: Figma, Slack, Canva, Google Suite, my brain
The Problem
Caretakers use CHOA’s previous site to schedule visits, view resources, and check wait times for emergency centers. However, the site’s current information architecture and page layout makes this difficult to find.
Jen's new baby has a fever… what does she do?
Jen is a new parent in Atlanta and her child has a burning fever. She's anxious and want to know which UrgentCare will admit her child the fastest. She remembers that CHOA specializes in pediatric care and has over 60 centers in the city. Her friend also told her that they list wait times on their site, so she heads to choa.org to learn more. The following represents her user journey through the current Children's Healthcare of Atlanta site.
Jen represents the caregivers we interviewed at the start of this project. As they navigated CHOA's site, each of our users encountered numerous barriers with the site layout, navigation, and organization of key content. Many failed to locate the information and complete the above tasks.
I viewed these barriers as opportunities to:
-
Minimize the number of navigation elements
-
Reduce the length of pages by prioritizing essential content (UX writing)
-
Make the landing page action oriented and organized by visit type
These opportunities formed the basis of our problem statement and how might we's, which we would solve with our site redesign.
Our new design changed Jen's outcome
We tested those 3 scenarios with our redesign, measuring task completion time and evaluating usability through user feedback. This approach enabled us to assess the impact of our new design. Some impacts of our new design include:
⚡️
Users completed tasks 3x faster
🥹
Task completion rates increased by 40%
🤩
Users stated: “I was surprised it was so easy! It’s so rare in this context!”
All this was accomplished during a 5 day hackathon, where we won the “Crowd Favorite Award!” To see how we got here, let’s start from the beginning:
What do caregivers actually look for on a healthcare site?
The scenarios we created and designed for (finding wait times; info for same-day sick visits; primary vs emergency care) were based on our research. During user interviews, it's what caregivers said they look for on healthcare sites.
We also asked them to look through the existing CHOA site and found out the following:
How are other sites connecting users with resources?
If CHOA’s site is not meeting user needs, we needed to look at alternative designs. My main task during our research day was to create a competitive analysis. I looked at 8 nonprofit healthcare sites around the country, such as the Children's Hospitals of Philadelphia and Cincinnati, focusing on their main navigation, their landing page, and wait times (if present).
Hover to learn more:
100% of competitors have less than 12 navigation tabs. This showed us we could trim down the number of options.
0% of competitor sites featured media articles, news, parental resources, and educational resources on their home page like CHOA did. Therefore, we could trim down the length of key pages.
Only half of competitors included appointments, doctors, and locations on both their home page and navigation. So, we could reduce redundancy if user testing supported it.
These results led us to wonder the following:
-
Are some of these navigation items not necessary?
-
Do pages contain too much content?
-
Is the highest priority content easily accessible to users?
My Design Solution
Join me as I compare the existing and newly designed CHOA sites. I walk through our updated navigation, homepage, a few web pages, and some key results!
All of our designs were accomplished in a single week.
Too long, didn't watch; did our design changes ACHIEVE?
-
👌 Reduced Screen Length of 5 different pages between 50%-70%
-
🔖 Only feature the most pertinent info determined by UX research
-
⚡️ Consolidated 12 navigation tabs to 7 to streamline website flows and tighten IA
-
🏃 Navigation and the landing page are now action-oriented based on the most critical user flows on CHOA’s website
-
💯 Hi Fi test results showed a 100% success rate for all 3 tasks (locate wait times, determine if you can do same-day sick visits, and determining if you can bring a child to the ER for the flu)
What I learned
-
Cross-functional collaboration
-
This was my first time handing off a design to a dev team, and it was so fun!
-
Learning lesson: When the dev team used an incorrect version of the footer, designers had to take ownership and have a discussion about design annotations; we then formed agile prioritizations based on remaining time.
-
-
Pattern library + labeled interactions = efficiency & transparency
-
As the designer responsible for creating our pattern library and interactions, I was also in frequent communication with our developers through messages and comments on Figma to ensure that our ideas were being translated over correctly.
-
-
Some data points are better than none
-
We ran usability tests with two users to support our design decisions. While not statistically significant, given our constraints, were were still proud to have qualitative data to showcase how our new site improved the user experience for two parents.
-
By leaning into our research, we fended off tough questions from our panel of 4 industry experts acting as judges. Based on votes from them and the 40 hackathon participants, we earned the "Crowd Favorite Award"