Visualizations

Interactive, hand-coded data visualizations — no chart builders, just HTML/CSS/JS + D3.js. Each one is a playable page: hit play, scrub the timeline, hover the data. Best on desktop.

🍺🏒
D3.jsTimeline Synthetic
Columbus After Dark
An NHL season measured in pints — animated craft-beer batches against every Blue Jackets home game. Filter out game nights and the whole chart goes quiet.
Seeded synthetic dataOpen →
🌎
D3.jsMap Real data
Earthquake USA — 125 Years of Shaking
Real USGS catalog, M5.0+, 1900–2024. Building it surfaced a twist: 137 of the "earthquakes" are actually Cold War nuclear tests — kept as a toggleable layer.
USGS public APIOpen →
🍺
D3.jsMap Real + modeled
The Great American Brewery Boom & Bust
151 years of US brewery history on ~5,900 real locations. National totals are real; the year each brewery "appears" on the map is a modeled estimate (disclosed in-app).
Open Brewery DB + Brewers Assoc.Open →
🌪️
D3.jsMap Real data
FEMA Disaster Declarations (2020–2024)
Every US disaster declaration pulled live from FEMA's open API and animated onto a map. Some states never stop flashing.
OpenFEMA live APIOpen →
⚡
D3.jsMap Synthetic
EcoCharge — Live Station Fault Map
A live-style fault map for a fictional national EV-charging network — watch stations blink offline across the country and recover.
Seeded synthetic dataOpen →
🚀
D3.jsDashboard Anonymized
Cortexa — Deployment Analytics
A live-style CI/CD deployment dashboard for a fictional AI startup — hundreds of engineers, thousands of deploys. Fully synthetic/anonymized; the story is the technique.
Synthetic demo dataOpen →
🚀
D3.jsTimeline Illustrative
Space Launch Cadence: Lanes of Lift-Off
Animated swimlane timeline showing launch-program cadence from Apollo to the reusable-rocket era.
Illustrative (real programs/eras)Open →
🌡️
D3.jsHeatmap Synthetic
A Century of US Extreme Heat Days
State-by-year heatmap shows synthetic 95°F days rising across the US from 1950 to 2024.
Seeded synthetic dataOpen →
⚡
D3.jsSankey Illustrative
U.S. Energy Flow
Animated Sankey tracing illustrative energy sources into electricity, losses, and end-use sectors.
Illustrative (EIA-modeled)Open →
🌌
D3.jsNetwork Graph Synthetic
Nova Dependency Galaxy
Synthetic JavaScript packages orbit shared dependencies in a vibrant, interactive force-directed map.
Seeded synthetic dataOpen →
🛫
D3.jsDashboard Synthetic
SkyPort Airline Ops Dashboard
Fictional airline ops dashboard — on-time KPIs, hub reliability, delay trends, route rankings, and causes.
Synthetic demo dataOpen →
✉️
SVG/D3Explainer Educational
How an Email Actually Travels
Animated explainer tracing one message through SMTP, DNS routing, filtering, mailbox storage, and client sync.
Educational explainerOpen →
📈
D3.jsDashboard Synthetic
Forgeline Lead-Gen Funnel
Marketing funnel for a fictional SaaS — conversion and time-to-convert split by customer-intent segment.
Synthetic demo dataOpen →

All visualizations are hand-coded with D3.js v7. Data sources are labeled per piece: real (public) datasets are pulled live where noted; synthetic/anonymized pieces contain no real personal or company data.