HQO COPD Clinical Care Guidance

Adapting a paper flowchart into a responsive web application
User Experience, Prototyping

Health Quality Ontario asked Healthcare Human Factors to transform paper-based medical guidelines for chronic obstructive pulmonary disease (COPD) into a responsive web application.

Environmental Analysis

To begin, we interviewed health professionals on best practices, experiences, and the accuracy and usefulness of the guidelines. Additionally, we analyzed existing care pathways such as NICE by the NHS to better understand the structure of care guideline applications.

Areas of Opportunity

Our goal was to simplify the pages of the existing HQO COPD care guidelines (flow chart), without compromising important information.

Contextualized & Helpful Information
Consulting with the client, we compiled existing approved COPD web resources that would assist clinicians as well as patients.

Responsive Web Application
We wanted to design a responsive application that could work in an emergency setting as well as in a clinical consultation setting.

Target Audience
Clinicians and healthcare professionals who may not encounter patients with COPD complications, and newer, inexperienced healthcare workers.

Wireframes & Prototypes

My colleague created the mobile Axure prototype based on HQO care guidelines and interviews. Based on mobile prototype, I created the desktop prototype in Axure. Working in Agile development, we quickly tested interactions and experiences with each iteration.

Usability testing revealed that users did not find or want to use the dropdown menu. Thus, we implemented a more familiar hamburger menu.

Taking advantage of the space, the desktop prototype displayed the menu and search bars at all times. Overall, users found both the mobile and desktop versions easy to navigate and useful for less common COPD care information.

Usability Testing

My role primarily revolved around usability testing. I wrote 10 usability testing scenarios and pre- and post-surveys. I assisted in recording participant observations and eliciting open-ended feedback with health professionals in their offices/hospitals. We asked for feedback on the accuracy of the guidelines and the potential helpfulness of the app itself.

We further optimized and simplified the mobile and desktop prototypes using the feedback we received during testing as well as meetings with our stakeholders. I analyzed and compared data from two rounds of testing, which showed improved navigation ability and satisfaction with the application.


We found that users appreciated the fact that we had included clinic maps and test thresholds, as they are normally memorized or readily found consolidated. Our graphic designer created a visual treatment based on a set style guide. We received positive feedback from our stakeholders on our design and analysis.

August-September 2014