Part Numbers — Deep Dive · Shopfloor Assist

Context

Existing component, growing requirements.

The base display of the part-number tile came from the existing system. Which part numbers appear on the monitor is set by the parametriser in the configuration dialog. On the handheld (PDA), a simplified text display is enough; in the configuration dialog, the part number is just one field among the position variants – the design challenge sat entirely on the monitor.

V1Part number

V2+ Slot & slot color

V3+ alternate fitting

V4+ color code

V5+ extended length

V1
Part number
Starting point: just the number itself.
V2
+ Slot & slot color
Slot number added to the part number. An optional slot color as a background fill behind the slot number – colored text alone wouldn’t be recognizable from a distance on the shop floor.
V3
+ Alternate fitting
During a supplier changeover, old and new parts sit on the line at the same time. Both part numbers are shown, separated by a vertical divider. The worker uses up the old parts first and then switches – seeing both, they can decide for themselves.
V4
+ Color-code variant
An additional four-character color code per part number, shown with a heavily rounded outline – deliberately distinct from the divider introduced in V3.
V5
+ Extended length
Edge cases with up to four extra characters. They have to fit the allotted space without breaking the tile grid.

Anonymized reconstruction: slots are letters in the original, shown here as a number. Numbers, color codes, slot color and typeface fictional or replaced and scaled down.

Design Challenge

More variants, same footprint.

The tile sits in a fixed grid on a shop-floor monitor during live operation – no scrolling, legible from 1–3 m. With every new stage, more had to fit onto one tile.

Challenge 1

All variants combined

Slot, slot color, alternate fitting, color code and extended length can all apply to a single part number at once.

Challenge 2

Every combination at every size

The same combinations have to work across every tile size – the smaller the tile, the bigger the space problem.

Challenge 3

Clearly distinguishable

Normal number, extended length, color code and alternate fitting each need their own visual device – at a glance and from a distance.

The space problem, made visible

Excerpts from the UI: what happens when new attributes run into the existing tiles without adjustment.

Small tile: slot, prefix, number and color code overlapping — **Overlap / overflow**Slot number, prefix and number push over each other – or overflow. The content doesn’t fit the frame.

Medium tile with alternate fitting and color code: second number and color code run off the tile to the right and bottom — **Overlap / overflow**Slot number, prefix and number push over each other – or overflow. The content doesn’t fit the frame.

Tile with slot and color code: color-code frame with no spacing to the number or tile edge — **Missing spacing**The color-code frame sits flush against the number and tile edge and pokes out at the bottom.

Smallest tile with color code: no room for the extra characters of an extended length — **Extended length can’t be shown**The smallest tile has no room for the extra characters – the extended length can’t be displayed.

Exploration: alternate fitting

How does the second number differ from the first – and from a color code?

Exploration ASecond number below, subtle divider

Exploration BSecond number outlined

Exploration CSecond number inverted

ShippedSide by side, vertical divider, shared prefix

Alternative design · finer base grid

A 12×6 grid instead of 6×4: a part number occupying 1×1 in the coarse grid corresponds to 3×2 in the finer one. Overflow can then be corrected by a single grid unit instead of doubling the whole tile straight away – saving space, since no double size is needed.

Simple part number

2×2 · with slot

2×2 · without slot

Alternate / color code

3×2 · alternate

3×2 · color code

5×3 · alternate

5×3 · color code

Extended length + alternate / color code

4×2 · alternate

4×2 · color code

6×4 · alternate

6×4 · color code

Extended length

5×2

6×3

Pro

Overflow by +1 grid unit instead of doubling the whole tile
Finer granularity, less wasted space

Con

Technically demanding
Requires a full rework of the layout algorithm for every tile

Solution & outcome

A rule set instead of a one-off solution.

Final exploration: four rules

Every attribute gets exactly one visual device – so all types stay distinguishable even when combined.

Outline = color codeHeavily rounded frame, subtle cut

Divider = alternateBoth numbers side by side, shared prefix

Extended length on topPrefix wraps in the upper area

… or abbreviatedLetter indicator instead of the full prefix

Size matrix: every type, every tile size.

For every combination of tile size and part-number type, it’s defined how it looks. Whatever wouldn’t be legible at a given size doesn’t get a special variant – it scales up to the next tile size instead. Of originally four sizes, three remained.

Normal

Alternate

Color code

Extended length

Combo

S2×2

→ size M

only without slot

→ size M

M4×2

L6×4

Anonymized reconstruction of the spec. Grid units width × height. Numbers, slot and slot color fictional; typeface replaced.

Final design decision

Adjust font sizes instead of rebuilding the grid.

Content is fitted into the existing tiles through further-adjusted font sizes. The deliberate trade-off: text size – and with it, some legibility – gives way in favor of the system. The alternative would have been an expensive refactor of the grid, and with it the entire logic of the layout algorithm.

GainedNo changes to grid or algorithm · consistent design · few variants

PaidSmaller type in dense combinations · partly reduced legibility from a distance

How the decision was implemented

Guiding principle: as few variants as possible, one consistent design throughout.

Decision 1

Font sizes per tile and combination

The last four digits stay the large check block, with the rest of the number small above it. Font sizes were reduced further per size and combination, with the remaining number set on two lines where needed. On the smallest tile with a slot, the prefix shrinks to a superscript letter.

Decision 2

Trim what isn’t checked

Parts of the part number that aren’t relevant for the check on the line are dropped – the worker sees and reads the decisive part at a glance. Identical prefixes, for example with alternate fitting, appear only once.

Decision 3

“Can’t be shown” means: next size up

Combinations that wouldn’t be legible at a given tile size aren’t forced into their own special layouts – they scale up to the next size instead. Of four tile sizes, three remained: the largest was cut again – next to the monitor’s other content, there was practically never room for it.

Decision 4

No new grid – for now

A finer grid would have enabled the best display, but would have required a complete rework of the layout algorithm for every tile. That effort wasn’t available within the project’s scope. The grid question is documented; a briefing or workshop on the algorithm is planned for the further course of the project.

Takeaway

Not the theoretically perfect solution, but the best one within the given constraints: smaller type over a rebuild of the grid and algorithm. That kept the part-number tile in a consistent visual language across five stages – one visual device per attribute, few variants, and no changes to the existing grid. The cost, partly reduced legibility in dense combinations, was accepted deliberately. The underlying grid question wasn’t sidestepped but documented and prepared for a later revision.