Dow Jones

Financial News Powerlists

Dow Jones

fn_image_001

Lists are the cornerstone of all things literary. Everybody loves them and we all read them. Not without purpose either as there are plenty of academic and social reasons for their popularity.

As a global leader in newswire communications, Dow Jones have a vast array of distribution mechanisms. Financial News has cemented it’s position as a well respected platform for UK financial news distribution and is no stranger to the editorial of list based news content. They are popular articles and can quite often contribute to the addictive habit of being drawn into a never ending whirlwind of top ten lists.

 

The Psychology of the list

list_phyc_002

People love lists. The world wide web has lists in abundance, some very articulate and interesting and their presence has led to the growth of some very popular websites, such as Buzzfeed. Lists are popular with users for a number of reasons. Their simple methodology promotes an easy to digest mechanism for readers to very quickly absorb interesting, often relatable content.

Poynter makes some very interesting validations around why lists are so popular.

The quick and easy nature of top ten list articles can provide a very popular stream of addictive content, hence why the Financial News Power Lists are so important to get right.

What was the Challenge?

The popularity of FN Powerlists introduced more problems as their popularity grew. As the lists articles increased in number and subject matter, the hierarchy and structure of the interface started to created a significant UX problem. Navigating between entries and between lists became increasingly difficult as the lack of any clear and concise user flow policy created obstacles that were not apparent at the beginning. As users read the lists, so did they want to read more, but finding these lists and leading users from one section to another became a minor labyrinth - especially considering the importance of paywall restrictions.

So this 'redesign' was so much more than a reimagining of the UI, with significant thought invested into a completely new user experience.

We Faced Hurdles

fn_photo_top

One of the biggest hurdles we simply couldn't get around was the lack of any clear, repeatable template. This was a huge challenge when trying to interpret the hierarchy into an identifiable, mapped user-journey.

Some of the lists are repeated annually which should give way to a well defined database structure. But there were subcategories which were bi-annual, or one offs, there were totally unique categories with different ratings criteria and a different number of entries.

fn_photo_middle

There simply wasn't a common theme across all the articles, from Top 40 under 40s, to Top 100 most influential, every category acted in isolation, making any clear and definitive unified, consistent presentation nigh on impossible. There was no common ground based on chronology nor category. We hadn't even taken on the challenge of solving the user experience of the dead-end paywalls that are instigated when a non-subscriber is faced with paid content.

Any 'normal' online application would be comforted by the clarity a series of wireframes and user journey docs can provide. They can often illuminate dead ends, UX faux-pas and expected behavioural issues in advance of completed and finalised designs. But no amount of wireframing gave us the illumination we needed as each iteration introduced a new problem in either navigation or hierarchy.

The Client
The Client

Financial News, the online daily news service and weekly newspaper, is the leading source of information about the investment banking, fund management and securities industries.

Our extensive experience within this sector made understanding their core target demographics relatively easy and we were able to draw from the experience of a multitude of previous projects from within the corporate financial sector.

Eureka moment
Eureka moment

How do you realise your wireframes in a working build without actually building it? It was clear that by v7 of the wireframe documentation, an urgent solution was required. We couldn't commit the designs to the content management system as it is a complex custom solution that would require significant investment to do so.

It wasn't until early 2014 we started to properly experiment with prototyping. We'd played around with a few tools but it wasn't until we started to invest in Marvel App that we discovered the instant benefit of collaborative, live wireframe prototyping, it seemed to be built specifically for this!

It instantly solved every problem we had, giving clients, and their internal development teams, a life-like walkthrough of the hierarchy. Not only did it help us solve problems, it actually illuminated many issues we hadn't foreseen.

Marvel app

marvel_app_icon_002

 

 

Marvel app turns Wireframes and designs into interactive mobile and web prototypes in just a few clicks. A smart new application, Marvelapp allows you to turn static images into interactive prototypes.

Working collaboratively with Marvelapp was a breeze; it takes the resource files directly from Dropbox, and as this was our standard repository for our creative assets, it suited us perfectly.

Marvelapp automatically recognises when you make changes to your designs and updates prototypes in the background, which is very handy indeed.

Take a look for yourself at marvelapp.com.

WHAT WE LEARNED
WHAT WE LEARNED

Iain C Reid, Creative lead

“The complexity of this project came from the scale of the information being presented to the user, and being able to retrospectively apply the design to old data. Prototyping allowed us to understand and overcome the problem.”