The document provides a gap analysis of various news websites. It analyzes the pros and cons of each site's design and layout. The analysis found that sites like Google and BBC have clean, customizable layouts but could improve pathways to related content. Sites like Flipboard and Pulse use images well but lack detail. The analysis suggests news aggregators could learn from components of Google, Bloomberg and Netflix to create a more user-centered design.

1. Gap Analysis
Published September 19, 2011
Created by Kimberly Callery

2. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
UX Value Proposition
Key Business Objectives Assessment Current Sites UX Activites
Current State Future State
Simplify Access to Information • User Survey
Simplify Web Navigation • Persona development
Make things consistent • Mood Board
Base navigation on user needs • User Ecology
Improve Look & Feel • Sketches
Simplify the process of users relating to the • Competitors
information • Event Map
Make it easier to see recommendations • Topic Maps
Give more paths for understanding • User paths
Give more paths to go in depth • Storyboards
Simplify the paths for users to find facts • Experience Maps
Give quick data points • Gap Analysis
Integrate social media when it relates to the subject • Paper Prototypes (multiple cycles)
Streamline viewing multiple news sources • Usability Testing (multiple cycles)
Simplify the process of comparing events • Working Prototype (multiple cycles)
Simplify finding related events • Wireframes
Simplify finding related historic events • Flowcharts
Encourage return usage
Simplify the process of information intake
Make meaningful interactions for users
Encourage social involvement
Streamline the presentation of personal opinion and
facts
Poor Average Excellent

3. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Many current news sites are still designing sites with a Pros Cons
long page length assuming users will scroll. • This allows users to scan content • Users get fatigued with scrolling.
quickly to find something they • With this much content users
like or want to know. begin to ignore the sidebar
• Users expect this kind of layout content.
from news sites. • This layout is still based on
traditional newspaper structure.

4. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
BBC tries to keep its design consistent for all versions. Pros Cons
Recently, they turned all of their content into “widgets” to be able to • Many users find this to be a • The recent redeisgn is getting
organize the page content based on the target audience needs. number one source. mixed reviews of showing the
• Column design allows for source as authoritative.
customized layout. • Users do not notice the
• Ads do not mess with the overall subnavigation.
layout too much. • The use of color on the right
version, cancels eachother out.
BBC

5. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Site Pros Cons
Yahoo • Scannable information • The blue blends with the black
• Blue used to bring emphasis to type.
areas • Alot of information not in one area.
• Ads are not in the main row
DIGG • Allows users to determine what • No visual interpretation of the
content is most important information.
• Ads are not mixed with the • All content is aggregrated by users.
headlines
Huffington Post • Image of the top story is the main • Not enough content on the
focus. homepage.
• Has some social features that allow • Uses too many styles for the
users to get involved typography to attract attention.
Frontline • A nice mix of colors in a layout. • The ad is taking up a good
• Featured articles are easy to dig amount of real estate on the
into to read more. homepage.
• Users tend to scan for keywords
and these are not easily accessible.

6. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Fox News keeps within a column layout, while Pros Cons
revealing images and content. • The layout is well balanced. • Not much hierarchy in the type.
• The sidebar on the articles • Ads compete with finding
encourage furthers exploration content on the homepage.
of the content.
Fox News

7. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Newsvine and paper.li both let the users determine the Pros Cons
sources and layout. • Users are able to determine what • Not encouraged to dig deeper
is important. into the articles.
• Users can share their viewpoint • Many steps to the full article.
easily. • Requires time to always update
• Able to view other articles the layout.
quickly.
Newsvine & paper.li

8. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
KYOO Channels is an aggregation of social threads. Pros Cons
• Clean layout with strong use of • Authoritative resources are not
visuals and typography. distinguished from the others.
• Allows users the ability to • Articles are not the main focus.
customize RSS Feeds. • All black layout makes traditional
• Small amounts of news, in a news articles difficult to show
digestable format. and read.
KYOO Channels

9. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
MSNBC uses the long scroll layout however reveals the Pros Cons
categories as the user goes through. • Categories are easy to scan. • Categories with content are not
• Multiple pathways into the revealed without scrolling.
content. • Layout is not consistent causing
the user to jump around too
much.
• Hard to find content.
MSNBC

10. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
CBC News provides a focus on top stories. Pros Cons
• Clean layout with a focus on • Ads are larger than the main
white space. content.
• Grid layout of three main • Not enough content on the
columns can be found homepage.
throughout.
• “Extra” pathways through more
related content is encouraged.
CBC News

11. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
USAToday created a special interactive visualization for Pros Cons
a tribute to 9-11. • Quick, visual, and easy to use • The visualization is lost when it
interface. switches to content.
• Targeted information to allow • The circle does not really tie to
the user to focus on one type of the event.
topic. • This visualization does not tie
• Easy to flip to the next article. to more options on the event
or encourage more in depth
research.
USAToday

12. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Newspaper Map allows the user a visual way to locate Pros Cons
news sources by location. • Showing sources by location. • Not clear on what sources are
• Ability to see multiple sources. where.
• Allows users to dig into new • The user must know the source
sources. before finding information.
• Very processor intensive.
Newspaper Map

13. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
New York Times redesigns are looking to organize news Pros Cons
in a manner that allows users a cleaner and clearer • Good amount of information on • Not enough content on the
experience. each article. homepage.
• Using images for every article. • Not a clear method for switching
• Scrolling is not a main feature. categories.
• No pathways to other related
information are revealed.
New York Times

14. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Flipboard, Pulse, and theFLUD are all image based Pros Cons
aggregation of the news. • Using images to draw users in. • Images are not enough
• Reveals some data on rollover. information.
• Content types are an organizing • The layouts differ too much from
feature. one screen to the next.
• Doesn’t allow the users to look at
multiple sources at once.
Flipboard, Pulse, theFLUD

15. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Spectra is a visualization of news. It allows users to Pros Cons
customize the categories of news and then put in 3d. • Visual and easy to customize • Too many clicks to the full article.
interface. • Hard to browse articles.
It allows users to customize the categories that are shown and then
puts them into a virtual 3d circle. When one is selected the information • Clean interface without ads. • The interface does not meet
is revealed in a colored box in the center. Then it is clicked to go to the • Color applied in a categorical the everyday use of reading the
snippet from the source. Then the user clicks to read the whole article. manner. news quickly.
MSNBC

16. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Hitpad aggragates information in channels. Pros Cons
• The channels are an easy to view • Type is handled differently
layout. throughout the layout.
• It is easy to see trending topics. • Not enough information on the
• Search and logo are in the first article for the user to click.
location users look. • The trending does not tie to a
category.
Hitpad

17. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
NewsApp is a visualization of information. Pros Cons
The amount of popularity of the article is visualized by the size of the • Lots of information conveyed • Hard for users to see the value
rectangle holding the article title. The colors represent the category of quickly. quickly.
information. • Allows for quick searching by • The size is not understood
location and categories. because how the popularity is
• The rollover provides the determined is not revealed.
necessary data for a user to click. • The selection of location and
categories are far apart in the
interface.
NewsApp

18. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
News360 is an aggregation of news. Pros Cons
The site shows categories of news articles and reveals the different • Clean and intuitive interface. • It could provide more methods
sources that can be viewed. • Allowing one topic to be shown to dig into the content the user is
by multiple sources. interested in.
• Not using or allowing ads to • Could make it clearer which
clutter the space. items are from which source. ie
images.
news360

19. Gap Analysis
published September 19, 2011 by Kimberly Callery
Gap Analysis
Google, Bloomberg, and Netflix have great Pros Cons
components to apply to one layout to make a more • Google’s features are easy to • Google’s features are not always
user centered news aggregation site. understand. revealed to the everyday user.
Google gives simple ways to customize the layout. Google trends also • Bloomberg can tie charts and • Bloomberg lets the data be more
lends itself to showing users more information they may be interested in. date together for users. important than the connection.
Bloomberg visualizes data in manners that allow more users to relate to • Netflix shows information easily • Netflix lets items overlap and
the information. to the user. impede the user interface.
Netflix simplifies how users access items within categories.
Google, Bloomberg, Netflix