My role for this project:
UX/UI & Motion Designer
Context:
New eBay enterprise branding strategy created in 2016, which was based on 
a holistic approach, focused on intersection of customer desires and 
unique eBay offerings. Previous CRM Email focused on the engaged item and 
surfaced additional content, they have various display methods and
included over 50 different email types based on Design System 3 (DS3). 
There is need to redesign the Email design system. Collaborated with 
another designer in the team, we have successfully accomplished this project.    

Need: 
Emails are critical extensions of the site experience, we needed to improve 
the CRM email user experience to help customers make decisions and take action. 

Goal:
Improve the CRM email user experience by creating a new cohesive 
design system which aligns with the new eBay branding experience. 

Design Process:
Researched and studied the eBay Brand Playbook
Collaborated with key stakeholders
Analyzed and categorized previous CRM emails
Performed competitive analysis 
Created design strategy
Created content strategy
Defined accessibility requirements

Design Strategy:
Creating a component based design system. Each component has clear naming 
convention and organize each in one of six distinct groups in the design system.

Content strategy defined: 
Tone of Voice
CTA Guidance
Messaging structure 
Titles for modules
   ​​​
DS6 Content Groups:
During the design phase, I worked on the type ramp, helped to define the 
typefaces and font size we use in the design system. 
Created animation contents (worked on concept, design and animation) and they were added
to the library Animation section. Some animation examples used for email banners.  
Mobile                                                                                                                     Web                             
Created new email header components by applying the new design system and added in the library.
Created new email design examples for different mobile screen sizes in the page group.
Created new coupon offer email design and added to the library. 
Click on the play button to see this email contents on mobile. 
Refined all the components and organized them on Zeplin by email content structure, and provided guidance to devs and PMs for how to use those components. Added newly created components to the library. 
Email designed using old design system components and new email designed by applying the new design system we created. 
Web
Click on play to see the full email contents. 
Web: 
Email design after applying new design system. (DS6)

Mobile
After we created this email design system, all CRM emails were planned to apply this 
new email design system. By utilizing those components and usage guidelines from DS6, 
email creation & implementation process significantly improved. Component based 
design strategy produces more diverse, engaging, and self-expressive CRM emails. 
It also ensures cohesive, easy recognizable CRM email design and improved customer 
experience results in higher platform engagement. 

You may also like

Back to Top