New York Times website home page redesign

Authors: 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 get a chunk of their daily news.

It hasn t changed significantly over the past decade, even though the story formats we use, the platforms we support, and the way readers consume content online have evolved rapidly.

We ve invested heavily to make our mobile apps expressive and visually dynamic, but the desktop version of our site lags behind because it has an isolated and outdated set of tools.

These disruptions in workflow and technology meant that our news editors and developers had to duplicate their work across multiple systems for mobile apps and desktop versions of the site.

But they weren t the only ones who suffered. Whenever readers switched between devices, they encountered different reading experiences, which made it difficult for them to follow their interests and gave them an inconsistent experience with our brand.

In a few weeks, we will be updating the desktop home page as a final step towards providing readers with a consistent experience across all platforms and screens. Readers who read our site on a mobile phone have already seen many changes. But with the update of the desktop version of the site, readers will be able to get acquainted with the stories of the New York Times of interest to them on all devices.

Connecting with readers

We started the project of the new home page by analyzing a large amount of data about what people choose on it, but by the numbers it was more difficult to understand why they made these decisions.

As designers, we always want to go beyond what readers 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 immerse themselves in reading the material, our team must work closely with them. We visited some of our readers and got to know them. We then asked them general questions about how the news fits in or out of their day.

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

We now have an understanding of three basic needs that our readers wanted to satisfy by consuming content on our home page:

• First, they wanted get the latest news and find out what they might have missed.
• Second, they wanted deepen your understanding major events through analysis of articles and opinions.
• Finally, they wanted discover something unexpected in our variety of stories and sections.

We ve also developed a strategy to help our readers meet these needs.

Readers said they wanted us to recommend content on the homepage without limiting their experience. We needed a system that would allow them to pursue their own interests. At the same time, the readers wanted us to help navigate the chaotic world of information overloads and filter bubbles.

We used these ideas to sketch out possible ways to meet the needs of readers, which also clearly align with our mission and goals.

Prototypes and partnerships

While we carefully design layouts and our own typography, we also know what really helps or hinders the reading of the content itself. Our readers told us loud and clear: Access to New York Times journalism is important.

To test our initial concepts, we needed to understand how they would hold up to real news. Therefore, we created a series of prototypes to collect feedback from a small group of readers.

Our first round of prototypes was pretty crude. We quickly made them to test our assumptions and discarded most of them after collecting the data. We started with simple paper prototypes. (Our favorite was the cardboard and paper iPhone, which we nicknamed “The pPhone”).

The more prototypes we built, the more confidence we gained. We knew that most likely the first time, we will not be able to do everything right (spoiler: it did not work). But we also knew we would learn a lot from our mistakes.

Once we gained confidence in paper prototyping, we moved on to a more highly accurate web prototype and brought in a few news editors to run it with primitive publishing tools.

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

Engaging editors early on helped us quickly understand what was working and what might be missing. The editors also frankly shared with us the standard editorial practices and dynamics that we needed to consider. We learned that our system and tools will need maximum flexibility to support a wide range of news scenarios.

Throughout the design process, many members of the product design and development teams also volunteered to curate the homepage for a day to gain first-hand insight into the homepage workflow under constant pressure from the latest news. Working side-by-side with news editors has shown that we are committed to making the home page as user-friendly as possible, and has given us an understanding of what it means to edit a home page on a daily basis.

Working closely together, we have developed a version of the home page that has been honed for wider distribution. To prepare for a wider release to our readers, we worked with the internal tooling teams to create more realistic tools that would allow the newsroom to edit the new version of the home page.

conclusions and holding iterations

While we always planned to launch a fully responsive homepage, our early tests convinced us to focus on new features for the mobile version. We introduced the changes for mobile platforms last October.

Creating the right layouts to scale our news recommendation efforts to more complex desktop and tablet layouts took another iteration from our team. We presented the initial concepts for the desktop version of the site to a small percentage of readers and carefully studied the metrics and quality reviews, and then made adjustments.

At the beginning of the desktop test, we focused on showing readers the breadth of our reach. We limited the number of top stories at the top of the page and used layouts that made more photos stand out. The page layout was airy and encouraged readers to scroll more.

But readers began to disagree. While they didn t want to be overwhelmed by the information flow, they were keen to see more related news stories to get a complete picture of the day s events.

The ratio of photography to information was also not impressive. In the news cycle, where most of our major news stories came from Washington, DC, photographs of politicians in suits soon began to recur and become outdated day after day.

To provide readers with a more detailed picture of the news, flexibly choosing which visual and textual elements to highlight, we have developed a system of tools and layouts that allow editors to group multiple related stories into a “story package”.

Building a package system that worked on every device and supported all possible combinations of content grouping was a design and development challenge, but ultimately gave us more flexibility in creating robust presentations for any news situation.

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

We ve also added a visual distinction between violent news and softer stories to help readers quickly distinguish between types of content. This provided a better visual rhythm for the desktop version of the site, where stories are often displayed side by side.

Our new experience

Updating our home page is a significant step forward in helping our readers meet their needs across all devices. Our investment 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 have created will allow us to continue to develop this experience in the future. We have created a system based on what our readers believe importantand the fact that they want to read. Moreover, it can grow and adapt according to these needs.

The following took part in the development of the new home page:

Matt Douglas and Melissa Loder product team leaders.
Kristen Dudish and Elena Gianni heads of the design department.
Kellen Henry head of the news editorial department.
Dan Sherman head of technical department…