Skip to content
Automation AA-013

Excel Dashboard Converter

Drag-and-drop web app that transforms Excel files into interactive KPI dashboards entirely client-side — with auto-KPI detection, chart type auto-suggestion, and zero server-side data processing for privacy-sensitive workforce education data.

01 — Problem

Spreadsheets That Never Become Dashboards

Program directors and department heads lived inside Excel. Their data was there — enrollment counts, budget allocations, completion rates — but their stakeholders wanted dashboards. Every reporting cycle, someone would export a spreadsheet, manually build charts in PowerPoint, screenshot them, and email the result. The data was 3 days old by the time the presentation reached anyone who could act on it. I watched this ritual repeat across 6 programs, each producing its own bespoke report with its own formatting conventions and its own staleness guarantees.

I needed a tool that bridged the gap: upload the spreadsheet you already have, get an interactive dashboard you can share. No data migration, no new system to learn, no 3-day reporting lag. The first 80% of dashboard creation should be automatic. Human judgment handles the remaining 20%.

02 — Architecture

Client-Side Intelligence, Zero Backend Processing

The application is a Next.js 16 web app with React 19 that processes Excel files entirely in the browser — no server-side upload, no data leaves the user’s machine:

Excel Parsing (SheetJS)

SheetJS reads .xlsx and .csv files client-side, extracting sheet names, column headers, data types, and row counts. The parser handles merged cells, multi-header rows, and mixed-type columns — common artifacts of real-world spreadsheets that break simpler parsers. All processing happens in the browser; the file never touches a server.

Auto-KPI Detection Engine

The engine scans all columns and identifies numeric fields suitable for KPI cards. It computes sum, mean, min, max, and count for each numeric column and selects the top 4 by variance (most analytically interesting) for automatic KPI card generation. Users can override the selection, but the auto-detection handles the common case where the user doesn’t know which metrics matter until they see them.

Chart Generation (Recharts)

Interactive Bar, Line, and Pie charts render from the detected data structure. The chart type is auto-suggested based on column characteristics: time-series columns trigger Line charts, categorical columns trigger Bar charts, and percentage distributions trigger Pie charts. All charts support hover tooltips, click-to-filter, and responsive resizing.

Persistence (Supabase)

Dashboard configurations (not raw data) can be saved to Supabase for sharing and revisiting. The saved artifact is the layout definition — which columns map to which charts, which KPIs are displayed — not the underlying data. This keeps storage minimal and avoids sending sensitive spreadsheet data to a third-party service.

Key Design Decisions

Why client-side processing instead of server-side? Workforce education data often contains student PII — names, enrollment IDs, completion records. Sending this to a server introduces privacy and compliance concerns. Client-side processing means the data never leaves the browser. This isn’t just a technical preference; it’s a trust architecture decision that eliminated an entire category of stakeholder objection.

Why auto-suggest chart types instead of letting users choose? The target users are program directors, not data analysts. Presenting a blank canvas with a chart type dropdown produces confusion, not dashboards. Auto-suggestion based on data characteristics gets users to a useful visualization in seconds. They can override the suggestion, but most don’t need to.

03 — Outcomes

Measured Results

3
Chart Types

Bar, Line, and Pie with auto-suggestion based on data shape

0
Server-Side Data Processing

all parsing and visualization runs entirely in the browser

<5s
Upload to Dashboard

from file drop to rendered KPIs and charts

4
Auto-Detected KPIs

selected by variance ranking across numeric columns

04 — Reflection

Meeting People Where Their Data Already Lives

The most effective data tools don’t ask users to change their workflows. They intercept the existing workflow and add value at the point of friction. Program directors will not migrate to a new platform. They will not learn SQL. They will not maintain a data pipeline. But they will drag a file onto a webpage if it gives them something useful in 5 seconds. This project taught me that the adoption constraint matters more than the technical capability. A tool nobody uses is worse than a tool that does less but gets used daily.

What I’d change: the auto-KPI detection selects columns by variance, which sometimes surfaces analytically uninteresting but high-variance fields (like ID numbers). A smarter heuristic would weight column names — prioritizing columns named “revenue,” “count,” or “rate” over generic numeric fields. This is a 2-hour improvement that would meaningfully increase first-impression quality.

“The gap between data and decisions is rarely technical. It’s the 45 minutes someone doesn’t have and the learning curve they won’t climb. Close that gap and you’ve solved the real problem.”

Outcomes

3 auto-suggested chart types; 0 server-side data processing (fully client-side); <5 seconds from upload to rendered dashboard; 4 auto-detected KPIs per upload