📋 What was this drill?

Drill: 8 states: one table component, all 8 states (loading skeleton, empty, error, partial, filtered-empty, sorted, selected, overflow). Each state must be correct.

Interpretation: Re-drilled the 8-states pattern on a fresh component type: an ML experiment tracking table (Weights & Biases / MLflow style) with run name, model, dataset, loss, accuracy, status, duration, GPU. Each state gets a domain-specific framing (filtered-empty = no failed runs above 95% acc, overflow = 8 metric columns exceed viewport). Light lab-notebook theme, Inter + JetBrains Mono, one indigo accent + 4 status hues each paired with a distinct shape for colorblind redundancy.

experiment-tracker / runs

Experiment Runs

One component, eight states. Each state must read correctly from its shape alone — before you read a word of text.

project: vision-finetune / workspace: lab-meridian / updated 2m ago
01 · Loading skeleton previews eventual cell widths
RunModelLossAccStatusDur
fetching runs from tracker · 4 of 51 streamed
02 · Empty what / why / next
RunModelLossAccStatusDur

No experiments yet

When you launch a training run, it appears here with live metrics, logs, and artifacts.

Start a run ⌘R
03 · Error technical detail + human reassurance + retry
RunModelLossAccStatusDur

Couldn't reach the tracking server

The metrics backend didn't respond in time. Your queued and running jobs are unaffected — only the dashboard view failed to load.

req_8f3a2b9c · trace 5f01e2d4
04 · Partial loaded rows + dashed seam + streaming remainder
RunModelLossAccStatusDur
amber-sunset-42resnet500.184294.12%done2h 14m
violet-mist-07vit-base0.210393.40%done3h 02m
olive-cove-19convnext0.167794.88%running1h 38m
streaming 47 more runs · last sync 4s ago
05 · Filtered-empty active chips + positive framing + clear-all
status: failed × acc > 95% ×
RunModelLossAccStatusDur

No runs match these filters

No failed run broke 95% accuracy — which is exactly what you want. Loosen a filter to widen the search.

Clear all filters
06 · Sorted tracked-caps header + active arrow + first-row tint
RunModel Loss Acc StatusDur
olive-cove-19convnext0.167794.88%running1h 38m
amber-sunset-42resnet500.184294.12%done2h 14m
slate-fjord-88deit-small0.199193.85%done1h 51m
violet-mist-07vit-base0.210393.40%done3h 02m
07 · Selected accent tint + 3px left rail (two signals)
RunModelLossAccStatusDur
amber-sunset-42resnet500.184294.12%done2h 14m
olive-cove-19convnext0.167794.88%running1h 38m
slate-fjord-88deit-small0.199193.85%done1h 51m
violet-mist-07vit-base0.210393.40%done3h 02m
08 · Overflow warn footer + fade — columns exceed viewport
RunModelDatasetLossAccStatusDurGPU
amber-sunset-42resnet50cifar-100.184294.12%done2h 14mA100
olive-cove-19convnextimagenet0.167794.88%running1h 38mA100
violet-mist-07vit-baseimagenet0.210393.40%done3h 02mV100
3 of 8 columns visible · 11 more metric columns → scroll →

Set in Inter & JetBrains Mono. Body 14/21. One indigo accent, four data-semantic status hues (each paired with a distinct shape). No gridlines — depth from hairline rules and tint. Each state below reads from its shape before its words.