Building a website for patient engagement

The Alpha-1 Foundation (A1F) is a non-profit research foundation focused on curing Alpha-1 Antitrypsin Deficiency (AATD), a genetic disorder that can cause lung and liver damage. The readability and usability issues of their existing website created a challenging user experience, resulting in low programming engagement.

We embraced plain language practices and user-centered design to create a better online experience for A1F’s site visitors. We built their new website from the ground up, developing content and restructuring navigation around users’ needs. Our process also included fixing and enhancing high-priority features and making the site mobile responsive.

The challenge

Our approach

How we helped

Design concepting and execution
UX audit and heuristic evaluation
User survey
Card sorting
Copywriting
Plain language writing
Usability testing
Site build — including custom features and responsive design
CMS integration
Client team training

Impact

We transformed the Foundation’s website into an easy-to-use, intuitive resource that meets the needs of its audiences and has helped the organization grow

We started with research and discovery to ensure a truly user-centered approach reflective of audience pain points and motivations. Our process included:

Qualitative and quantitative user assessments
Stakeholder sessions
User survey
Heuristic evaluation
Open card sort
Readability testing

Identifying audience needs

Design concepting

Drawing on user surveys and heuristic evaluation, we identified key visual principles and priority features to guide our design concepting. To elevate the Foundation’s existing brand without evolving too far beyond it, we incorporated the logo’s “spotlight” angularity and signature purple throughout the site, while adding new complementary shades to their visual language.

We prioritized readability in the redesign, selecting an appropriate typeface, choosing an optimal point size, providing sufficient line spacing and contrast, building in white space, balancing color contrast, and adding alterative text for images so the content is clear and accessible to all users.

Sleek, professional redesign

The redesigned Alpha-1 Foundation website immediately gives the impression of leadership, confidence and compassion. We elevated and refined the Foundation’s existing brand to create a more distinct and resonant brand experience.

Enhanced information architecture

The new site’s clearer information hierarchy makes it easier for users to find what they seek, consolidating more than 700 pages of content into 140. Our responsive design ensures seamless navigation from any device — desktop, tablet or mobile — with information clear and accessible on any screen size.

A new interactive map enables users to search for available resources and providers by zip code, streamlining the process of finding a local specialist or support group. Users are prompted to share their contact information for map access, supporting email list growth.

Simplifying the search for a specialist

We rewrote the site's content using plain language best practices to ensure users can find what they need and make use of what they find. Most content pages take the form of an inverted pyramid — the most important information first, followed by details. We used short words, sentences and paragraphs, active voice, and common, familiar language.

Prioritizing readability and comprehension

The Foundation’s website has become an intuitive resource that meets audience needs and positions the organization for continued growth.

Site visitors are engaging with content and resources at higher rates, with initial feedback highlighting how easy it is to navigate the updated video library and support group map.