Yahoo Mail Today Tab

When

2020 - 2022

Role

Lead designer
- Interaction Design
- Visual Design
- Prototype

Team

1 Project Manager

4 Mobile App Developers

2 Researchers

1 Design Manager in Taiwan

1 Design Director in U.S.

When

2020 - 2022

Role

Lead designer
- Interaction Design
- Visual Design
- Prototype

Team

1 Project Manager

4 Mobile App Developers

2 Researchers

1 Design Manager in Taiwan

1 Design Director in U.S.

Evolve Yahoo Mail from a communication tool into the personalized content hub that powers users' daily routines.

I led the design of the personalized news experience in Yahoo Mail through rapid iteration in rolling research, driving product launch across 30 global markets.

30

Global Markets Launch

Today tab was launched across   30 global markets in Oct 2020.

52.5%↑

Time-Spend

Users who used Today tab have increase engagement (TS/UU) 52.5% with the app.

89%

Retention Rate

Today tab users’ D7 Retention rate (4 points above the app baseline).

Background

Launched in 1997, Yahoo Mail serves millions of daily users globally. However, in recent years, Mail became people’s personal media folder — Users receive more messages containing content rather than person-to-person communication.

Launched in 1997, Yahoo Mail serves millions of daily users globally. However, in recent years, Mail became people’s personal media folder — Users receive more messages containing content rather than person-to-person communication.

Yahoo Mail explorations based on the concept of “Mail as a personal media folder“.

Meanwhile, our research revealed a rising business model in APAC: Super App. Grab, WeChat, and Line, they set new expectations for integrated, all-in-one experiences.

12 logos to demonstrate Super App successful apps

Super App successful cases

Grab App: Home page

We believe that Yahoo Mail can serve as an ecosystem, where users explore diverse types of contents, starting from our core competence and strongest brand asset: News.

We believe that Yahoo Mail can serve as an ecosystem, where users explore diverse types of contents, starting from our core competence and strongest brand asset: News.

Collaborating with Global Teams

For this project, I partnered with two teams between the US and Taiwan.

To bridge the collaboration, I initiated regular sync-up meetings with the US team designers, and guided the product manager and engineers in Taiwan team to apply the global design system.

Design Process

I designed two versions in parallel — an MVP and prototypes for rolling research. We validated both through A/B testing and selected the final version for launch.

Method

Rolling Research: I collaborated with 2 UX researcher to validate 5 design concepts over a 3-month bi-weekly qualitative user research. Our findings directly shaped the product value proposition and design direction.

Design iterations throughout the study.

I observed the user interview conducted in the UK remotely.

Research Finding #1

Today tab as my news: Users seek for explicit control over their content feed. Through the rolling study, I explored different dimensions of customization.

User Need

"Is there an option where you can change what you receive and what you see?"

Proposal A

Like and dislike options

User Need

“I want a way to say I never want to see that publication.”

Proposal B

Control over news sources

User Need

“[I am] sick of sports and politics. I don’t want disasters and killings. But I’d love to see something make me feel nice. A big event. A nice offer. A nice place to go...”

Proposal C

Add favorite topics

Final Design: I designed a MVP version focusing on content control. This streamlined feature meets both user needs and technical constraints.

Users can manage and block specific news publishers from their content stream.

Research Finding #2

Weather forecast as an essential tool to prepare for the day. Users rely on services like BBC Weather and the Met Office to prepare for their day. To address this need, I iterated 3 weather module designs.

Proposal A

Shortcut on navigation bar

User Testing Result

Users struggled to find content due to small text size and couldn't get enough weather details.

Proposal B

Expandable utility module

User Testing Result

Users wouldn't interact with the expandable module and missed the weather details.

Proposal C

Detailed weather card

User Testing Result

Users appreciated the detailed weather information but wanted to see precipitation forecasts as well.

Final Design: I designed a scrollable weather module that maintain visibility for news content while still providing essential weather information.

A compact, scrollable weather module on top of the Today tab.

Inclusive Design

Drive accessibility for visually impaired users. I collaborated with 4 engineers and global editorial teams to redefine content structure and rewrite text label for screen reader.

🔊 Readout Before formatting

🔊 Readout Before formatting

"Horoscope icon, Gemini, 5 of 22, minus, 6 of 21. Feeling good, 22 July."

🔊 After formatting

🔊 After formatting

"Horoscopes, Gemini, Prediction for 22nd of July. Feeling good."

I created a shared document to collaborate with our international editors, defining content order, format, and screen reader-friendly descriptions.

I used Google Spreadsheets as the shared document.

I created a guideline for the developers on how to implement the focus area and the content format.

Defining focus states and readout behavior.