Zapier Email Design System

Overview

Zapier sends millions of emails every month, from marketing campaigns to product updates and transactional notifications. As the number of email programs grew, the existing templates couldn’t keep up with the team’s needs or the evolving brand.

The Email Design System (EDS) was created to unify design and improve engagement, while also giving teams more flexibility to build emails that feel distinct and Zapier.

Goal: Build a scalable system for marketing, product, and transactional emails. I owned the creation, development, and maintenance of the system.

Challenge

The system had to serve multiple teams:

• Marketing needed expressive layouts for campaigns.

• Product and engineering teams needed lightweight, functional templates for transactional and in-product communication.

The challenge was finding the balance of flexibility without chaos, consistency without sameness.

Naturally, we also had business objectives:

1. Increase engagement through visually appealing, brand-aligned designs.

2. Boost activation rates by guiding users effectively through onboarding and trial flows.

Process

R1: Research

I started by auditing all existing email types and interviewing designers, marketers, and engineers.

Key learnings:

• Great design alone doesn’t make an email effective, the content design is equally critical.

• Dividing emails into two clear categories (marketing vs. product/transactional) simplifies design decisions and ensures scalability.

• Future opportunity: closer collaboration between Brand Studio and Email Marketing to co-design key flows like onboarding and activity reports.

R2: Exploration

In the exploration phase, I experimented with tone, hierarchy, and visual rhythm. I played with how color, contrast, and structure could make each message feel fresh yet familiar.

Team feedback highlights:

• Colorful section backgrounds make templates more modular and scalable.

• Dark footers add depth and feel truer to Zapier’s evolving brand character.

R3: System Build

Next, I began formalizing final components in Figma:

• Leveraging variables to simplify color and layout customization.

• Updating atoms, molecules, and organisms to handle new style variations.

• Creating guidelines for marketing, product, and transactional email composition.

Outcome

Zapier Email Design System:

• Enables teams to design distinct, branded email styles for each program.

• Improves user recognition and reduce inbox fatigue.

• Provides self-serve templates in Figma and code, streamlining handoffs between design and engineering.

We also received multiple recognitions from various email critique outlets.