7 UX Techniques to Improve Fund Data Display

“User experience” has become more than just a buzzword, it is now a foundation stone of good web design and usability. I remember when website creation was all about accessibility – making web pages available for those with poor eyesight, using high contrast colours, and creating pages logically that could be read aloud by screen readers. Interestingly, many of those tenants still apply today, but taken to another level. Usability refers to user-centric design. It simply means that a website has been designed and developed around the user’s behaviour.

Financial websites have a notorious history with bad usability, but in their defence, they often contain more complex information than most and so require and extra layer of thought when designed and structured with UX in mind.

We’ve looked at the ways some asset managers use ‘micro UX’ in their websites. Now, let’s take a look at how investment websites have employed some clever design techniques to improve user experience specifically around their display of fund data.

1. Fixed header

7 UX Techniques to Improve Fund Data Display 1
Tabular data for funds can be overwhelming, cluttered and downright ugly on screen. Goldman Sachs have employed a simple trick to improve the UX by fixing the table header, so as the user scrolls down, they still know what data belongs to which column.

2. ‘Fund grid’ with display filters

7 UX Techniques to Improve Fund Data Display 2
Neuberger Berman have used a cool technique to allow the user to filter on their UCITS fund range. I don’t think this method would work for a large range of funds, but for this amount it works really nicely – allowing a user to quickly see just equity, fixed income or alternative funds in an easy to read format.

3. Dynamic search & compare

7 UX Techniques to Improve Fund Data Display 3
Although the design of this Fidelity site looks very dated, there’s no argument about how useful the search and compare feature for funds is. With over 11,000 funds available in their database, a good search tool is critical. The ability to filter on those search results with parameters like ratings, returns and expenses enables a user see how many results they will get.

4. Typeahead search for funds

7 UX Techniques to Improve Fund Data Display 4
We’re all used to using Google’s typeahead search, hard to imagine not having it now in fact. The J.P. Morgan Asset Management site uses a superfast typeahead search to display their funds as your type.

5. Responsive Design

7 UX Techniques to Improve Fund Data Display 5
We all know that responsive design improves UX. Taking the extra step to make all of the elements on a page responsive, including tabular data, enabling charts touch, making sure text is legible and so on. The Hermes Investment Management site has been made fully responsive on all pages.

6. On-page “switches”

7 UX Techniques to Improve Fund Data Display 6
Franklin Templeton recently updated their site launching well-designed, responsive fund pages. Some nice features include ‘switches’ that toggle things like annual return figures with or without sales charges.

7. Zoom-able charts

7 UX Techniques to Improve Fund Data Display 7
Fund charts can sometimes be hard to read so the ability to zoom into data is really useful. Janus have employed some modern interactive chart libraries – some that allow the user to zoom into the data.

It’s encouraging to see asset managers using modern web techniques to improve the user experience for investors and advisors. If you’ve seen some cool techniques on an investment management website recently we’d love to hear about it.

Sign up to our newsletter

Don't miss out on industry news and thought pieces.