Marina DiPonio logo Marina DiPonio
Ambient · Underwater
Foreshore — the app logo and tagline, "Know where your money went." ≈ Self-Hosted · Solo Build

Foreshore

A self-hosted personal budgeting app · Designed & built end-to-end · Solo

The Idea

Foreshore replaces the budgeting spreadsheet with something calmer and more honest. Charges arrive from your bank, you sort each one into a category with a tap, and animated water-fill tiles show how full each budget is. It has a coastal aesthetic, a dark-mode-first interface, and a design language built around one rule: the app never pretends to know more than it does.

The Sort screen — animated water-fill tiles showing how full each spending category is for the month.
Sort · water-fill budget tiles
Why I Built It

I wanted a budgeting tool I fully owned — my data on my hardware, nothing sold to a third party, no subscription, no ads. So I built the whole stack: the design, the app, and the server it lives on.

Interaction Model

The whole app turns on a single gesture: tap a charge, drop it in a category. Around that sit water-fill budget tiles, a Goals screen with savings targets, an Overview with spending breakdowns, and a Journal.

Budget screen — each category set to a Hard limit, a Soft target, or tracking-only None.
Budget · hard, soft, and tracked-only limits
Budgets That Don't Nag

Every category can be a Hard limit that flags you when you cross it, a Soft target that stays quiet, or None that just tracks spending and stays out of the math. The point is to plan without being scolded.

Goals screen — a savings goal showing progress toward its target.
Goals · saving toward a target
Onboarding in Six Screens

A new person goes from zero to a working budget in six screens — pick a few categories, say what you expect to earn, and choose how charges should arrive.

Onboarding — choosing spending categories from a set of suggestions.
Pick categories
Onboarding — entering expected income, which the app plans against.
Expected income
A Coastal Design System

Everything is built on a custom design system in a coastal palette — teal, foam, and sand — dark-mode-first, with colour-coded categories that flow straight into the Sort grid.

Settings — the category list, whose colours drive the Sort grid ordering.
Category system · colour drives the grid
A Strict Commit Model

The backend is Node and Express with one firm rule: a write only counts once it's confirmed synced. No phantom saves. It's built on top of Actual Budget's sync engine, so the underlying data is stored encrypted.

Read-Only by Design

Bank sync is optional and one-directional. Through SimpleFin, Foreshore can observe charges but can never move money — and it never sees your bank password.

Onboarding — optional read-only bank connection via SimpleFin; the app never sees your password and can never move money.
Optional read-only bank sync
Honest About What It Knows

When money is still syncing, the app says so rather than showing a fake number. A small deposit you didn't plan for is surfaced as a windfall — something to save on purpose — instead of being quietly absorbed.

Budget screen — a small unplanned deposit surfaced as a windfall to save before you notice it.
Windfalls, surfaced not hidden
Zero Third-Party Calls

Fonts are self-hosted and the app makes exactly one outbound connection — and only when the user opts into bank sync. The whole thing is containerized with Docker so it can run isolated instances.

From Dead PC to Home Server

The part I'm proudest of: I took a dead desktop, installed Linux on it, and turned it into a private home server — reachable only over a secure mesh network, with no exposure to the public internet.

Settings — read-only bank connection and a self-hosted server shown as reachable.
Your data, on your own server
Built to Survive

I made it survive power cuts unattended, run isolated instances for different people, and connect to real banks read-only. It's a server I don't have to babysit.

Honest States Everywhere

The same honesty runs through the failure states: a read-only mode, a calm "can't reach your ledger" screen, and loading states designed so the app never lies about what it knows.

Overview — an honest history that shows the month is still open rather than inventing a total.
Overview · it won't invent a total
What It Became

It went from a sketch of a water-fill grid to a working app pulling real transactions on my phone — my data, my hardware, no subscription, no ads. I shipped it for friends and family to use.

What It Taught Me

Foreshore pulled together product and UX design, a design system, front-end engineering, a Node backend, Docker, Linux server administration, networking, working with financial APIs, and a lot of careful debugging on real hardware — end to end, by one person.

Emailmarinadiponio@proton.me LinkedIn/in/marinadiponio Behance/marinadiponio Calendlymarinadiponio-proton/30min