A monitor showing the Thomson Reuters website

Thomson Reuters

The Process is the Point
Color and Data Visualizations for Thomson
Reuters Strategic Insights

PROJECT OVERVIEW

Thomson Reuters offers a range of data and services to support the legal industry. When they approached us for this project, Strategic Insights was a core application within this suite of tools, providing market intelligence that included financial performance metrics and global market research to law firms. This essential data enabled firms to assess their market position relative to peer groups and the broader legal industry, informing their strategic planning.

Thomson Reuters asked Allovus to work with their team to explore options for their data visual presentation layers in Strategic Insights and explore an updated color palette that would accommodate more robust charting options in the future.

PROVIDING CLARITY THROUGH ORGANIZATION

Within the Analytics area of Strategic Insights, a user could utilize interactive data charts to assess their firm’s brand strength position against those performing the best in the markets that matter to them most.

A limited, overly bright color palette and unclear data presentation made the information hard to read. At first glance, the original chart, as seen here, appeared to provide data for a single topic. Upon deeper examination, this visual was displaying five separate metrics.

Before tackling color options, our team decided to focus on data display and organization.

Tablet showing Key Performance Indicators chart
Sketch

Early design explorations looked at graphing and layout alternatives, and helped us decide to split format and color into separate workstreams.

Sketch

In some cases, displaying too little data was less clear than showing too much; striking a balance, and then labeling data clearly, was crucial.

EXPLORATIONS

Bar chart

Clarification of metric “verticals” was a good place to start. Displaying exact amounts at the top or bottom of each bar provided additional information to the user. Small tweaks like adding weighted separators between categories and integrating labels added clarity.

Bar chart

Taking the idea further, physical separation of each data type column provided additional clarity as to key metrics association.

Bar chart

Providing independent measurement scales to the left of each data type column enabled further customization. Note the category on the far right, “Lawyer Growth,” used a different scale than the others.

Horizontal charts reduced the need for a legend and presented data more efficiently. This was especially helpful as the number of comparisons within a display increased.

Dashboard light version with a chart showing Key Performance Indicators
Dashboard dark version with a chart showing Key Performance Indicators

Dark mode options provide versatility and less visual fatigue for the user.

COLORS IN THE DARK

Once basic patterns for visual displays were approved, we shifted our focus toward color. There were several challenges our client wished us to consider:

  • Thomson Reuters clients felt the existing color palette was too bright. They desired a more “professional” palette so that presentations and findings would have more appeal when shared with decision-makers.
  • The existing palette was limited to five colors; adding additional color choices would allow for more presentation options as complexity increased, but the colors needed to feel cohesive and display well together.
  • The first metric shown in any graph always represented the client, and thus needed to be easily identifiable. In the existing schema, the client’s color was always dark gray, which wasn’t the most appealing choice.
  • Importantly, we needed to think about accessibility, including how updated palettes appear to color-blind users.
Bar chart with various colors

The original color palette within the application

We started with Thomson Reuters brand colors. These colors are very bright and of darker values. Terrific when used as spot colors within their website, but less practical for infographics. We would need to start here and explore variations based on these colors that would provide the wider range needed within data displays.

Color swatches

Initial color options from the brand guidelines provide warm (red) and coolor color palettes that didn’t provide the the level of diversification needed

Charts in various colorways

Templates were created within Figma to quickly explore and compare multiple palettes and color sequences. We also targeted 12 distinct colors for use as Thomson Reuters’ display needs grew.

Dashboard with showing color examples for a bar chart and a pie chart

When considering colors, the sequence was very important as the colors must have clear separation when residing next to one another, especially in a pie chart, for example.

A colored bar chart with example data

Applying updated color options to core displays help us review the palettes in context. Even with fewer colors, the palette is strong and harmonious.

REDUCED COLOR SENSITIVITY

Selected color options were run through color-blind simulations to analyze how distinct the colors appear.

Bar chart, line chart, and pie chart

Deuteranopia is a type of red-green color blindness characterized by the inability to distinguish red and green pigments.

Bar chart, line chart, and pie chart

Achromatopsia is characterized by difficulty perceiving color.

Bar chart, line chart, and pie chart

Grayscale version helps us identify contrast and separation between sequential monochromatic values.

Dashboard showing final color choices for charts
Color swatches

The final color palette template includes sequential colors, line chart example, and contrast ratios.

A DESIGN PROCESS SUCCESS

Collaborating with Thomson Reuters on this project was fantastic. They were extremely open to our thoughts and ideas and appreciative of the process behind our efforts. Design leads from multiple divisions within the company provided input for the color palette exploration as work progressed, giving us vital insight into their thoughts and values.

By breaking apart complex issues and addressing the component elements thoughtfully, our mandate to create clearer data displays with a more professional and versatile color palette was successful. At the end of our engagement, all templates and specifications were provided to the client for integration during upcoming releases.

Thomson Reuters Allovus

YOU MIGHT BE CURIOUS ABOUT THESE PROJECTS

Simplifi by Quicken
My Wellness Product Design
Sharepoint UX Design
Thompson Reuters User Experience Design
Microsoft Illustration
Thomson Reuters User Experience Design
Permission to Start Dreaming
Big Bold Health
Big Bold Health

How can we redesign your world? Reach out to us, and let’s get started.

CONNECT

Allovus

8811 N. Harborview Dr.  |  Suite C  |  Gig Harbor, WA 98332

Get in touch

info@allovus.com

Call us

425.255.6887

LinkedIn Instagram Facebook