IHME DISEASE PROFILES TOOL
• ME + 3 DESIGNERS
• 3 MONTHS
Perhaps more than anything else, the COVID-19 pandemic demonstrated the importance of accessible and reliable public health data. The Institute for Health Metrics and Evaluation (IHME) is an independent research centre at the University of Washington that publishes statistics and reports in the area of global public health. Led by IHME and with close coordination from WHO, the Global Burden of Disease Study 2019 (GBD 2019) is regarded as the “most comprehensive” global health study to date by The Lancet. However, this vast treasure trove of open access data suffered from poor webpage layout and navigability on the IHME website. Design for the current disease profiles was especially outdated, and IHME was eager for an overhaul to improve the user experience of IHME’s extensive database, thereby making public health data more accessible.
This project was done with a team of 4 UX designers and 1 IHME representative over the course of 3 months. Specifically, I was responsible for managing the protoyping phase of the project and in charge of organizing the final deliverables.
RESEARCH
Web Analytics & Competitive Analysis
As with any web design project, I started by conducting thorough secondary research of the IHME website itself and a range of competitive sites. After carefully reviewing the Google Analytics of IHME’s current database and similar webpages from the CDC, WHO and ECDC websites, I could gain an understanding of IHME’s users and opportunities for redesign. These analyses culminated in seven recommendations that would guide design decisions moving forward.
Interview
The above findings were then used to refine our research questions for the primary research phase. After identifying medical professionals and public health researchers as the webpages’ primary user groups. My team set out to conduct 8 semi-structured interviews (I participated in 6 as either interviewer or note-taker) in order to gain further insight into user needs. For the interview, a comprehensive study plan was developed, standardizing study goals and research questions, email templates for invitation and reminder, and a set of flexible interview protocols. Automated recruitment was set up through Calendly, Google Forms, and Zoom.
​
We also carried out qualitative analysis through affinity diagramming concurrently with the interviews. All interview sessions were recorded and transcribed; this, in combination with notes taken during the session, were then used to produce a topline report of our primary research findings.
User Profiles & Journey Maps
Based on interview insights, I then outlined a pair of user profiles for the two main user groups. These profiles combined with qualitative findings and recommendations from the interviews would inform the user journey maps, helping us and IHME stakeholders to better visualize the current user experience.
IDEATION
Design Requirements
Based on design recommendations gathered from our previous research, we outlined a clear list of design requirements to guide the ideation process. The requirements were divided into a group of five “must-have” features and a group of four “better-have” features. The “must-haves” directly concerned the UI design of the disease profiles webpages, while the “better-haves” dealt with the integration of the new disease profiles within the overall website (i.e., site navigation and visual identity).
Paper Sketches
Following this set of requirements, each team member produced a series of sketches for the ideal disease profiles webpages. After two rounds of design critique, we quickly solidified the page layout and moved on to create low-fidelity wireframes on Figma.
PROTOTYPE
Low-fidelity Prototype
Thanks to Figma it was very easy to transform the wireframe into a lo/mid-fi mockup. I built limited interactions into it so the team can use this as a crude prototype for usability testing. 7 key tasks were outlined which the user should be able to complete with our new disease profiles. We produced a lo-fi interactive prototype based on these tasks with limited functionality and interaction which was then used for usability testing.
Click to see the full prototype on Figma:
Usability Test
Each team member independently recruited and interviewed a participant from the two user groups for usability testing. We proceeded to analyze data from the testing using affinity diagramming and compiled a list of 9 usability findings— 2 “what’s working” features that were already effective and 7 “areas of improvement” that could be changed. The team then used this feedback to further refine our design before moving on to higher fidelity deliverables.
High-fidelity Prototype
Using the recommendations from usability testing, we could finally create a high-fidelity prototype of our redesign in Figma. The search page and the disease profile page, now with extensive interactivity, is demonstrated in the presentation video.
Click to see the full prototype on Figma:
Design System
As IHME lacked a proper design system for their website, we decided to compile a small one to accompany our prototype. I came up with the idea of using clean, shaded, geometric shapes as a brand identity (as seen with the maps), as this fits the themes of simplicity and consistency with public health data.
REFLECTION
In the end I put the prototype, a full PRD, the journey maps and accompanying research finding reports, a presentation poster, and a promotional video (which I made in Premiere), all into a delivery package and successfully handed off to the IHME Digital Experience team, who were very impressed by our work and will incorporate this redesign into their 2022 roadmap. I was in charge of this final stage, managing the four-person team, wrapping up all of this within one week. I made sure that not only did the IHME stakeholders understand the identified customer needs, but also had all the resources after our handover to continue actual development.
Throughout the entire design process, the team worked collaboratively using a range of web-based tools such as Zoom, Slack, Figma, Miro, Rotato, and Loom. When conducting multiple interviews and usability tests, each team member would take turns facilitating and notetaking; the qualitative data would then be analyzed by all members together in affinity diagramming sessions. When prototyping, each member would take up responsibility for specific sections or features in the one-hour daily design sessions, and then make sure their tasks are completed before the next day’s session.
Overall I had an amazing time collaborating with my fellow UX designers. Though we lacked a PM, we were able to self-coordinate the entire project through effective communication and our shared understanding of the full product design cycle, with clear timelines and responsibilities. Thanks to our efforts early on to set up a proper Agile environment with clearly defined sprints and Gantt charts, we were able to accomplish almost all of our initial goals with just-in-time delivery. Effective coordination with our IHME contacts and a separate design team also helped us in the design process, eliminating unnecessary waste. Most importantly, perhaps it really demonstrates the ideal UX process for me. Thanks to it we were able to successfully craft, pitch, and validate a design strategy that truly advocates for user needs, bringing tangible good to real people.