Mini Experiments
Vibe Coding
Expense Management
Web App
AI-bot expense management with Figma & Cursor, Replit
Personalized expense management system using AI-bot to help people generate expense insights and advice.
Vibe coding is trending, and I want to see how far it can take me.
As a designer with prior coding experience, I was curious to explore how AI-powered coding tools can accelerate rapid prototyping and improve my design workflow.
I want to try all AI tools to create a product, so I use Google Stitch to generate expense management dashboard design. After that, I tweak a little design in Figma.
Dashboard design generated by Google Stitch and twisted in Figma
Giving the same prompt and refer image to Cursor AI and Replit AI to create interactive dashboard.
Replit generates dashboard visual design first.
Replit builds the visual design first, showing progress along the way even before the design is fully complete. Afterward, features are implemented, though multiple re-prompts are often needed to achieve correct working functions.
Dashboard design generated by Replit
Cursor doesn't need to re-prompt again and again.
Cursor takes a little longer time to complete interactive dashboard, but the outcome functions are all working properly.
Dashboard design generated by Cursor GPT-5
After a few prompts, I got this final result. Functions include
Add income
Add new expense
A reminder of spending insights
AI chat bot
How it works:
'Total income', 'Total spending' and 'Net savings' are changed according to the user input of income and expense amount.
The same for the graph of 'Spending Overview' and 'Spending Categories' and shows the spending amount when hover on the graph.
AI chatbot gives back response whenever I type and this means it works well. But to get back correct response of whatever we ask, still need to connect with API keys or need more coding functionality.
What I have learned through this project
Both Cursor and Replit are completed the project in just a few hours an impressive speed-up.
I love the visual design generated by Replit, it nearly got the similar dashboard design I gave.
I find Cursor more reliable, as it executes functions correctly without the need for repeated prompts.
But to achieve a beautifully polished interface, both tools still require multiple re-prompts or, direct modification inside the coding files.
