By Matt Douglas, Kristen Dudish, Elena Gianni, Kellen Henry, Melissa Loder and Dan Sherman

For many of our readers, the New York Times desktop home page is an important and familiar place to connect with the news each day.

It hasn’t changed much over the last decade, even as the story formats we use, the platforms we support and the ways our readers consume content online have rapidly evolved.

The home page in August 2008 and August 2018

We’ve invested heavily in making our mobile apps expressive and visually dynamic, but our desktop website has lagged behind, powered by a siloed and aging set of tools.

These fractures in workflow and technology have meant our newsroom editors and our engineering teams had to do duplicate work across multiple systems for our mobile apps and our desktop website.

They weren’t the only ones. Whenever readers switched between devices, they were met with different reading experiences, which made it hard for them to follow their interests and gave them an inconsistent experience with our brand.

In a few weeks, we will update our desktop home page experience as a final step to bringing readers a consistent experience across all of our platforms and screens. Readers who visit us on mobile have already seen many of the changes. But with the desktop rollout, readers will be able to engage with the stories that interest them most on all of the devices they read The New York Times.

Connecting with Readers

We started our home page project with plenty of data about what people chose to do there, but it was more difficult to tell from the numbers why they made those decisions.

As a product and design team, we always want to go beyond what readers say they like and dislike to understand how reading, watching or listening to our stories fits into their lives.

We realized that in order to help our readers go deeper, our team had to engage deeply with our readers. We visited them at their homes and got to know them. Then we asked them broad questions about how the the news fits into their day — or doesn’t.

“How do you start your day?” “What helps you stay up to speed on current events?” “How do you decide what to read?”

We came away from those interviews with a better understanding of three major needs our readers wanted to fulfill on our home page:

First, they wanted to catch up on the latest news and find out what they might have missed.

on the latest news and find out what they might have missed. Second, they wanted to deepen their understanding of major events through analysis and opinion articles.

of major events through analysis and opinion articles. Lastly, they wanted to discover something unexpected from our wide variety of stories and sections.

We also came away with a strategy for how to help our readers meet those needs.

Readers said they wanted us to curate their experience on the home page, but not limit it. We needed a system that empowered them to follow their own interests. At the same time, readers wanted our help to navigate a chaotic world of information overload and filter bubbles.

We used those insights to begin sketching out possible ways to address reader needs that also mapped clearly to our mission and goals.

Prototypes and Partnerships

While we design layouts and custom-made typography with care, we also know what truly makes or breaks the reading experience is the content itself. Our readers told us loud and clear: what matters is access to New York Times journalism.

To test our initial concepts, we needed to see how they would hold up with real news flowing through them. So we created a series of prototypes to gather feedback from a small panel of readers.

Our first round of prototypes were pretty crude. We built them quickly, with the intention of testing our assumptions and threw most of them away after gathering data. We started out with simple paper prototypes. (Our favorite was a cardboard and paper iPhone we nicknamed “The pPhone.”)

The more prototypes we built, the more confidence we gained. We knew we probably weren’t going to get everything right the first time (spoiler: we didn’t). But we also knew how much we could learn when we got things wrong.

Once we gained confidence through paper prototyping, we moved on to a higher-fidelity web prototype and recruited a few news editors to run it using some bare-bones publishing tools.

While our readers helped articulate the original needs that inspired our designs, our prototype editors were instrumental in stress-testing our concepts. They gave us feedback on how well the stories they wanted to highlight fit into our proposed structure and helped us calibrate what areas of the page needed to be elevated or suppressed.

Prototyping with our editors

Having editors join the conversation early on helped us quickly understand what was working and what might be missing. The editors were also candid with us about standard newsroom practices and internal dynamics that we needed to consider. The first time a major story broke, we learned that our system and tools would need maximum flexibility to support a wide variety of news scenarios.

Throughout this design process, many members of our product, design and engineering teams also volunteered to curate the home page for a day to gain first-hand experience of what the home page workflow was like under the constant pressure of breaking news. Embedding directly with our news editors showed that we were committed to making our home page work for them and gave us plenty of empathy for what it takes to produce the home page every day.

By working closely together, we developed a version of the home page that was polished enough for wider distribution. To prepare for a larger-scale rollout to a subset of readers, we worked with our internal tools teams to build more realistic tools that let the newsroom curate the new version of the home page.

Learning and Iterating

While we always planned to launch a fully responsive home page, our early tests left us most confident in our new features at the mobile breakpoint. We solidified and rolled out our changes to all mobile readers in October of last year.

Creating the right layouts to scale our newsroom curation efforts up to more complex desktop and tablet layouts took our team another cycle of iteration. With mobile fully live, we launched our initial desktop concepts to a small percentage of readers, and studied metrics and qualitative survey feedback closely, while making adjustments.

Wireframes show how we adjusted different sections of the page in response to feedback

Early in our desktop test, we focused on showing readers the breadth of our coverage. We limited the number of prominent stories at the top of the page and used layouts that highlighted more of our photography. The page layout was airy and encouraged readers to scroll more.

But readers pushed back. While they didn’t want to be overwhelmed, they were eager to see more related news stories in order to get a complete picture of the day’s news.

The ratio of photography to information also felt off. In a news cycle where much of our major news came from Washington D.C., the photos of politicians in suits soon felt repetitive and stale from day to day.

In order to give readers a more nuanced picture of the news and editors the flexibility to choose which visual and text elements to highlight, we developed a system of tools and layouts that let editors group a few related stories into a “story package.”

Story package editor

Creating a system for packages that would work across every device and support all of the possible grouping combinations was a complex design and development task, but it ultimately gave us more flexibility to create strong presentations for every news situation.

It also helped the page look more dynamic for readers because there was more depth and density at the top of the page.

Small sampling of the many story package layouts

We also added visual differentiation between hard news stories and softer features to help readers quickly distinguish between types of content. This provided a better visual rhythm on desktop where stories are frequently displayed side by side.

Our New Experience

Our home page update is a significant step forward in helping our readers meet their needs across all of their devices. Our investments in a new technical architecture will make the site faster for readers and more flexible for our teams. We are confident that the system of story groups and packages we’ve created will allow us to continue evolving the experience in ways we can’t even imagine today. We’ve created a system that’s rooted in highlighting both what our readers feel is important to read and what they want to read. Best of all, it can grow and adapt as those needs do, too.