analytics-table-design

name	analytics-table-design
description	Use when designing or refining experiment result tables, metric registries, diagnostics tables, or other analytics-heavy views inside ExperimentationPlatform. Focuses on dense, legible table systems, inline statistical visualization, sticky operational context, and comparison-first layouts for experimentation workflows.

Analytics Table Design

Use this skill for table-heavy frontend work in ExperimentationPlatform, especially:

• experiment results tables
• experiment registry tables
• metric and event catalog tables
• SRM and diagnostics tables
• comparison views with variants, lift, confidence intervals, and p-values

Primary Objective

Make tables feel like the product, not like a fallback after cards.

Table Principles

• Prefer tables when users compare many rows or many variants.
• Keep headers explicit and operational.
• Use compact spacing, but never at the expense of scanability.
• Make the first column descriptive and stable.
• Keep statistical columns aligned and easy to compare across rows.
• Use sticky headers when the table becomes long enough to need them.

Column Design

• Put the entity label first: experiment, metric, event, dimension value.
• Put directly comparable values next.
• Put interpretation columns after raw values: relative lift, confidence interval, p-value, adjusted p-value, flags.
• Put destructive or secondary actions last.
• Avoid mixing raw values and actions in the same column.

Statistical Presentation

• Show confidence intervals inline where the decision is being made.
• Use compact horizontal interval bars instead of large detached charts.
• When multiple comparisons exist, stack them cleanly inside the cell rather than forcing navigation away from the table.
• Always label what a comparison is against.
• If multiple testing correction is applied, say so in plain language directly beneath the table.

Visual Design

• Use low-contrast separators and restrained borders.
• Avoid zebra stripes unless the table is genuinely hard to scan without them.
• Use accent color to highlight significance, state, or active selection only.
• Use muted text for metadata and stronger text for the primary row identity.
• Keep cells square-edged and consistent with the main app shell.

Row Behavior

• Inline row editing should be lightweight: icon button, compact popover, short form, save and cancel.
• Row actions should not dominate the row.
• Removal actions should remain visually secondary unless destructive confirmation is needed.

Empty And Loading States

• Empty states should be brief and operational.
• Prefer text guidance over illustrations.
• Loading text should describe what data is being refreshed.

Avoid

• Turning analytical tables into card grids
• Hiding important statistical context behind tooltips only
• Overloading one cell with too many visual encodings
• Decorative visuals that compete with numeric comparison
• Action-heavy columns before the analysis columns

Invocation

Use this skill explicitly with:

Use /Users/anasfarah/Documents/ExperimentationPlatform/skills/analytics-table-design/SKILL.md

Use it alongside the repo’s frontend design skill when polishing experiment and analytics views.