This week, I was paired up with Yifan from class and we were tasked with comparing several apps within the same vertical. The vertical we chose was news, with a specific focus on which news apps provide the most effective and and delightful user experience. The apps that we short-listed to look at for this exercise are Circa, Zite, Yahoo News and The New York Times. I have provided an analysis for Yahoo News and Zite below, but check out Yifan’s analysis of Circa and The New York Time on his blog!
Yahoo creating a News app to service the light, on-the-go news reader. It’s a dead simple app that pushes 10 stories to you twice a day, and each of the articles are summarized to give users a quick snapshot of each major story. I typically only read specialized periodicals and it’s really nice to be able to quick get a top line view of current events for the day. However, if you’re looking for a robust news service with full length articles, Yahoo News may not be for you.
From the design and user experience perspective, I feel like the Yahoo News team knocked it out of the park. It’s aesthetically beautiful and each design decision was crafted with the persona of the on-the-go news reader in mind. Here’s a little break down of some of my favorite features.
top stories sync for offline reading
Consistent with the use cases surrounding the on-the-go reader, many people look to catch up on current events during their commute. That’s why when Yahoo notifies you that your morning or evening digest is ready, it actually syncs the 10 stories to the app so you can read them even if you’re on the subway with no connection. It’s such a simple thing but it’s an example of molding a product’s experience to peoples’ existing behaviors and not trying to change them. I believe it’s these small sorts of considerations for the user that makes them loyal and encourages user retention.
Minimal UI that stays out of the way
The beauty of this app is that it does one very specific thing and does it well. There aren’t 15 different features that detract from the primary use case, which is reading the top stories. The lack of excessive navigation choices is refreshing. The only interface element beyond the actual stories is the menu icon on the top right. Clicking that menu icon brings you to the screen I provided above which tells you when you’re next digest will be available and allows you to reference previous digests. Once the user starts scrolling down, the menu icon disappears and removes all distractions from the actual reading experience. The menu will only reappear if you start scrolling back up. A lot of apps and sites use this method to only present the navigation on the initial load and then when the user scrolls back up but I think it’s very effective, particularly in this case. This same logic is used with the back button on the individual story screen. The screens below show the main menu icon disappearing on the top stories screen disappearing and the back button disappearing on the individual story screen.
Simple but effective queues
You can quickly see which stories you’ve read by seeing whether the number is colored in or not. Each category has a unique color so after a while you can quickly get context on each story and what sector it covers. Also at the end of the top 10 stories, there’s a nice visualization of what stories you’ve read and which ones you haven’t.
Content presentation for each article
Yahoo News summarizes the main ideas of each article to allow the user to quickly take in the story. Beyond explaining the main points, it includes helpful details like quotes from key people in the article, related videos, related tweets and Wikipedia snippets to explain some of the bigger concepts in the article. This really helps round out the user’s understanding of the article and provide greater context. While I think they did a good job at presenting all this content within the article feed, I have a slight issue with one thing on this screen. I think the share button gets lost in between the article summary and the related videos. Since it’s a news app, and people share news all the time on social platforms, I think they should place the share button in a more prominent place at the top of the article.
As we know, when you can introduce surprise into an experience, it forms a deeper emotional connection with the user. There are three little details that I found particularly pleasant. Firstly, if you want to read more after you’re done reading the top 10 stories, you can continue scrolling down and an icon will appear in a parallax manner with some language that says, “I can’t get enough” or “I’m a news junkie”. If you continue to scroll down as the icon moves up, eventually the content from the previous digest will load and you can continue reading. The second detail is the animation that brings up the social icons when you click on the share button. It adds a unique interaction to the Yahoo experience and helps the app stand out. And lastly, I just noticed for the first time that when you receive the digest in the morning, the background for the top stories is white, and when you receive it in the evening, the background is dark. It’s a very subtle thing that I appreciated.
Zite is a well know news aggregator that serves users with stories based on their interests. It does not summarize the articles like Yahoo News does and allows users to personalize the content they receive on a much greater level. The app Circa, which Yifan analyzed is somewhat of a combination between Yahoo News and Zite. (As a side note, Yifan and I decided that Circa was our favorite for exactly that reason and for some really clever UX decisions they made). However, I will investigate a couple of things I like about Zite and some things that I think are potential pitfalls.
If you are into reading news tied to specific areas or industries, Zite is the app for you. When you get started, it asks you what your interest are and immediately starts serving you relevant news. To go even further, Zite analyzes the articles you read and the articles/publications/topics you favorite to more intelligently serve you content over time. This is great for going very deep within specific areas but sometimes it prevents you from being exposed to bigger stories. They do integrate a “Popular on Zite” cell into the feed, however, I wouldn’t consider those stories a good representation of broader current events. Also, people’s interests fluctuate with time and unfortunately Zite’s algorithm does not adapt as quickly as your interest change. Therefore, you could be tired of reading about entrepreneurship news but you still receive a bunch of stories on that because it was a strong interest of yours at one point. A lot of the points I’m discussing here can be seen in the image above, but I also included two addition screens below that show how you can add additional interests and the popular cell within the news feed that I mentioned.
Two executional details I like and one i dont
Zite helps you cut through the clutter by making all the stories that you’ve read grayscale so that the unread ones pop out more. I find this helpful when I’m thumbing through a lot of stories. Another executional detail I like is the preloader they use. As I mentioned before, little unique details can help make your experience stand out and I think their custom preloader does that. In contrast, one decision they made that really bothers me is the inconsistency in how articles are displayed. Some times they are pulled into the Zite article format, and other times, they pull in third party websites in an iframe like fashion. This creates inconsistency for the user with regards to design and usability.