FINA — Designing a Personal Finance Product That Became a $200+ Digital Product

The Idea

Most banking apps are built around one fundamental concept: your money lives in an account. But in real life, people rarely think about their money that way. We think about money as the house I’m saving for, the vacation I’m planning, the emergency fund I don’t want to touch, or the money I need to set aside for this month.

That disconnect became the starting point for FINA. I wanted to explore what a personal finance product would look like if it wasn’t designed only around transactions, but around the goals and intentions behind people’s money. The result was FINA — a mobile-first personal finance product that combines everyday banking with goal-oriented and collaborative saving.

Reframing the Problem

The challenge wasn’t simply to design another fintech dashboard. There are already countless banking products that can show your balance, transaction history, and spending activity. What I wanted to explore was the layer beyond that:

How can an interface help people give their money a purpose?

This question led me to a simple product concept: Pockets. Instead of keeping all savings in one place, users could create separate financial spaces based on what they were saving for. A user could have a House Down Payment pocket, an Emergency Fund, and a Japan Trip pocket — each with its own target, progress, and financial activity.

From there, FINA evolved into three connected experiences: everyday Banking, purpose-driven Regular Pockets, and collaborative Split Pockets. The Goals experience then brings the user’s overall savings progress together in one place, creating a unified architectural foundation for the entire product.

Designing Money Around Goals

The most important experience in FINA is the Pocket. I designed Regular Pocket as a dedicated space for a specific financial purpose, where a user can define a target, set a deadline, track progress, and see how consistently they’re saving. But I didn’t want the concept to stop at personal savings — money is often shared with partners, families, or friends.

That introduced a second question: what happens when saving becomes a collaborative activity?

This led to Split Pocket. Imagine five friends planning a trip to Japan with a shared target of Rp50.000.000. Instead of simply showing one shared balance, FINA gives every member their own contribution target and progress. The group can see how much has been saved collectively while each person still has a clear understanding of their own responsibility. Users can choose an equal split or define custom contributions, making the experience flexible enough for different real-world situations.

Designing the Rules Behind the Interface

Once money becomes shared, the interface needs to communicate more than numbers — it needs to communicate permission and trust. For Regular Pocket, I introduced three member roles:

• Owner: Has full administrative control over pocket rules, targets, and members.
• Bisa Pakai: Members can use the money within predefined spending limits.
• Bisa Lihat: Members have transparent view-only access to balance and progress.

The Owner can also define both transaction-level and monthly spending limits. This was an important part of the product thinking because the UI shouldn’t just tell users what they can do; it should make clear what they’re allowed to do and why. The system also accounts for situations where a member exceeds their limit, including hard-stop behavior and notifications to both the member and owner.

From Product Architecture to Screens

With the core model established, I translated the product into a complete mobile experience built around an intentionally simple navigation: Home, Pocket, Goals, Transaction, and Profile.

Home answers the immediate question of “How is my money doing?” by surfacing total balance, savings and spending activity, quick actions, saving habits, active pockets, and recent transactions. Pocket becomes the place where money gets organized around specific purposes, while Goals steps back from individual pockets to provide a broader view of the user’s overall saving behavior. This separation was crucial — Goals isn’t another place to move money, but a read-only overview of progress across all pockets.

Designing Beyond the Happy Path

Real products aren’t always in their perfect state: users don’t always have transactions, pockets aren’t populated immediately, password reset links expire, transactions fail, invitations remain unanswered, and spending limits get reached.

I designed these edge situations as core parts of the product experience rather than treating them as afterthoughts. FINA includes comprehensive empty states across Home, Pocket, Transaction, Goals, Notification, and authentication flows, alongside error, success, and limit-related states. This attention to detail made the system feel less like an idealized collection of screens and more like a real product engineered for the real world.

Building a Product, Not Just a Portfolio Piece

At this point, I had a decision to make: I could stop once the interface looked good, or I could take the idea one step further and turn it into something other designers could actually use. I chose the second option.

FINA was developed as a commercial UI Kit for designers and product teams. That changed the way I approached the work — every flow needed to be complete, components needed to be reusable, states needed to make sense, and the product needed enough depth to demonstrate how a real fintech application works. The goal wasn’t to create 170+ screens for the sake of having a large number; the goal was to make every screen contribute to a believable, production-grade product system.

20 Days Later

I completed FINA in around 20 days, resulting in a comprehensive UI Kit with 170+ mobile screens covering authentication, banking, transactions, Regular Pockets, Split Pockets, Goals, notifications, profiles, and supporting states.

The most exciting validation came after publishing FINA as a commercial digital product: it started generating revenue.

That number matters to me because it fundamentally changed how I viewed the project. FINA was no longer just a self-initiated case study sitting in a portfolio — someone had actually found genuine value in the product and paid for it.

What I Learned

FINA taught me that good product design isn’t necessarily about adding more features; it’s about finding the right mental model. The biggest design decision wasn’t the color palette, the dashboard, or even the sheer volume of screens. It was the decision to organize the experience around why people are saving, rather than simply where their money is stored.

It also reinforced something I’ve been exploring as a designer: a UI kit can be treated as a real product. Once you think about users, product architecture, edge cases, reusability, distribution, and revenue, the nature of the work changes completely. You’re no longer just designing screens — you’re designing something that needs to work.

The Outcome

FINA started with a simple question:

What if personal finance was designed around goals instead of just accounts?

That question grew into a complete fintech product concept, a 170+ screen UI system, and eventually a commercial digital product that generated $200+ in revenue. For me, that’s what made FINA worth building — not because of the number of screens, but because the design became something that communicated an idea, solved a problem, and created real value.