— Goals > People > Feedback > Action

What specific UX workshop or ideation services do you need?

Need a proposal with a timeline for your future roadmap?

Get in touch

How I approached designing a wealth management dashboard for the world’s biggest wealth manager

Understanding best practices and defining design principles. [SITUATION]

Within a strictly regulated wealth management environment my client uses dashboards on other applications every day. As the world’s largest wealth manager, it has a complete commitment to digital banking and to streamlining efficiencies to what was rapidly becoming the hero application within a suite of financial products.

Benefiting wealthy individuals to exclusive online services like advice, quotes and investment strategies via a web and iPad interface, this application empowers both the Customer Consultant Associates* and Customer Consultant* (CCA’s/CC’s), the two principal user groups. Assembling these precious customer meetings takes time, accessing strictly private data to provide a complete, competitive and professional service requires a tailored and specialised tool – of which the Customer Meeting App* is the bank’s primary channel.

What are the driving factors for developing a dashboard?

There are persuasive qualities to building a dashboard from a UX perspective. Both as a one-stop-shop to provide a quick-view of the necessities needed to facilitate a meeting and in this case, funded by a user-flow improvement as functionality was improved. But it is important to factor down, and focused on 3 ‘must-haves’ for our dashboard:

1. Single point of access for disparate data
   Instead of opening various applications, interfaces, or online databases, the CCA’s/CC’s have a real-time dashboard.
2. Broad overview with drill down capabilities
   A dashboard is a dynamic collection of account numbers, text, and graphical elements — and this combination is both vertical as well as horizontal. Calendars and photos within meetings can be immediately accessed right there from the dashboard.
3. Easier, faster, sign source of truth
   An information dashboard takes the best of several worlds — numbers, statues, text information, meeting status colours and ‘Edit’ functionality throughout — and places them intelligently for quick consumption.

Real world requirement gathering

Users do drive requirements, but in business there is another controlling factor; funding. A driving factor from a stakeholder perspective was for UX to re-imagine the Customer Meeting web experience as they were not appropriately integrated – especially from the ‘Create a Customer Meeting’ perspective and more particularly ‘Adding account numbers’. There was, crucially, funding to do this.

Define your objectives and align the Stakeholders

<insert Discovery – 3reasons.jpg>

What are the dashboard design best practices?

Defining generic design principles (other than the obvious – Gestalt, breaking long processes into short tasks, avoiding scroll bars, etc) are applied to the UI, without being too restrictive. There are 3 dashboard design principles that are drove decisions;:

1. Provide relevant info in about 5 sec
   Funding was a principal driver for this project. Empowering a more intuitive process to adding customer data (account numbers, quote links, investment profile links, and upcoming future services) at a glance was key to the baseline UX.
2. Display information in a logical layout
   The inverted triangle displays the most significant insights on the top, trends in the middle, and granular details towards the bottom.
3. Build the brand and ensure the Design System is achievable
   Championing UX paradigms that correctly affect the organisation’s values, and balancing developers time (=cost) to negotiate relatively new global guidelines is a challenge. Positioning the applications front-of-stage requires they are consistent – but with no UX stakeholder this is a difficult task.

02 How to approach the design process [TASK]

My design process;

1. Step 1 – Start with the user needs
   What is the user trying to achieve? In this case streamlining the preparation of a meeting, and principally future proofing the ‘Create a Meeting’ process with a scalable UI to accommodate multiple repositories.
2. Step 2 – Segment the experience in to ‘zones’
   Operating within a tired system in order to offer a hierarchical ‘best practice’ solution, the on-screen real estate delivers out a quick look experience prioritising from top to bottom.
3. Step 3 – Test and Challenge through Prototyping
   Visualising what could be up to 12 users’ journeys, with all their variables was proving both confusing and difficult to manage. The customer needed clarification, the perfect opportunity for prototyping. Developers also need reassurance that this would be a boxed development. It did not impact other working code.

Driving Discovery UX within a challenging Agile environment

The full experience serves up the existing meeting concept of a quick-look dashboard where the user is able to rapidly analyse the status of any meetings. Immediate ‘glance-access’ to tier one information including the customer name and ID, their account numbers and the date/time of the.

Taking user needs, compartmentalising them in zones is an effective way of building your UI. Within the third tier is the meeting specific detail zone, with for instance Privacy Setting, customer ID photos, and eventually Mode of Contact.

03 Sketching; The first line of attack to crack a design problem [ACTION]

A Prioritise, Elaborate and Tailored Experience

Focusing on what is in scope, these initial sketches start to show the power of a dashboard. Pushing the hierarchical arrangement, the user’s eyes organically concentrate from top to bottom, left to right. We have the data, so embracing the Meeting Name and grouping the Last Modified through to the meeting owner data is logical. Expanding on the ‘Mini’ concept, this ‘Maxi’ Dashboard version offers the full experience. Enabling the CCA’s/CC’s to very quickly assess the detailed status of a meeting.

04 Realising a final solution [RESULT]

A full suite of functionality, all there front-of-stall for the user

The final solution was a triumph. It both solved the scalability problem providing easy access to account numbers, the ability to add other account numbers, visibility on the meeting date and time, the meeting status and who is the meeting organiser, all there front-of-stall for the user. Complete transparency on meeting detail, including location, meeting language and whether the meeting has typed notes and freehand notes plus special features including packaging the meeting contents ready to send the customer and associating the meeting with a customer ID.

An additional full suite of functionality displayed within the new dashboard with improved readability through the use of white space and with a scale to future-proof 2020 growth

One key factor in the development (and acceptance) of this new radical design was ‘achievability’. Funding is a key developmental constraint with financial services, without it a project will not leave the ground – designing with business realities is a key skill UX professionals need to be aware of. 

Providing more detail using a hierarchical system

And the results speak for themselves

The bank is present in more than 40 countries with approximately half of their 190 offices are in western Europe where half of the Customer Meeting App meetings are delivered on the iPad. This is a phenomenal growth from 8% to 56% worldwide in the last 1.5 years. This equates to approximately 100,000 meetings prepared and delivered via the application in this year.

— russellwebb.co.uk – UX Designer

Get in touch

This is but part of a selec­tion of design articles Spindlelegs gen­er­ated for the creative community out there.

Please con­tact us fur­ther to dis­cuss if your brand really wants to ben­e­fit from this new immer­sive expe­ri­ence here: [email protected] If something has peaked your interest. Please leave a comment below.

Get in touch