From Text to Charts: Interactive Financial Visualizations in Cently's AI Chat
September 13, 2025
I was watching someone use Cently's chat when they asked, "How much did I spend on groceries versus dining out?"
The AI responded with this wall of text: "Your grocery spending was 623.18, which represents 57.3% and 42.7% respectively of your food budget, with groceries showing a 12% increase from last month while dining decreased by 8%..."
I watched them squint at the screen, trying to mentally parse all those numbers. That's when it hit me - we were making people do math in their heads when we should just show them a chart.
So I spent the next week rebuilding our entire chat interface.
The obvious problem nobody talks about
Financial conversations are visual. When someone asks about spending patterns, they don't want percentages - they want to see the comparison. But most AI chat interfaces treat everything like a text message, even when the answer is clearly visual.
It's like asking "What does my house look like?" and getting back a paragraph describing the color of each brick instead of a photo.
What we built instead
I rebuilt Cently's chat to render interactive content directly in the conversation. Now when you ask "Show me my top spending categories," you get a live bar chart built from your actual transaction data, not a list of numbers.
Here's what changed:
Real-time chart generation - The AI can now create interactive charts that respond to your specific questions, using your actual data.
Math that actually renders - Financial calculations show up as proper equations, not garbled text.
Tables that don't suck - Data comparisons appear as clean, readable tables instead of comma-separated lists.
The key insight was that the AI shouldn't just analyze your data - it should show you what it found.
How it actually works
I won't bore you with all the technical details, but here's the interesting part: we use MDX compilation to let the AI output rich content that gets rendered as interactive React components.
The AI now knows it can create charts by outputting simple components like:
<BarChart data={categories} xKey="category" yKey="total" />
But here's the clever bit - we designed these components to be AI-friendly. The AI doesn't need to worry about colors, sizing, or responsive design. It just focuses on the data and the message.
What users see now
Before: "Your top 3 categories are General Merchandise (2,000), and Loan Payments ($1,950)."
After: An interactive bar chart where you can hover over each category to see details, compare values visually, and immediately spot patterns.
The difference is night and day. Instead of trying to mentally compare "2,000", you just look at the chart and immediately see that General Merchandise is way higher than everything else.
The tricky parts
Building this wasn't straightforward. The biggest challenge was security - you can't just let an AI output arbitrary code and run it in someone's browser. We had to build a component allowlist system that lets the AI create charts but prevents any potential security issues.
Performance was another headache. Compiling MDX in real-time adds overhead, but we made it work with smart caching and efficient rendering.
The hardest part was actually training the AI to know when to use charts vs. text. Too many charts and conversations feel robotic. Too few and you miss opportunities to make data clear.
What's next
This foundation opens up a lot of possibilities. Interactive tables for drilling down into transactions. Trend analysis with multi-series charts. Budget vs. actual comparisons that update in real-time.
But the bigger lesson here is that AI interfaces don't have to be limited to text. When the answer is visual, show it visually. When it's interactive, make it interactive.
We're just scratching the surface of what's possible when you stop thinking of AI as a chatbot and start thinking of it as an interface that can adapt to whatever format best serves the user.
Try asking Cently to "show me a chart of my spending by category" and see what happens. The response might surprise you.