American Heart Association

Project Overview

As a subsidiary of the American Heart Association, Know Diabetes By Heart and Hypertension websites were established to raise awareness about diabetes and its correlation with heart conditions. The overarching goal is to disseminate valuable information on this topic to both professionals and non-professionals, while facilitating connections between patients and their healthcare providers.

Content serves as the cornerstone of this initiative. With a vast repository of existing data and ongoing curation efforts, it was imperative for the websites to have a clear direction and defined rules regarding the dissemination of content—addressing how, to whom, and when it would be accessible to users. Furthermore, the platforms needed to support patient engagement by enabling geolocation-based connections with healthcare professionals, while also providing professionals with easy access to search and share valuable information with their patients.

Information Architcture

Analytics Report

During the discovery phase, a thorough evaluation was conducted through data analysis and stakeholder interviews. Below is an excerpt from a report compiled by one of our analysts, which was cleaned for analysis purposes to define the site architecture. This process entailed categorizing pages, defining labels, and organizing the site structure, which you'll see examples later.

Resource Filters

Both websites necessitated a comprehensive understanding of available data types and their tailored display based on the user's location within the site experience and their user personas. Below, you'll find an illustrative filtering diagram showcasing how content types was mapped to various filter options and segmented user experiences. This approach ensures a personalized and intuitive user journey, enhancing overall engagement and satisfaction.

Site Map

For the Know Diabetes By Heart website, two primary user segmentations (and three for Hypertension) were thoughtfully developed. This ensures that each segmentation receives tailored information pertinent to their specific needs. While much of the content, such as that for non-patients, is displayed across both paths, a detailed illustration delineating the distinct pages and their structural organization was imperative. This approach ensures users receive a personalized experience that resonates with their unique requirements and preferences.

Wireframes

The wireframes encompassed comprehensive documentation detailing all components, specifying the type of content to be displayed within each, their respective behaviors, and the timing and manner of their display within the page templates. Additionally, they meticulously documented the placement of each component on the page—whether at the top, middle, or bottom—to ensure users' expectations align with established patterns and recognition, thereby guiding their experience predictably.

Designs

Navigating health-related journeys can be a challenging experience, particularly those related to patients. The design of the site is specifically crafted to alleviate some of these difficulties and streamline the overall experience. It is intended to be both simple and informative, with content driving the user experience and designs reinforcing the AHA's brand while assisting users through various design principles such as alignment, sizing, and contrast to ensure predictable behaviors.

In addition, animations and motions are strategically incorporated to enhance user engagement, effectively conveying a wealth of information available to all users in a compelling and interactive manner.