Pattern Library

A consolidated reference for the design language and technical patterns applied across the Railway Market Intelligence system (Mockups 01–20).

Design Philosophy Spectrum

PHASE 1

Explainability

Why does this data exist? We prioritize provenance over polish. Every chart must explain its source, its limitations, and its update frequency.

PHASE 2

Benchmarking

How do we compare? We apply financial benchmarking patterns (Skytra, IATA) to volatile rail fares to create "synthetic indices" of market health.

PHASE 3

Executive Action

What now? The "5-second rule" dictates that board members should grasp trajectory and anomaly status before reading a single specific price.

Universal Design Rules

Confidence Disclosure Never show a metric without its "freshness" or "sample size" context. Gaps are shown as gaps, not zeros.

Textual Fallbacks Color signaling (Green/Red) must always be accompanied by symbols (↑/↓) or text labels for accessibility.

Data-First Tables Tables use width:auto and white-space:nowrap. We respect the data's volume over mobile-first aesthetics.

Progressive Disclosure Summary KPI → Narrative Explanation → Detailed Grid → Raw Observation. Hide the complexity until requested.

Pattern Catalog

Booking Curve Overlay

Multi-carrier line charts showing price trajectory as departure date approaches. Highlights the "7-day jump."

MOCKUP 02

Traffic-light KPI Borders

Executive cards with heavy left borders in Green/Yellow/Red for instant status recognition.

MOCKUP 01

Narrative Callouts

"The Lead Story" — AI-distilled bullet points that translate data into business English (e.g., "RegioJet is yielding aggressively").

MOCKUP 06

Demand Heatmap Grid

O&D (Origin-Destination) vs. Date matrix using color density to show occupancy levels.

MOCKUP 12

Fare Benchmarking Index

Treating average route prices as a "Stock Index" (100 = Base) to track inflation or carrier strategy shifts.

MOCKUP 20

Advance Purchase Pace

Aviation-style curves showing cumulative booking percentage vs. historical average.

MOCKUP 12

Anomaly Sparklines

Mini-charts embedded in tables that highlight "Spikes" or "Flatlines" needing analyst attention.

MOCKUP 04

Confidence Disclosure (Badge)

Small badges (Low/High Confidence) based on data age and source reliability.

MOCKUP 08

Corridor Relative Comparison

Showing multiple city-pairs on one axis to identify national vs. regional trends.

MOCKUP 03

RegioJet "Ghost" Tracking

Tracking impact of carrier exits by comparing "Last Available" vs "Current Market" fares.

MOCKUP 10

OHLC Fare Candlesticks

Using Open-High-Low-Close patterns to visualize price volatility within a single day.

MOCKUP 15

Willingness-to-Pay (WTP)

Scatter plots showing price elasticity — how much occupancy drops per 10 PLN price hike.

MOCKUP 16

Availability Grid (Binning)

Binning fares into "Cheap/Typical/Expensive" buckets to show market distribution.

MOCKUP 18

Source Provenance Table

Detailed metadata table showing the exact API endpoint, auth method, and last fetch status.

MOCKUP 08

Executive "Horizon" View

90-day forward-looking trend lines to support long-term capacity planning.

MOCKUP 15

Delta-Delta Tracking

Tracking the *change* in the *rate of change* (acceleration) of competitor price hikes.

MOCKUP 04

Route Detail Deep-Dive

Contextual side-panel containing specific train numbers and occupancy snapshots.

MOCKUP 09

Alert Rule Builder

Conditional logic interface ("If Price > X and Occupancy < Y") for automated push alerts.

MOCKUP 14

Drill-Down Explorer

Hierarchical navigation: Country → Corridor → Carrier → Specific Train.

MOCKUP 13

Live "War Room" Operations

Real-time ticker showing current API requests and detected price changes as they happen.

MOCKUP 19

Calendar Fare Heatmap

Classic 7-column calendar view showing the cheapest daily price.

MOCKUP 02

AI Chat Interface

Natural language querying of the underlying 442k+ observations.

MOCKUP 07

Data Coverage Matrix

Grid showing which routes/carriers have gaps in collection (The "Honesty Panel").

MOCKUP 08

Fare Tracker (Table-View)

Dense, searchable table of every train departure and its current price status.

MOCKUP 11

Explanatory Annotations

Floating text bubbles explaining WHY a chart looks the way it does.

MOCKUP 02

Anti-patterns (What we Avoid)

Pie Charts

Human eyes struggle with relative area. We use Bar Charts or Stacked Area charts for distribution.

Values Without Context

"54 PLN" means nothing. Every value must have a Delta (↑/↓) or a Peer Comparison.

Excessive Precision

We don't show "42.1932%". We round for readability. Executive focus is on the integer, not the decimal.

Hidden Limitations

Claiming "100% data coverage" when 2 carriers are missing is a trust-breaker. Gaps are displayed prominently.

Color-Only Signaling

Inaccessible to 8% of men. Signals must use icons (▲/▼) or explicit labels (HIGH/LOW).

Over-smoothed Curves

Hiding volatility is lying. We use 3-day moving averages only when volatility masks a core signal.

Static Snapshots

Data without a timestamp is "Zombie Data." Every card must show its "Age" (e.g., "2h ago").

Misleading Y-Axes

No "truncated" Y-axes that make 5% changes look like 50%. We maintain scale integrity.

Strategic Implementation Guidelines

For the Board (Executive View)

Summary Narrative first: Don't make them find the insight. State it in bold text at the top.
Trajectory over state: Board members care about where we are *going*, not just where we are.
Red-only Alerts: Only interrupt their flow when a metric crosses a historical boundary.
Strategic Context: Always link rail data to external factors (Gas prices, RegioJet exits, Holiday spikes).

For Analysts (Explorer View)

Raw data access: Every chart should be a "gateway" to the CSV or the raw Observation table.
Multi-dimensional filters: Allow cross-filtering by Carrier AND Class AND Advance Purchase days.
Custom Indexing: Let analysts set their own "Base 100" date for benchmarking.
Provenance drilling: Ability to see the exact time of the API call that produced a specific data point.