Enterprise Newsletter Redesign

Helped increase the article CTR from 15% to 45%

Microsoft 2020

 
 
 
 
 

2019.11 - 2020.3

[Project Background]

The AI based newsletter gives enterprise users a quick industry update. Corporations subscribe the product for their employees to keep them up to date with news related to their company, work, or industry, as well as help them grow in their professions. For this project, the product team aimed to increase the article CTR through UX redesign and algorithm refinement.

[My Responsibility]

Interaction and UI design/User and competitor research/Communicated with developers

 
 

Before👇

After👇

Enterprise newsletter informs enterprise users the latest news/trends/topics in their industry

Every morning, the enterprise users receive an industry update, with news related to their company, work, or industry, in their company email account. However, the current news article CTR was around only 15%.

 

Product goal: improve the service quality and raise the news article CTR

What factors may affect the news CTR?

UI/visual design

  • Reading efficiency

  • Appealingness

Interaction/user flow

  • Simplicity/efficiency

  • Intuition

Content

  • Relevancy and quality - not much designers can do😭

  • Personalization and customization

  1. Researched UI trends and explored visual design opportunities through competitor analysis

  • Using cleaner layout with line separation instead of cards (80%)

  • Removing snippets for news articles preview (74%)

  • Having sharp contrast and big bold titles (86%)

I researched 11 news website independently and analyzed 1000+ UI patterns with the news design team to generate UI design trends for news products. The image shows part of the UI parameters we researched into in competitors.

UI redesign

 

2. Discovered interaction design issues through quick & dirty user interviews

I talked to 3 employees that subscribed the newsletter and found out:

 

[User quotes]

“The feedback form is so complex. I will just close the window and leave it.” —— Manman, Microsoft Employee

“Wow I never noticed this feature (customization) before. What’s the benefit?” —— Chuyao, Microsoft Employee

 
 

Improving interactions to increase personalization

  • Simplified the user feedback flow with in-app interactions, instead of prompting users to open feedback form in browsers

    The new ‘report’ flow👇

 
 

The new ‘like’ flow👇

 

  • Optimized the first-run experience and promoted topic customization

Added an education page to encourage personalization and customization 👇

Redesigned the welcome newsletter and promoted customization👇

 
 

  • Designed the second-time topic tile for old users to encourage topic customization

 

Mobile design

Iterations👇

Final design👇

Design iterations

Overall design process

The UX redesign, together with ML improvement, successfully raised the article CTR from 15% to 45%

 
 

My reflection & take-aways

  • Honed UI design skills and learned to do visual style research: as my first UX internship, this job helped me gain hands-on experience with interface design and I learned how to deliver pixel-perfect UI from my amazing mentor Saber

  • Collaborate with developers and conducted fit and finish: since I was responsible for communicating with the developer to make sure the implementation of the design, I learned about the bug-bash process and how to collaborate with software engineers

  • What could be done better: I should try to understand more about the project context and big picture at the beginning, in order to make design decisions more proactively and intentionally