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.
Early design explorations looked at graphing and layout alternatives, and helped us decide to split format and color into separate workstreams.
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
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.
Taking the idea further, physical separation of each data type column provided additional clarity as to key metrics association.
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.
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.
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.
Initial color options from the brand guidelines provide warm (red) and coolor color palettes that didn’t provide the the level of diversification needed
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.
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.
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.
Deuteranopia is a type of red-green color blindness characterized by the inability to distinguish red and green pigments.
Achromatopsia is characterized by difficulty perceiving color.
Grayscale version helps us identify contrast and separation between sequential monochromatic values.
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.
YOU MIGHT BE CURIOUS ABOUT THESE PROJECTS
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
