Yahoo

DISCOVER 01

What are Gen Z's characteristics?

Based on global reports.

Be Together.

Stay connected with friends and meet new people online.

Be Informed.

Explore the world and keep updated on current events.

Be Entertained.

Find interesting content for enjoyable time-passing.

Gen Z (born between 1997 and 2012), whose age range is anywhere from 11 to 26 ( so as of 2023), are commonly referred to as the first fully “digitally native” generation.

DISCOVER 02

Key insights into Gen Z's news browsing experiences.

Negative emotional impacts

Excessive negative news impacts Gen Z's mood, leading them to avoid it to protect their mental well-being.

Friends: a new source of news

Gen Z gets news from friends, preferring socially shared content over traditional sources like newspapers or websites.

Based on 11 user interviews.

Biased algorithm-recommended news

Personalized news often limits Gen Z's exposure to diverse opinions, showing only one side of a story.

Desire for social engagement

Gen Z wants informative, engaging news on friends' interests and social issues to stay informed and start conversations.

DEFINE

Prioritized design requirements based on business and technical considerations.

Socially relevant news for connectivity

As Gen Z is eager to stay connected with their friends and often uses news as a conversation starter, it is crucial to deliver news content that reflects the interests and activities of their social networks.

Captivate and engage Gen Z users

Aligning with Yahoo’s business strategy, increasing Gen Z users is the top priority. To achieve this goal, it is essential to develop an engaging approach that encourages Gen Z to read more news on Yahoo app.

Design requirements not being addressed and why...

Emotional impact awareness/ Content balancing

Yahoo's rich content offering, managed by a dedicated content creation team, is one of its business strengths. Balancing content or enabling user filtering requires consultation with this team, which isn’t feasible within a short internship.

Design requirements not being addressed and why...

Diversity in news presentation

Since ensuring a diverse range of perspectives in personalized news content is a crucial issue, the product team at Yahoo has already begun addressing this challenge.

FEATURE 02

Stay connected through real-time comments and news insights.

Dynamic Comment Stream showcases real-time news comments from users' social networks in a lively format, encouraging users to explore more news and engage in conversations with friends.

01. Why is it better than the current news commenting system?

01. Increase news engagement via social connection.

02. Friends first, always.

Current commenting system:
places comments after the article, requiring extra clicks to access, which makes them feel secondary.

Dynamic comment stream:
leverages friends' comments as the initial touchpoint. It highlights friends' comments upfront to tap into Gen Z’s desire for social updates, encouraging interaction and increasing their engagement with Yahoo News content.

Current commenting system:
includes comments from all users, but for Gen Z, they care more about the thoughts and relationships they share with their friends.

Dynamic comment stream:
filters comments to show only those from friends, allowing users to connect more directly with their friends' ideas and engage in meaningful conversations.

02. How did I design the new UI element?

FINAL DESIGN

Pros - Easier to read text. Take up less horizontal and vertical spaces.

Cons - Harder to tell the sender.

EXPLORATIONS

Pros - Easier of reading texts. Visually balanced.

Cons - Space efficiency.

03. What is the final prototype?

Viewing friends' comments also leads users to the original news their friends engaged with.

Dynamic Comment Stream boosts news engagement while strengthening users' connections with their social circles.

FEATURE 03

Spark deep talks with AI-powered news summaries.

Topic Deep Dive leverages generative AI and provides news summary and articles related to content shared in the comment stream, offering a comprehensive view of topics and fostering more discussions with friends.

01. My process for designing the AI-powered summary feature.

Explore domain knowledge

Researched how people create news summaries without using AI.

Propose and refine design

Presented design and use case to the data scientist, discussed and iterated by learning advantages and limitations of ML technique.

Craft effective prompts

Collaborated with the data scientist to develop, test, and refine prompts for GPT-series models.

Develop the final Proof of Concept

Created high-fidelity prototypes and ensured technical feasibility.

02-1. What are the elements of a good summary?

Structure

Starts with the most notable information or organizes the content chronologically.

Content

Crafts a captivating headline under 14 words. Ensure content is accurate, concise, paraphrased, and properly sourced.

Tone

Be objective, with no personal opinions.

02-2. How long should the AI-powered summary be?

DESIGN DECISION

words

Expect users to take no more than 15 seconds to read.

238

words

Average silent reading rate for adults in English per minute.

seconds

The attention span of a Gen Z individual.

02-3. Summary format: paragraph or bullet points?

DESIGN DECISION

Bullet Points

Quick
Concise
Easily scannable

Paragraph

narrative flow, detailed explanations, or a more formal presentation.

02-4. Designed a feedback feature to address potential errors made by LLMs.

Limitations of LLMs

LLMs may produce summaries with factual inaccuracies or misinterpretations of the source text.

Design Solution

Include an error feedback option for users to report any mistakes in the summary, helping to improve model accuracy and content quality.

I presented the design and use case to the data scientist, and after our discussion, we decided to use LLMs instead of an extraction-based approach for generating our AI news summary.

03. Crafted effective prompts for GPT-series models.

Working closely with the data scientist, I followed the principles outlined in Microsoft's 'Create Effective Prompts' guidelines to design, test, and refine our AI summary generation prompts.

*The exact content of the prompt cannot be shared due to a non-disclosure agreement (NDA).

Goal

"create a captivating headline and a summary…"

Context

"…to help the user quickly understand the event."

Expectations

Detailed requirements for the structure, content, tone, length, and format of the summary.

Source

"...using the provided news articles on the same topic."

04. Developed high-fidelity prototype for Proof of Concept.

Users can use the ‘Explore this topic’ button to gain deeper insights into the news topics their friends are talking about.

The AI summary helps users quickly catch up on the news their friends are talking about, making it easier to initiate meaningful conversations.

The AI-generated summary offers users a quick grasp of the main points of the news topic and suggests related articles for those who want to explore further.

How can we enhance users' connectivity with their friends while simultaneously encouraging them to read more news ?