Email design system overview

Welcome to the email design system! We’re excited for you to dive in and start building exceptional emails. Here’s everything you need to get going.

A colorful example of the top portion of an email including the hero image and secondary content.

Considerations

Conversational

Emails should be designed for and written for humans using our eBay Voice and Tone.

Easily understood

The content should be easily scanned and read quickly, with clear visual hierarchy and calls to action.

Valuable

Emails should be targeted and have clear intent.

Anatomy

Wireframe of an email on large screen with 3 pointers indicating the top, middle and bottom of the email. Pointer #1 indicates the top portion of the email which has an image and logo. Pointer #2 indicates the middle portion of the email which has a seed item, education module, and seller module. Pointer #3 indicates the bottom section of the email which has a survey module and then the email footer.
  1. Primary content
  2. Secondary content
  3. Tertiary content

Content types

Primary content

Primary content modules include Headers that contain the eBay logo and Heroes that either contain either a simple image or a headline and CTA.

Zoomed in wireframe of the top portion of the email which has an image and eBay logo in the top left corner.

Secondary

Secondary content modules include Titles, Seed items, Item tiles, Paragraphs, Info modules, and Banners.

Zoomed in wireframe of the middle portion of the email which has a seed item, education module, and seller module.

Tertiary

Tertiary content modules include Surveys and Footers.

Zoomed in wireframe of the bottom portion of the email which has a survey module and then the email footer.

Module anatomy

Graphic of a module’s anatomy. In this particular module, Number 1 points to overline, 2 to headline, 3 to subcopy, 4 to CTA, and 5 to disclaimer.
  1. Overline
  2. Headline
  3. Subcopy
  4. CTA
  5. Disclaimer

Email tiers

All emails fall under a three tiered framework. Each tier serves a different purpose with varying levels of brand expression growing from least to most.

Tiered scale starting small on the left and getting larger on the right. The left piece has a pointer with text that says “Account:  To support account activity instilling trust with the customer.” The middle piece has a pointer that says, “Transaction: To help complete existing and a new shopping journey”. The right piece has apointer that says, “Marketing: To inspire new shopping journeys based on a customer’s interests.”

Account

To support account activity instilling trust with the customer.

Email using the account tier email that says, “You should receive a refund by 10/23/20” in the header. It has an item tile and minimal footer below.

Transaction

To drive conversion and completion of an existing shopping journey.

Email that says, “Don’t miss it! There are 1,771 watchers but only 10 left” with a seed item module, item tiles, an education module, and the full footer with app download buttons below.

Marketing

To inspire new shopping journeys based on a customer’s interests.

Email with an image in the header and says, “(Pre)love fashion for less” in the title. There is visual navigation, an education module and seller cards below with the full footer.

Resources

Change log

DateNotes
Sep, 2024
  • Added resource card for the email icon tool
  • Updated email tier examples
Jun, 2024
  • Created with eBay Evo