Brief News Case Study

Short-form news to keep up with the stories you care about.

Updated June 2023

Role: Product Manager & Product Designer

Collaborators: 2 Engineers and 1 Designer

Figma Design/Prototype →

Problem: Keeping up with the news is frustrating.

We want to stay informed, but the state of news today is a minefield.

Take this article from USA Today.

It’s crazy long and filled with ads.

There’s usually a few sentences in any article that tell us 80% of what we actually care about, but they’re really hard to find.

Because the incentives for news publishers are directly opposed to the needs of news consumers. Publishers are incentivized to write longer articles that have less information, linking out to additional articles, rather than focusing on the important details. Their goal is clicks and ads. The more they write, the longer you scroll, and the more ads you see.

News consumers on the other hand want to stay informed as quickly and enjoyably as possible, consuming as many stories and as much information in as little time as possible to they can get back to their life.

We believe there’s a better way to keep up with what matters.

Background

2/3 Americans that read news get it from social media

74% (a C grade) Average consumer satisfaction with digital news brands

53% of Americans read the news daily or multiple times a week

User Research

We interviewed 50 potential users from our friends and family, to strangers waiting in line at a cafe, to self-proclaimed news fanatics.

“I love short email newsletters like Morning Brew but it’s not personalized and it get’s lost in my inbox”

Insights: Prioritize speed and personalization.

“I listen to NYT’s The Daily Podcast on my way to work, but it’s like 40 minutes long and I don’t care about all the stories”

Insights: The importance of audio news, multitasking, and daily news routines.

“I don’t feel informed. I’d like to, but I feel overwhelmed when I go to a news website and see all the headlines, so I usually skim them.

Insights: Headlines aren’t enough. Articles are too much.

Design Goals

Provide users with a fast and convenient way to consume news stories as part of their daily news ritual. Learn over time and curate their feed, while distilling the thousands of stories published daily into their most essential facts in text and audio using generative AI.

How might we make the news more digestible and enjoyable so that users feel informed and empowered to keep up with the news and stories that matter to them.

Objectives:

• Maximize information density
• Inform don’t overwhelm
• Design with flexibility and expandability

Measuring Success

Key Features

1. Short-form stories: Brief helps users to stay informed without spending excessive amounts of time reading lengthy articles. We targeted a 10-20 second read time for each story based on customer interviews, and used GPT to distill each story into 3 bullet points.
2. Curation that improves over time: By curating content based on the user's reading history and behavior with a recommendation algorithm, Brief serves news stories that are more relevant and meaningful to each user. This presents an ethical concern around “news bubbles” that we’re hope to solve by mixing in a few stories a user may not have checked out on their own.
3. Delightful onboarding experience: The onboarding experience is crucial for engaging and retaining users, and curating content from the first use. No phone numbers and emails to login, just explain why they will love Brief and guide them through a narrative where they indicate their topic interests and preferred publishers.
4. Customized podcast: We created a personalized audio feed of your top stories, ready to go, every morning. We used Microsoft’s ML text-to-speech, so it sounds just like a real podcast but with none of the fluff, and only the stories you want to hear.
5. "Why this matters" callout: We believe that other news aggregators and publications miss this key detail. By highlighting why a particular story matters and how it relates to the user's interests or concerns dynamically for every story, Brief provides a more meaningful and engaging news experience.
6. Speed, speed, speed: Brief should fit into the user’s life, and seek to quickly inform and then get out of the way. By optimizing the app's performance, preloading stories in the background, and downloading them for offline reading (for readers commuting by train without connectivity or hoping to save on data costs), Brief can deliver news stories quickly and seamlessly, making it easier for users to stay informed on the go.

Comparison

On average, it takes 5.5 minutes to read a regular news article.

With Brief, each story takes just 12 seconds on average.

So in the time it takes to read 1 full news article, you can read 28 stories with Brief.

Competition

There’re other news aggregators like Google News, Apple News, and Artifact. And they have millions of users. But all they do is repackage the same, long articles with the same, bad content.

