Redesign an app interface.
-------------------------
ILLUSTRATOR
FIGMA
SKETCH


Introduction

I downloaded the New York Times app to see how they transferred the news from print to mobile and how they adapted to users reading articles from their phones rather than on paper or on a computer. 

When I first opened the app, I was amazed at the abundance of headlines and sources to look at, but I was also a bit overwhelmed with the amount of information on the screen.As a design opportunity, I re-designed the NYTimes homepage to have more consistent visual guidelines that make it easier for users to maneuver through today’s news.



Research


The NYTimes homepage is one long, vertical scroll with horizontal lines dividing up the sections and articles as you go down. Prioritizing this system does well for previewing several articles at a time.

However, it fails to provide visibility for ALL the articles in today’s news.

With busier lifestyles and shorter attention spans, users won’t have time to scroll through most of these articles, or even see what they are about.

While there is a hierarchy of stories to be shown, users should still have a chance to see the more hidden articles before losing interest and exiting the app.




I developed questions and asked 4 other college students, as casual users of the app, about the efficiency of the homepage:

• How far do you scroll down when checking the app? (relative to the whole page)
        Responses ranged from 1/4 to 1/2 of the page.

• Do you ever read more than the first few headlines?
        Responses were all no; the most was up to 8 headlines.

• Do you check the homepage more than once a day?
        Responses were mixed; if yes, they would check out of boredom/free time.
• Do you think to go back to look at the articles in the bottom half of the page?

        Responses were all no, because the news at the top would refresh or they would only
        skim one more article.




Layout Design

The biggest change I wanted to make was to further minimize the information on the homepage. I developed a ‘Compressed View’ option for the Today tab that removes all the subtext and images while keeping just the headlines for each article. 





Viewing Icon

I wouldn’t want to fully get rid of the original organization of the page, however, since the images and subtext still contribute heavily to a story. To have both choices available to the user, I developed a button to toggle between expanded and compressed view. 

The icon would be placed to the right of the header, so that it is consistent with the other tabs in the app.







With this new button, I was able to make a prototype to show the change for a few articles on the page:







Saved for Later

When users are  browsing the headlines on the Today tab, they might see some articles they want to read later. To make it easier to keep these articles that they would otherwise forget about, I introduced a drag command for the headlines in compressed view that automatically saves the story for later. 






Conclusion

This project challenged me to analyze an app that I never used before, understand its main purpose, and find ways to redesign its features. Using the NYTimes app interested me because there are so many forms in which people take in news. It was productive to learn how a mobile app specifically would influence their amount and quality of news intake.


In trying to keep with the app’s minimal approach for simplicity, my goal for this case study was to add more convenience without too many complications. I appreciate the intuitive interface and scrolling interactions, so I tried to find ways that would address user issues without undermining those aspects.