From tables to tiles: redesigning a reporting dashboard

For years, a TicketingHub supplier who wanted to know how the business was doing opened a page called Reports. It had the numbers, all of them, and that was the problem.

The feedback from suppliers was consistent. Reports was dry, hard to read and unclear, and many of them did not know how to use it properly. What they asked for was a list of the things they care about, where they could add one, remove one, or go into one for a closer look. That is where the wish for charts came from.

I designed the replacement and built its frontend. Paweł Krysiak built the data layer, on groundwork by Chris Branson. Switch between the two below.

What the Reports page asked of people

Reports opens with three totals and then lays out every breakdown the system has: provisional bookings, channels, users, resellers, locations, currencies, products, groups and variants. Each one is a table, and each row is a link that filters the whole page by that value.

All of it is correct, and none of it says what matters. A supplier who wants to know whether July was better than June has to run the page twice and compare the totals in their head. Someone who only cares about two products still gets nine tables. There is nothing to look at, only things to read.

Designing it in code

I drew the dashboard in Figma first, and the shipped screens match those drawings. Then, in July 2024, I built the design as a working prototype in the real codebase, with the help of a language model, and opened it as a pull request. The engineering pull request that followed says in its description that the design came from mine.

That changed the handover. The markup and the styles were already there, in the dashboard's own Bootstrap, so Paweł could put his time into the data: a time series built from order transactions, kept up to date by scheduled jobs, with the future read live.

The first version was merged on 8 August 2024 and switched on for everyone, with a toggle to bring the old view back.

A tile answers one question

Each tile is one question. A chart tile has a title, this period's total, the comparison period's total in grey next to it, the change between them as a percentage with an arrow, and two lines. The charts took their cue from Stripe's dashboard and are drawn with Chartkick on Highcharts: straight lines, no points, the primary blue over a grey comparison. Hovering over a chart reads out a single day for both periods.

A list tile is for questions with names in the answer, such as which products or which channels. It shows six rows and a "View more", so a long list of products does not push everything else off the screen.

One filter bar drives every tile at once: the date range, whether dates mean booked on or booked for, what to compare with, and the granularity. Comparing July with June is now one dropdown.

Add, remove, rearrange

This is the part suppliers asked for in so many words. Add opens a panel with every tile and a switch on each. Edit puts a cross on every tile and lets them be dragged into a new order. A supplier who sells through resellers can keep that tile at the top, and one who does not never has to see it.

The dashboard became the home page of the whole product, so this is the first screen a supplier sees after signing in.

Going in for a closer look

A tile's title is a link. Behind it is the same chart, larger, with the numbers under it as a table: each period, the comparison, and the difference. For sales, the page goes on to break the same period down by product, user, reseller and channel.

The new screen stayed connected to the old one. In the list tiles, a row links to the old report filtered by exactly that value, with the same dates. My pull request of 1 August, a week before launch, was only that: making the link precise.

What changed after launch

Three weeks after the first version, a round of improvements went in. The tooltip now shows the percentage difference between the two lines at that point. The comparison can be switched off, which Carl Pihl had asked for in a weekly meeting. And the granularity is limited by the range, because a week shown monthly was a chart with a single invisible point.

In January 2025 I fixed the page's responsiveness, which had been lost when it was split into sections.

In February 2026 I added the chart at the top, and this time I wrote the data side as well: monthly sales, year over year. It always shows the current year and adds up to two earlier years, but only when they have data, so a new supplier sees one clean series instead of two empty ones. Numbers are formatted for the supplier's locale and currency, and the time zone handling in the reporting queries was tightened along the way.

Two systems, two answers

For a long time Reports and the dashboard lived side by side, and suppliers noticed that the numbers did not always agree. They were both right. They count differently: cancellations inside the period, tax, days cut in UTC or in the account's time zone, vouchers, abandoned checkouts. In August 2026 the team wrote that down in the help centre, tile by tile, with a recipe for reconciling the two.

Outcome

Every supplier now works from the dashboard. Nobody uses the Reports page any more, and it is being retired. The tile system keeps growing without me: in August 2026 the team added tiles for coupons and ticket types, in the same two shapes, chart and list.

The same dashboard later got the availability calendar and the Stripe dispute alerts.

Working together

I designed the dashboard and built its frontend. Paweł Krysiak built the data layer, on groundwork by Chris Branson.

If you are planning something similar, I am taking on new work. Write to hello@edigil.com or use the contact page.