NYer_HeroNYer_Hero

The New Yorker

UI Design
Prototyping

Cheryl Chan
Shilp Vashinav
Azat Bay
Armina Foroughi

Readers have shifted to digital.

It’s no secret that the print industry has been undergoing a profound change in the past few years. Audiences now live in a digital-first, mobile-first world and The New Yorker has been slow to adapt to changing demands. People love the smart commentary interspersed with sharp humour the journal is known for but can this compete in the digital space where attention spans are getting shorter?

After looking at the market, we didn’t follow the model of clickbait titles and sensationalized stories. Our goal is to engage existing and new audiences to drive subscription sales, but without losing any of the journalistic integrity of the brand. We wanted to build a product that:

1. Makes it easy to find a great story
2. Felt personal and deliberate
3. Leverages the cultural capital of The New Yorker

We started by working in Design Sprints proposing different ideas. Some involved breaking off sections of newyorker.com and turning that into a discrete product, others involved various ways of delivering content like publishing one article a day.

explorations.jpgexplorations.jpg

Early ideas I mocked up ranged from reading, machine vision to news apps.

Discovery is key

We know The New Yorker makes great content but so much of it is buried and hard to find. Content should come to the reader and this becomes crucial as the company expands into new media. We want to guide readers in a more engaging way and expose them to much more of the New Yorker’s portfolio of products. 

There's so much New Yorker content that it can be intimidating for new readers.

Making the user's journey less about searching for content but more about enjoying it. 

The human touch

Many products try to suggest what articles you might like, but lack the touch of an editor to bring stories together in a compelling way. There's a reason why podcasts like This American Life are so popular; storytelling becomes much more meaningful when there's a person speaking to you. The New Yorker has already been leveraging this by featuring columnists on video where their personality and knowledge really shine. 

The best of The New Yorker served in an interactive digest curated by editors you know and love.

Designing a flexible platform

Our idea of using video to ease people into reading had no direct competitor and so had to define its own space in the market. To do this, I used Sketch and Flinto to rapidly explore new interaction models. 

The interface does not lean on standard iOS elements so it was very important that new interactions were intuitive. The video shows an animation transitioning from the home screen to the content screen. The cards slide in from the right to imply interactivity on the x-axis. 

In this flow a user can flip through stories, read one in more detail and take action on it. The animations are designed to convey a sense of depth and that content is being layered on top on another. An example flow can be hearing about an event in the city, then reading a review of it and finally adding it to your calendar with a tap. 

One of the major challenges was to create a flexible system that could accommodate any kind of media. I addressed this by designing the UI around cards which were:

1. Fast and easy to scan through stories.
2. Adaptable to nearly any kind of content.
3. Scalable across different screen sizes and devices.

While the app is optimized for text, video, podcast cards, it can expand beyond what we currently support. I designed a series of interface guidelines to maintain consistency but also allow for the possibility of opening up the platform for third-party integrations.

cards_overview.jpgcards_overview.jpg

The story doesn't end here

We set out to revitalize growth for The New Yorker by leveraging their cultural capital in order to create the best storytelling experience on mobile. I’m really proud what my team has done, but with more time here's what I'd work on. 

Make creation easier

We only focused on the reader, but to really live up to the principle of “the best stories” it's critical to consider the people that create content. I'd love to work on back-end analytics tools to help writers understand their audience better.  I like working on 'un-sexy' tools because those areas can ultimately result in the most impact down the line. 

Validate assumptions

Due to the constraints of time, we were unable to perform comprehensive user testing to validate our design assumptions. Besides gathering insights on usability, I'd be interested finding out which areas of the app people found most valuable and would allocate energy on making those parts better.

Empower by critique

I have a deep respect for ideas and believe that nothing should be left on the cutting room floor. This project helped me understand the importance of creating an environment where ideas flourish, instead of holding thoughts back in fear of being shot down. I feel like the measure of coming out of a successful critique is simply asking yourself: “Do I feel motivated?”. 

James Wang © 2018