Visual Hierarchy
Eye-tracking research on dashboards (Yang et al., 2025) shows users scan in a Z-pattern starting from the upper-left, with large numbers capturing early attention. Place your primary KPI top-left at 2–3× the font size of secondary metrics — size contrast, not position alone, drives where the eye goes first.
Space Allocation
Give the most important element the most space. Size signals importance — a KPI displayed at 2–3× the scale of surrounding metrics communicates priority instantly. Avoid "democratic layouts" where every metric gets equal space, equal font size, and equal visual weight. There is no magic ratio; allocate space proportional to decision-making value.
Managing Complexity
Visual hierarchy matters more than element count. Fifteen metrics with clear grouping, size contrast, and progressive disclosure will outperform six metrics in a flat grid where everything gets equal weight. Organization is the variable — not the number. When a single view loses clarity, split into tabs or drill-down layers based on workflow, not a number threshold.
Best for → Executive scorecards, weekly reviews
KPIs top-left where the eye lands first, primary chart center, details below. Size contrast between the KPI row and supporting elements creates clear hierarchy. The default choice when you don't have a reason to pick something else.
Filters: Date Range | Segment | Region
Primary Visualization
Best for → Multi-page apps, operational hubs
Persistent left nav for switching between views. Maximizes horizontal chart space. Standard in Databricks SQL Dashboards and modern BI platforms. Feels like an application, not a report.
Best for → Data storytelling, board presentations
Alternating wide-narrow sections guide the eye in a Z-pattern. Each row tells a chapter of the story. Works well when you need to walk someone through a narrative, not just show metrics.
Hero Metric + Delta
Trend Line
Primary: Wide Chart
Breakdown
Detail Table
Supporting Chart
Best for → Multi-domain data, role-based views
Horizontal tabs split content by domain (Supply, Demand, Finance) or role (Planner, Manager, VP). Each tab is a focused dashboard. Prevents overloading a single view past the 5–7 KPI limit.
Overview
Supply
Demand
Finance
Global Filters
KPI Summary
Trend
Comparison
Detail Table
Tab-Specific Filters
Best for → Real-time ops, NOC screens, daily standups
Dense grid of KPI cards with embedded sparklines. Designed for glanceability — every metric visible without scrolling. Use RAG color coding (red/amber/green) to surface exceptions instantly.
Auto-Refresh: 5 min | Region: All
Fill Rate
OTIF %
Backorders
Past Due
WOS
Excess $
Turns
Forecast Bias
Sparkline
Sparkline
Sparkline
Sparkline
Best for → Investigation, root cause analysis, planners
Summary metrics on top, interactive chart in the middle, detail table at the bottom. Clicking a chart element filters the table below. The workhorse layout for supply chain planners who need to go from signal to SKU.
Summary KPIs
Filters + Search
Interactive Chart (click to filter table ↓)
Detail Table (filtered by chart selection)
Context Panel