If you’ve been tracking what’s been going on at myprosperity HQ, you’ll be aware of the new client wealth portal interface we’ve been developing these past few months.
While the old interface served us well, it was beginning to show its age. We hoped but never fully imagined myprosperity would have as many features or serve as many different kinds of people as it does now. So when it became apparent that we’d outgrown what the old design could offer, we knew we needed a new framework to prepare us for the next generation of features and services.
You served us well, old friend.
To go along with the launch of this new design, we thought it’d be a good idea to explain the reasoning behind some of the changes we’ve made.
The more things change…
The most important thing to us when we set out to redesign the portal was to make sure our existing Partners and clients would not have to re-learn the ins and outs of the client experience.
For this reason, we preserved the structure of the portal. You’re still expanding menus of assets and transactions, but we’ve otherwise reorganised the information on screen so that when you see the portal for the first time, you immediately understand where you should be focusing.
It’s what we call the “squint test”. If you blur an image to the point where the text is no longer readable, you should still be able to make out the information hierarchy: what can I click on? What should I click on? What’s most relevant?
Too many colours, not enough structure. A more focused experience
A good colour scheme takes work
Right off the bat, we knew we needed a new colour palette: the current combination of green, red, blue and orange everywhere made it difficult for any one element to stand out and created too much visual noise.
It was also a requirement that the new colours be as neutral as possible, and contain as few highlight colours as we could manage. Our Partners apply their logo and branding to the wealth portal, so we needed a colour scheme that wouldn’t clash, yet would still communicate what it needed to.
Many colours and shades – reds and greens especially – have clear connotations (green is good, red is bad) and can look blown out on computer monitors. Similarly, we knew we needed a “highlight” shade that would work equally well on dark or light backgrounds.
That’s why, early on, we explored alternatives that didn’t have any red or green. We thought this could be a fresh, new approach but… Things didn’t quite pan out.
The best of a bad bunch.
We did some user testing and realised – not so unexpectedly – that people like red and green for finance: it’s a familiar colour scheme.
So after (quite) a few iterations, we landed on the teal and light burgundy you see today. Softer than other shades of green and red, it’s well suited to a whitelabel context yet retains enough familiarity that people immediately know what each colour means.
Enough green & red to just make sense.
Paving the way for the future
Beyond the colour scheme, the key problem we encountered with the old design was that it wasn’t scaling the way we and our clients needed it to.
Take the shortcuts box, which used to be on the top right. This space was never designed to accommodate more than a couple of links. So much so that when we released the Will Wizard – a feature that allows Partners to offer clients a pre-populated, legally binding will – we had to redesign the two links already in there to fit a third.
You can imagine how that would have played out if we’d just continued adding new shortcuts.
Not exactly a future-proof solution.
The new design moves these quick links to a sidebar – a dedicated space that won’t crumble at the first sight of a new feature release. This sidebar also has an alternate link to the services list, or “ 1 minute financial review”, a very popular feature that helps generate leads for our Partners.
That should hold
Apart from moving things around, the new design is also considerably more svelte. Many of our Partners and clients access the portal via a browser on their iPad, so the new layout has been optimized for a comfortable iPad experience.
Getting stressed about my mortgage – now from the couch!
The most immediately noticeable change in the new style though, is the “highlighted goal” tile on the top right (where the shortcuts used to be).
Goals have become an increasingly big deal for our users, and this is the first of many steps we’re taking to make them a more prominent feature.
As of launch, the interface shows a different active goal every time a client opens the portal. In the future, expect more options around what is shown here (such as favourite goals, etc.).
Hundreds of improvements – big and small – have been made as part of this new look, from clearer labelling and neater icons, to a brand new login page.
The interface has also been designed to better accommodate new clients, starting with the introduction of “skeleton screens” – the industry term for a page without content. What this means is that if a new client visits a section of their portal where no information has been added, they’ll be presented with a friendly guide on how to get started.
Previously, these prompts were lines of texts with hyperlinks at various points throughout the portal, however with this new framework they’ve become much more engaging.
Onwards and upwards
This new design marks the first in a series of many changes we’ll be making to the client portal, so as to make it more engaging than ever before. With the new framework in place, we’re now in a position to tackle some big and exciting features we’ve been working on in the background – more on that soon!
A big shout-out to the Partners and clients who shared their feedback with us as we were going through this process. We wouldn’t have gotten this far without you.
If you have any ideas or feedback you’d like to give about the new style, please get in touch at email@example.com.