Olos-AI Mini Budget Planner

Inspiration

I wanted a personal budget tracker because I'm generally hopeless (like most people) at controlling my spending and having something like this app allows me to be accounting for each and every dollar I spend, yes there are hundreds of them in the app store but I don't think people need to spend more money for a subscription and lose their privacy for a basic tracker. I used AI to assist in the development and writing to assist with expressing the story clearly

Personal budgeting should be simple: record money coming in or going out, then immediately understand what remains. Many budgeting products instead introduce subscriptions, user accounts, bank connections, advertising, telemetry, and increasingly complex dashboards.

Olos-AI Mini Budget Planner was built as a deliberately small alternative. Its normal experience remains a fast, visual, local-first budget tracker. The WebMCP Challenge presented a different question: can this existing application become agent-native without embedding a chatbot, adding an LLM dependency, or surrendering its financial rules to an AI model?

What it does

The planner records income, expenses, bills, savings, recurring commitments, revolving credit, Pay Later balances, and estimated fixed loans. It shows actual and projected monthly cashflow while keeping available cash, available credit, and loan liabilities clearly separate.

People use the normal responsive interface. Compatible agents receive eleven structured WebMCP tools for reading budget information and performing explicit, validated actions.

An agent can:

Read the monthly budget summary
List upcoming commitments
Search recent activity
Inspect credit and loan balances
Read calendar projections
Record a confirmed transaction
Create or record a recurring item
Record a credit payment
Correct an existing transaction
Delete an identified transaction with deliberate confirmation

Agent-created changes appear immediately in the same interface the person uses.

How we built it

The application uses FastAPI, Pydantic, SQLite, HTML, CSS, JavaScript, and PWA APIs.

The WebMCP layer is a thin adapter. Each tool is registered through document.modelContext.registerTool(...) with a strict JSON schema, clear description, bounded inputs, and appropriate read-only or mutating behaviour. Tool callbacks call the same FastAPI endpoints used by the visual interface.

All validation, recurrence handling, credit balances, fixed-loan calculations, and no-double-counting rules remain in the existing deterministic application logic. Financial calculations are not duplicated in prompts or delegated to an LLM.

Why WebMCP improves the experience

Without WebMCP, an agent must interpret labels, click controls, and infer meaning from page layout. With WebMCP, the application directly explains what actions are available and the exact structure each action requires.

A person can say, “Record an $87.40 grocery expense paid with my credit card,” and the agent can submit one validated transaction using typed fields for amount, date, category, payment method, and facility ID. The result then appears in Recent Activity and updates the monthly figures.

The application itself does not contain an AI assistant and does not send financial data to a third-party AI service. WebMCP lets the browser and a compatible agent collaborate with the application at its boundary.

Challenges

The most important challenge was preserving one financial authority. It would have been easy to create simplified financial behaviour inside the WebMCP callbacks. Instead, the tools reuse the same tested API and domain rules as the human interface.

The hosted demonstration also required a strict privacy boundary. The public Render deployment uses synthetic data and isolated disposable browser sessions. It has no connection to anyone’s personal local database.

Accomplishments

Eleven meaningful WebMCP tools rather than a ceremonial integration
Exact decimal-string money inputs
Structured separation of cash, credit availability, and loan liabilities
Immediate visual refresh after agent mutations
Idempotent recurring-payment recording
Protection against double-counting credit and loan repayments
A useful application that remains fully functional without an agent
Disposable, session-isolated public demonstration data

What we learned

Agent-native does not have to mean “put a chatbot in every application.” A deterministic web application can preserve its normal human interface while exposing a second, structured interface designed for agents.

That approach makes agent interaction more accurate while keeping the application’s own rules authoritative.

What’s next

The immediate goal is to keep the project small, understandable, and dependable. Future work would focus on wider WebMCP browser compatibility and further usability testing, without turning the application into banking software or a financial-advice platform.

Live demo: https://olos-ai-mini-budget-planner.onrender.com

Source: https://github.com/oscarcybermonk/olos-ai-mini-budget-planner/tree/hackathon/webmcp