UX Design | Cleveland Clinic

Consumer Email: Design & Design System

Overview

Contributed to and helped design our Consumer Email design system and several high traffic emails that are sent our for Health Essentials, medical news, and more.

My Role

Competitive Analysis, UX Design Co-Lead, Team Collaboration, Design Documentation and Development QA.

Who Was Responsible

I was part of a team consisting of another UX designer who co-lead efforts with me, and front-end developers.

Background

With dozens of consumer emails as well as internal emails - a complete redesign of our emails was needed. I collaborated with another UX Designer on the consumer emails - building the essential two consumer emails: Health Essentials & Daily Tips. These two emails formed the components for the design system for the consumer emails.

The design system was built in Zeroheight - documenting styles, colors, CTAs, & breaking down all of the components showing how they can be used, etc.

A screenshot of the design system

An example of an internal email I designed where several components were taken for the final internal email designs.

An abandoned early Health Essentials design.

Consumer Emails & System

Consumer Emails Live:

Health Essentials

Daily Tips

Children’s

Cleveland Clinic Canada

Targeted Category Health Essentials Emails

Components:

Content Feature - Primary Article

Content Feature - Digest Email

Content Feature - Secondary Articles

Content Feature - Tertiary Articles

Content Feature - List

Content Divider

Callout

Bulleted Link List

Category Display Block

Social Video Share

Email Settings Block

Cleveland Clinic Feature

Footer

Health Essentials Email

Old Design

Improvements Made With The New Email Design

The new email gives establishes updated, refreshed branding for Health Essentials that was carried over in the Health Essentials Blog Redesign a few months later.

New design offers content writers and editors additional ways to share content:

  • Enhanced engagement options for readers to connect with relevant health information.

  • Multiple formats for displaying content: primary, secondary, and tertiary, for improved hierarchy in what is being displayed to the reader.

  • Integration of social video sharing from platforms like TikTok - creating new entry points for readers to engage with different types of content, giving us more traffic on social platforms.

  • Feature categories of content for better organization and accessibility - giving readers appealing visuals to encourage them to engage with these health categories.

  • Inclusion of pull-out quotes from medical professionals for engaging information.

Enhanced personalization for the user:

  • Prominent CTAs for users to share emails or unsubscribe, prioritizing user actions. Acknowledging that making the unsubscribe prominent is an unexpected behavior, yet helps build trust and helps the email ranking to not be labelled as spam.

  • The new features and functionality emphasizes evolving user needs towards personalized and comprehensive content formats.

Daily Tips Email (Digest Format)

Old Design

Improvements Made With The New Digest Design

Similar improvements from the main Health Essentials email are carried over:

  • Enhanced ways for users to engage with content and emails.

  • Branding of Health Essentials as pale green to distinguish it from the main site

Increased prominence of the highlighted Daily Tip, now emphasized as a helpful wellness tip:

  • Transformation from a seemingly random article highlight to a purposeful health tip

  • Gives the featured Daily Tip a more engaging and “fun” layout, suggesting for the content writers engaging, catchy phrases to catch reader’s attention in the H1.