On the other hand, short-form news publishers like Axios and Morning Brew are loved by their readers and they’re growing like crazy. But they have a limited selection of content and don’t personalize it for each user.

Brief combines the best of both by transforming long-form content into more digestible formats, and curating it in one feed.

Business

Brief will be a freemium service, with a 30-day free trial for our paid tier.

After the trial ends, users will get 10 stories a day for free.

We’ll earn revenue from sponsored stories, where news publishers can pay to highlight their stories in the Brief feed.

And for 4.99 a month, users can sign up for Brief Plus, to get unlimited stories, and no sponsors.

Solution (Interactive)

Process: News Feed

As a Post-it Note enthusiast, we began by brainstorming things we wanted in the app and things we disliked about traditional news content.

We created a low-fi version of short-form news stories in a spread sheet to test out how they felt to read with users in terms of length, content, and format.

I experimented with different layouts for the stories, from bullets, to Snapchat Story-style full screen images, to swipe-able cards.

Tradeoff: Accessibility & usability or aesthetics

While I liked this TikTok-style full-screen layout visually, it had major drawbacks for both accessibility and usability because it restricted the height of each story to the phones viewport. Since no additional scrolling within each card would be possible, the text would have to be small and the drop downs conflicted with the layered layout. And if a user had Dynamic Font Sizes for the visually impaired, this layout would completely break.

Design Objective: Maximize information density

I spent some time fine tuning the layout and moved away from the card style (left) to a full width style (right). This allowed us to fit about 2 more characters per line and reduced the height and visual weight of each card.

Design Objective: Inform don’t overwhelm

A big question was how much of each story to show before any user interaction. I noticed when conducting user testing that even though users said they loved the “Why this Matters” section, they only read it on their favorite stories, so we decided to collapse it by default to reduce the about of information on each story and make it less overwhelming.

Final News Feed

Process: Podcast Player

We experimented with a few different options for the podcast player, from not having one at all and having a play button for each story, to having a running queue of all stories, to an automatically expanding thumbnail in the style of a rolodex.

Ultimately we settled on a more familiar podcast player layout, with large story images in the place of album art.

Something I noticed in user testing was that in the original (left), people didn’t realize the queue was scrollable and had more stories below it. So we adjusted the layout so that part of the second story was cut off (right), subtly telling the user that there is more to see if they scroll.

Finally, we added a miniplayer so that users could scroll through text stories while they listen to the podcast.

Final Podcast Player

Process: Onboarding

We wanted onboarding to be fast so that users can get to the news feed and start consuming. It also needed to feel personalized and designed so that we can add more categories over time as we support them.

We selected the modal since it’s flexible and can grow as we add more categories, and indicates that the onboarding will be quick and get out of the way quickly.

When we user tested it, we initially required a minimum of 3 topics and had no way to skip the process, but quickly saw user trying to dismiss it and move on after 1-2, so we added a “Skip” button and a grabber at the top to dismiss the modal.

Final Onboarding

2 Wins

1. People want the app

After showing the app and designs to people during our demo day, people really resonated with the problem with and were excited by our solution. People have been asking non-stop when they can download it.

2. The podcast player

While the news feed required an aesthetic tradeoff to make it more usable, the podcast feed ended up really pure. There’s almost no fat and it feels familiar and delightful while still meeting the unique queue and image requirements.

2 Improvements

1. Make it more fun

While Brief does improve on other news apps in terms of brevity and visual clutter, I’m not certain we achieved the goal of being “fun”. I’d love to add more moments of delight and more visual design throughout the app to encourage a positive experience.

2. Improve edge cases

Longer publication titles can run into longer category tags due to their placement, and parts of the interface are dependent on titles being two lines tall, which limits future flexibility.

2 Takeaways

1. User testing rocks

Brief was one of the first times I committed to user testing before, during, and after the design process and it really is a cheat code. Users can make many of the hard design decisions significantly easier by just observing and learning how they expect the design to work, and making changes accordingly. Asking the right questions is the hard part.

2. Make objectives clear upfront

We established the design objectives midway through. Once we did, making decisions and clearing conflicts became way easier. Going forward, I’ll always set them in advance.