Vizzy
An AI tool for interactive web charts that stay on brand
From a spreadsheet to a responsive chart in one prompt.
Challenge
AI can generate a chart in seconds, but it has no single source of truth to work from. It invents its own colors, fonts, and sizes, so charts don't match each other or the brand.
Approach
I started by writing every visual decision into one token file. The AI's only job is to understand the data and describe the chart it calls for. The chart itself is drawn by code that can only use what is in that file. Charts adapt to their space instead of shrinking. Each one is automatically checked at small widths and fails if a label is cut or touches another element.
Impact
Every chart Vizzy makes is branded, responsive, consistent with the rest, and it still takes only one prompt. In other tools I had limited responsive control and had to rebrand each chart by hand.
A spreadsheet is uploaded to Vizzy. The AI reads the file and chooses the best chart, then Vizzy applies the brand and draws it.
Each chart opens in the editor, where it can be adjusted within the brand's limits.
The Control page holds the brand's colors, typefaces, text sizes, and spacing. Every chart Vizzy makes, from an uploaded file or a description, is drawn from it. Save a change to the sizes or spacing and every chart updates to match.
The same chart at desktop, tablet, and phone width. The labels rearrange and the chart grows taller as it narrows, instead of shrinking.
Hover over a chart to see its values. Share it as an image, as code for a website, or as a link.
Each chart is saved as data and intent, with no colors or sizes of its own, so a brand change updates every chart.
Every chart is redrawn at widths down to 300px and fails if a label is cut or touches another element.
