KPI scorecard
Six numbers, six targets, one card. Every measure takes a row: a bar for where it stands, a marker for the target it is judged against, and the track behind it shaded into poor, acceptable and good, so a row means something before anyone reads the scale. The gap is written out beside each row and colored by the direction you actually want, so a cap like scrap rate reads the right way round. Sort by whatever is furthest behind and the trouble comes to the top.
Who it’s for
Anyone who has to answer “are we where we should be?” about several numbers at once. A plant manager in a morning meeting with OEE, scrap, uptime and energy on one screen, a service provider showing a customer every number in the contract, a team lead who wants the measure that slipped to be the first thing anybody sees. Each of those numbers already has a card somewhere; what nobody has is the one place that says which of them is short.
What it does
A line running a shift: OEE 71% against a target of 80, first pass yield 96% against 97, uptime 99.4% against 99, scrap 1.8% against a cap of 2. Four different scales, four different directions, one card — and because every target sits in the same column, the row that stops short is obvious before anyone reads a number.
- Lines every target up in one vertical rule, which is what makes measures on different scales readable against each other. A bar reaching past the marker is good news whatever the units are.
- Knows which way is good. A cap such as scrap rate or energy use is better when it is lower, so its bands and its verdict read the other way round.
- Writes the gap out in words — 11% below target — and colors it by that direction, so nobody has to work out whether red is bad this time.
- Shades the track behind each bar into poor, acceptable and good, measured against each row’s own target, so one setting covers every measure on the card.
- Puts trouble at the top on request: sorted furthest behind first, the card reorders itself as the shift goes on.
- Fills the card it is given. The rows grow with the height, and once they are as large as they should get, the space left over goes between them rather than under them.
- Scores one number per key against one target. It does not chart how that number got there, so a measure that needs its history belongs next to this card rather than in it.
How to set up
Data keys
Add one key per measure — from one device or from several, in any mix of units. Each key becomes a row, and each row is judged on its own: its own target, its own direction, its own scale.
- Any numeric key —
TimeseriesorAttribute. The row’s number comes from the time window, taken the way Value says. - A key with no readings in the window — that row is left out rather than drawn empty.
- No keys at all — the card shows No readings in this period.
Each key carries three settings of its own:
- Target — empty by default. A number, or the name of a key that carries it, which is how a nameplate rating or a target stored as an attribute gets in. Without one the row still draws a bar on a round scale, with no marker and no verdict — useful, but not yet scored.
- Direction — Higher is better by default. Switch it to Lower is better for anything that is a cap: scrap, downtime, cost, energy.
- Bar scale — empty by default, which puts the target at the same place on every row. Set it to pin a row to a scale of its own, such as 0 to 100.
Rows
- Value — Latest by default. How each row takes its number from the window: Total for things that accumulate, Average for rates, Lowest and Highest for the worst and best moments of the period.
How to customize
- To put the worst measure first — set Row order to Furthest behind first, from As the keys are configured. Rows with no target keep to the end.
- To show only the reading, or only the gap — set Numbers, The reading and the gap by default.
- To read the gap as a difference rather than a share — set Gap format to Difference, from Share of target. Counts read better that way.
- To turn the quality shading off — turn off Bands, on by default.
- To move where poor ends and good starts — edit Band limits, 70, 100 by default, as a percent of target.
- To match the card to your dashboard — set Bar color, which the bands take their shade from, and Ahead color and Behind color for the gap text.
- To keep the text at a fixed size — turn off Scale to fit, on by default.
Tips
- Targets are per key, so the same key on twenty devices can be scored against twenty different numbers by pointing Target at an attribute each device carries.
- Leave Bar scale empty unless a row really needs its own scale. Lining the targets up is most of what makes the card readable.
- A percentage that should never pass 100 is the one case where setting the scale to 100 reads better than lining it up with the rest.
- Keep it to about six rows. Past that the card becomes a table, and a table is better at being a table.
- Set Value to Total and the window to a shift, and the card reports the shift rather than the moment it was opened.
Share Your Widget with the Community
Built a custom widget? Export it as a JSON from ThingsBoard and publish it to the IoT Hub through a simple 4-step wizard (Upload, Listing, Readme, Review & Submit). Share it with thousands of ThingsBoard developers worldwide and get featured in the catalog.