iPad Interfaces of News Apps

Reading news on the iPad is becoming a popular use-case for the device. Some apps connect you to twitter and facebook so you can also follow ‘social’ news. The interaction works for all apps works in a fairly similar way (tap on preview to show detail; top left button to get back). The interesting part are their interfaces, which seem to follow two patterns. But before looking into that, lets break down a news item into bare essentials.

A news item consists of

* Picture/Video Screenshot
* Headline
* Text (Intro and detailed)
For me, all three should be shown for scanning articles effectively. Two types of interfaces are used to show news-

1 Scrolling Squares

iPad News Apps Interface

Some notable examples are-

  • BBC News- The best in this league. 50/50 space is allocated to preview/detail. The news categories are scrollable rows. More categories can be seen by scrolling vertically. One cannot add new categories while in portrait mode.
  • npr- designed by bottle rocket. Same concept as the BBC except news details appear only when u tap on a square.
  • Pulse- This news app was showcased by Steve Jobs while unveiling the iPad. Maybe its because the scrolling squares with pictures look so cool.. But after using it a while, its nothing out of the ordinary. To me, it looks exactly like npr which doubles up as a visual RSS reader.
  • FLUD– The latest RSS reader to join the scrolling squares. I couldn’t find anything novel about this one too.

iPad News Apps

2 The Fluid Grid
I guess this interface type is difficult to develop and doesn’t blow you away with great looks. No wonder I don’t see many apps like this. But the fluid grid is much better than the other because of several functional reasons.
  • It Emphasizes importance of articles by size
  • Newspaper look- layout is different for each page, but based on a grid structure
  • All three news essentials are shown
  • Seamless adaptation in portrait and landscape modes
iPad News App Interface
Some best examples of this type:
  • Flipboard- is the best interface for browsing news- mainsteam and social. The categories page is similar to Time magazine app, and copies NYtimes look in inside pages. It adds a discussion column on the right for viewing comments of the article.
  • NYTimes (editor’s choice)- The interface look very much like the app they released for Adobe Air (which IMHO is the most brilliant app EVER!). The news aligns itself beautifully in anyway you hold the device. There are no pop-ups or layer on layer of content- just news. Not to forget elegant ad placing too!
  • Huffington Post- This app has nice navigation for news categories.
iPad News Apps
Magazine Interfaces
I also looked at some magazine interfaces to see how they display news.
  • TIME- once you are used to the interface, its a joy to use and read. The only downer for me was that it doesn’t remember the last state of the last article you read. Khoi Vinh doesnt like the interaction. designed and developed by  woodwing.com, thewonderfactory.com
  • WIRED- I really found this one to be overhyped. Its got the same layout as the print magazine (lots of white space). Its more smart than simple.
Summary:
  1. Most of the hyped news apps borrow interfaces from big brand news apps.
  2. NYTimes, Time Magazine and Flipboard have the best news apps for the iPad.
  3. Fluid grid works better than the scrolling square.
  4. We need to come up with better ways of browsing news content.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s