Scalable and Customisable Data Visualisations

Scalable and Customisable Data Visualisations

Scalable Data Visualisations in Reports

Scalable and Customisable Data Visualisations

The brief

We improved the customisation options for Anaplan dashboards and data visualisations, making it easier for users to make informed decisions based on their data. Our aim was to enhance the data visualisation set-up experience and provide users with a more customisable and scalable solution. We conducted user research, assessed customer feedback, and explored new options to surface key customisation settings.

The brief

We improved the customisation options for Anaplan dashboards and data visualisations, making it easier for users to make informed decisions based on their data. Our aim was to enhance the data visualisation set-up experience and provide users with a more customisable and scalable solution. We conducted user research, assessed customer feedback, and explored new options to surface key customisation settings.

The brief

We improved the customisation options for Anaplan dashboards and data visualisations, making it easier for users to make informed decisions based on their data. Our aim was to enhance the data visualisation set-up experience and provide users with a more customisable and scalable solution. We conducted user research, assessed customer feedback, and explored new options to surface key customisation settings.

The brief

We improved the customisation options for Anaplan dashboards and data visualisations, making it easier for users to make informed decisions based on their data. Our aim was to enhance the data visualisation set-up experience and provide users with a more customisable and scalable solution. We conducted user research, assessed customer feedback, and explored new options to surface key customisation settings.

Problem Statement

The data visualisation control panel was not scalable for up-coming new features. Users found some key options were difficult to find, and were under-utilised as they were hidden in multiple panels and within dropdowns.


Limited customisation options, eg selecting brand colours and styled graph line types were paint points for users. We aimed to improve the experience by adding new scaleable options, and a develop a set of pre-built and custom palettes.

Benefits

Anaplan dashboards give users quick insights into their data through data visualisations. These pages can be customised with filters, enabling users to slice and dice their data as needed. Dashboards need to be readily customisable to display large amounts of data. They also need to be consistent as they sync across dashboards, reports and data tables.


Solution

I explored new options to surface these key settings and keep the panel scaleable for future features.


We assessed customer feedback and conducted user research regarding the customisation settings.


I also designed a set of new custom palette options, and a flow for users to build their own palettes for data visualisation

Research and Use Cases

We carried out user testing and gathered internal feedback to gain perspectives on the proposal of more granular options and colour theming options. A research plan was established and set against our internal persona. We then gathered feedback from usability testing with clients using the existing features, such as JPMorgan, Virgin and Unilever.

Would this be valuable? Use cases:

  • Colours can carry connotations, especially in financial planning. Multiple users avoid using reds in palettes to avoid negative interpretations of data.

  • Clients eg. Unliever and Virgin wanted to use their brand blue / red palettes to unify their reports

  • Users wanted a colour palette that could be linked to specific data, and have a custom palettes to quickly populate their charts.

  • Charts should be accessible. In one client interview, the CEO noted they couldn't tell the difference between a palette that had a similar red/green toned swatch.

  • Clients such as Aviva wanted charts that carried conditional formatting eg. increment being red, decrements in green.

What do you want to improve? Findings:

  • Users valued the more customisable line types, eg. dotted for prior years and a solid line for a current year forecast.

  • Being able to quickly change the chart type was valuable to users who repetitively complete this action.

  • Users wanted to see a visual indication of what had been customised and what was default behaviour.

  • Users did not know about some features that were hidden at the bottom of a scrollable dropdown.

  • Users did not like copying and pasting hex codes, and used external workarounds. They wanted a central area to access these internally.

Scope and wireframes

We established a set of new priority features based on feedback that enabled granular series level customisations, and surfaced previously overlooked options.


I designed wireframes to assess the potential area for these controls. We were technically limited to keep these in the right hand panel, which had a fixed width. I explored a few options that would ensure space for future features and still make use of our internal design system components.

Key improvements

  • Easier access to chart type selection

  • Ability to control individual series at a granular level

  • Additional chart editing options for line types, marker shapes and more

  • Ability to hide information and change font sizes to get more information on a report page.

Custom colours

Colour plays a vital role in data visualisation as it can make or break the effectiveness of a chart or graph.


Our product had previously contained controls to manage colours, but this was not available in the new experience. Introducing new colour palettes revived this much requested feature. (press 'see before' button to see old interface)


I conducted extensive assessments of existing colours, user needs, accessibility considerations and existing data visualisation colour use cases. We landed on 5 custom palettes that would enhance the data visualisation experience.

Colour palette preview:

Often, charts only have a few series so the first three colours in a palette are crucial. I designed the palettes with this in mind - explore the options here:

Custom Palette Management

End to end Custom Palette flow

I designed concepts for an end-end flow for users to add a custom palette, which would then be referenced elsewhere in the product.

I went through design iterations with product management and the wider design team, then validated concepts through testing with internal users.

User feedback

  • "So glad we can use our color themes instead of manually adding hex codes"

  • "Thanks for the resolution on this! This was a very annoying issue and I am glad I don’t have to explain to users how to make charts slightly bigger or smaller to get rid of their markers anymore."

Low fidelity ideation

I explored interaction and layout options in wireframes. These wireframes were presented to internal stakeholders for feedback and iterated further before high fi designs and engineer handover.

High fidelity design

© 2023 Sophie Powell-Hall

© 2023 Sophie Powell-Hall

© 2023 Sophie Powell-Hall

© 2023 Sophie Powell-Hall