Screen_Recording_2023-03-30_at_3_19_17_PM_AdobeExpress.gif

Design systems is one of my favourite things to work on because it’s all about logics and (surprise!) systems. It’s human to make mistakes that design systems helps mitigate. While I was at Crux, I handled all design work that was on visualisations and that included the tooltips. That’s when I knew there was more work at hand. Especially on the consistency of the tooltips

What are tooltips used for?

Tooltips at Crux have two purposes

  1. Give more information on the KPI
  2. Be able to click on that number to further analyse it

Now, being able to click on a number was not available yet and I worked on it which also called for the revamp of tooltips

Architecture

These components are constructed from context through out. As in where is it used and based on where it’s used the visualizations look different and so do their tooltips

In answer and boards

Untitled

In nudges

Untitled

In auto analysis

Untitled

Construction of each component

Continuing on the context themes. I’m going to talk more about the components and their variations in each context. Before that I want to talk about master components. We used for master components for constructing all these components because one day eventually we’ll change padding, rounding or whatever it is. We don’t want to sit around selecting all these components one by one. You can just use the master component to make the changes everywhere.

The history