News12

Lead Product Designer • August 2021 - December 2021

News12 is a local news network that serves New York and the Tri-State area. News12 has a tv channel, a website and native iOS and Android apps.

My Role

I co-owned product strategy, research, wireframing, visual design and prototyping. I worked closely with a product manager, the engineering team, News12 stakeholders and the revenue team to understand the challenges of our current experience and explore possibilities.

MEASURING SUCCESs

Increase pages per session

With engagement being steadily shallow, I wanted to focus on increasing pages viewed per session to reinforce credibility and source of discoverability for users while driving additional ad revenue.

1. User Experience Needs

   An increase in pages per session would indicate that readers are sticking around beyond the article they landed on because they found more relevant content.

2. Business Needs

   Ad impressions are the principle source of revenue for News12. Increasing pages per session would lead to more ad impressions without increasing the number of ads per page - which could be detrimental to the user experience and the credibility of our site.

DISCOVERY

A need to know more

To gain a more wholistic view of why these problems exist, I conducted a survey that intercepted users as they browsed an article page.

Most users expressed that they found what they were looking for on the article page but if they were interested in finding out more about a topic, they would turn to Google or other News sites for further reading.

It appeared that there was curiosity to learn more about a topic, but News12 was not providing a way for users to easily access this information.

STRATEGY

More than what they came for

To better address our users’ need to know more, I set out to transform the user’s browsing experience from a single-paged utilitarian one to one that excites their sense of curiosity, values their time, and customizes recommendations based on their interests.

I set out to:

• Improve discoverability of relevant content to extend a user’s session duration

• Provide users with high level information on an article to help them quickly assess the value of the article and whether they want to read it now or later

• Create a space for users to save articles to read for later

• Introduce a newsletter and push notification experience customized to the user’s interests

METHODOLGY

My guiding principles

While it may be tempting to jump in to prescriptive solutions, I wanted to ensure that I always put the user first. I proposed a set of design principles to guide our strategy while exploring solutions.

Principle #1: What’s good for the customer is good for the business

My humanistic approach to design places the customers first, builds trust and in turn benefits the business as a whole.

Principle #2: Being in the right place at the right time

Recognizing that users arrive at News12 to read a specific article, my goal is to prioritize this need. I want to open doors for users to discover more relevant content at moments when they are most receptive to learning more while avoiding distracting them from their primary need.

EXPLORING SOLUTIONS

Creating pathways to discovery

Over 80% of News12 users are mobile web users. In order to make the greatest impact, I decided to focus first on exploring solutions for the mobile web experience.

Navigation

Like many news websites, News12 has curated category pages on popular topics. However, links to the category pages were buried in the hamburger menu and in the depths of the homepage. A heatmap recording showed that the majority of users who landed on the homepage never scrolled down to the the category sections. Virtually nobody (1.69% of users) opened the hamburger menu.

I hypothesized that if I could improve the discoverability of these category pages, users would be inclined to learn more about topics they were interested in. I created a simple solution by adding horizontal scrolling menu to the global navigation so users could find them from anywhere.

More Stories

News12 users have expressed a genuine interest in learning more about a topic but the current experience didn’t didn’t support this user need. As a result, users expressed that they would turn to Google or other news outlets to find out more.

I wanted to explore adding stories of the same category at the end of an article. If users were reading an article about Coronavirus, a selection of the most recent or popular articles on Coronavirus may encourage rabbit-hole browsing.

To rapidly test this hypothesis, my team conducted a two week long A/B test where we implemented a quick-and-dirty More Stories section below articles in 6 popular categories such as Coronavirus and Power & Politics. We observed an increase in pages per session from 1.32 to 1.38. We were on the right path but I wanted to dig deeper. I wanted to better understand how users interacted with articles and when and how I should introduce relevant content to them so they would gain the most value from it.

TESTING SOLUTIONS

Context is king

To learn more about our users’ browsing behaviors and how they would react to my design explorations, I used UserTesting.com to simulate the experience of arriving on an article page.

I prompted users to browse the article page as if they had arrived from a Facebook link, asked them what they would do next and encouraged feedback for improvement.

Observations

While some users explored the category menu, more users attempted to click on embedded links in the article. Traditionally, News12 embeds links in articles to alternate resources outside of News12.

Many users were cautious about scrolling past the end of the article. I hypothesized that this was because users were under a test situation and didn’t want to look at areas of the website that they didn’t think were part of the test. This is also typically where ads begin, and many users expressed wariness towards accidentally hitting a click-bait ad.

Additional heatmap recordings further validated that viewers typically scanned until the end of a story and would leave the page. It seemed that More Stories would have a difficult chance of being seen if I were to keep it below the article.

Since so many test participants were interested in or attempted to tap embedded links in the article, I hypothesized that I could leverage this learning by strategically embedding related articles in timely sections of the article to improve visibility.

NEXT STEPS

Test, Rinse, Repeat

Embedded vs. at the End

For my next test, I am interested in seeing how well an embedded Related Stories section performs when compared to More Stories at the end of the article.

Recognizing the importance of context, I can leverage data and algorithms to find optimal places to insert related content so as to not distract the user from what they originally came for but still serving their need to learn more.

Z-Layers vs. Seamless browsing

Earlier in my explorations, I created a card design for article units because headlines tended to have a lot of variance in length. By containing them, it was extremely distinguishable where one article ended and another began. The card structure is also highly responsive across screen sizes, lightening the load for our limited engineering resources.

Through testing, I realized that the spacing and shadowing of the cards may have actually been detrimental to the More Stories section. Having distinguishable Z-layers helped articles to be distinct from one another, but created an unnecessary abrupt end to an article that may have actually hindered further scrolling.

In another iteration, I’m interested in comparing how users respond to a More Stories section in a seamless browsing experience where the concept of Z-layers is removed.

Looking Ahead

All up in your DMs

I value my user’s time. In future iterations, I would like to explore the concept of a reading list and following a story. A read time label can help users evaluate if they want commit to reading an article now, or if they’d prefer to save it for later.

With an option to Follow a story, users can get real-time text and email updates on hyper local events happening around them.

A notification center will give users control over topics they want to see more of and how they want to be notified while teaching us about the user’s interests so we can customize our approach at engaging with them.

With an existing framework for a newsletter already in place, it would be a logical next step to focus on the subscription experience to further drive engagement and increase sessions per user.