The Heart Foundation

UX/UI Design | Design Language System

The Heart Foundation, a pivotal organization dedicated to combating heart disease, required a website redesign to reflect its commitment to saving lives through modern and accessible information delivery. Recognizing the diverse audience of the foundation, including patients, healthcare professionals, and donors, the project was centered around creating a user-friendly experience that catered to the specific needs of each user group.

Heart Healthy Recipes
Heart Foundation - Recipes Page Desktop
Heart Foundation - Mobile Mockups

The Project

The goal of this project was to overhaul The Heart Foundation's website with a primary focus on enhancing the user experience (UX) and user interface (UI). The redesign aimed to provide a more intuitive, engaging, and accessible platform that effectively communicates the foundation's mission, increases donor engagement, and provides valuable resources to users.

The Deliverables

  • User Interface Revamp: Introduced a cleaner, more modern design that aligns with the latest web standards. The new UI uses a calming color palette inspired by heart health and wellness, streamlined menus, and responsive design elements that adapt seamlessly across devices. This visual update not only enhances aesthetic appeal but also improves navigation and readability.
  • Improved User Experience: The website now features a structured layout with clearly defined sections for information, donations, resources, and community stories. Enhanced UX design principles were applied to ensure that information is easily accessible, with interactive elements and call-to-action buttons strategically placed to guide users naturally through their journey on the site.
  • Development of a Design Language System (DLS): A comprehensive DLS was created to ensure consistency across all digital assets. This system outlines specific guidelines for the use of colors, fonts, layout structures, and interactive elements that maintain brand identity and improve the cohesive visual and functional flow of the website.
  • Accessibility Enhancements: With a focus on inclusivity, the redesign prioritized accessibility improvements to meet WCAG guidelines. Text contrast, keyboard navigability, and screen reader compatibility were key areas of focus, ensuring that all users, regardless of ability, can access and benefit from the site's resources.

The Outcome

The newly redesigned website of The Heart Foundation has succeeded in creating a more engaging and user-friendly platform. Early metrics indicate increased visitor retention and higher engagement rates, particularly on pages related to health resources and donation opportunities. Feedback from the community has been overwhelmingly positive, with users appreciating the ease of navigation and the thoughtful layout that prioritizes user experience. The project not only strengthened the foundation's online presence but also reinforced its commitment to supporting heart health through accessible and effective communication.

Role the credits!

Designers: Brody Page, Matt Spier, Naya Nutchins + a couple more from Mudbath.

Agency: Mudbath 

More of my work:




Dr WalletUX/UI



I'm Brody.

An Experience Designer based in Tasmania, Australia.

Phone: +61 422 270 196