TimesLive 2.0 The New News Framework

Huey Lewis stopped performing when he got too popular.

The river of news flows constantly and some reader’s skim and some like to go in-depth. The challenge is designing for these two main scenarios.

The two most important pages are your home and article pages. Goals must be prioritized and priorities must be tasked. How do they support each other?

The main problem User Experience should solve is bridging business metrics with user needs, you must ask is it a user decision or a stakeholder / political decision?

TimesLive 1.0 vs TimesLive 2.0

From the beginning of the TimesLive design, I worked with the journalists. We familiarised ourselves with the various content areas, and asked editors to rank their importance. This yields a content hierarchy. The conclusion to this was putting the multimedia at the bottom of the page and moving up most read. Most read lists are usually top  10 but you get better engagement from a Top 5 list. A most popular section was added to take you to the top 10.

Site wide metrics only works on the homepage, it’s good to gauge the ecosystem on arrival. Then after entry (lets say an article page) it all becomes section specific, the previous  TimesLive site did not have a granular approach to data.

The Menu 

Mega Menus are good dynamic content used in a contextual way.

Much has been written about the evil of mega menus, many UXers hate them. There is good and bad in everything. I decided to go with one here because it increased the skimming strategy and engagement i wanted for this site, this way you can peek into the section pages of the site and see if any of the content is relevant and not wasting time.

The picture giveth and text taketh away

Breaking news (green),  Important news (red)

Separation of breaking and important news is a good strategy as most news does get lost in the flurry of the news cycle.

Most news sites use a lot lists, these are difficult to read if too long, the pictures need to break up the content and give the reader a break from headline after headline. It’s simpler to read at a glance, if more detail is needed the lists are there for that. The overarching strategy I used for this was  “the picture giveth and text taketh away” as a rule for attention span. But heavy use of pictures is also off-putting; there must always be balance in a push-pull system.

Redesigns are never to be taken lightly and should be undertaken only if you definitively beat the old design. Your post launch analytics will either prove your success or failure.


Increased time on site by 17.6% and decreased bounce rate by 12%, average page views went up by 10.6%

Just look at the click maps

Click Map for old version

You can see here there is not much going on in terms of stickiness.

Click Map for the redesign

Who turned on the lights?


Jan Jursa or iATV tweeted a link to this article.

14. June 2011 by Vlad Nedelcu
Categories: Case Studies, Editorial Design, UX | Tags: , , , , | Leave a comment

Leave a Reply

%d bloggers like this: