Worthwise

Overview

Worthwise is a concept personal finance web app for young professionals managing their first real salaries. I designed and built it as a product site and a working toolset in one: a budget planner, expense tracker, savings goals, calculators and plain-English money guides, all usable without signing up.

The challenge

Most budgeting apps ask for an account and a bank connection before they show you anything useful. The goal here was the opposite: let someone drag a slider on the homepage and see a plan for their pay straight away, keep their numbers on their own device, and make the tools feel like one connected picture rather than separate widgets. It also had to feel calm and trustworthy, not like a trading app.

What I built

• A hero pay slider that splits take-home pay with the 50/30/20 rule and projects an emergency fund and a savings goal live
• A goal picker that turns a target and a timeline into a monthly amount
• Connected tools (budget planner, expense tracker, savings goals and a monthly snapshot) that update each other as you log spending
• A set of calculators, from compound interest and debt payoff to a "habit cost" tool
• A pinned, scroll-driven walkthrough that shows one paycheck getting a plan
• A guides library with a "Start here" reading path, read tracking and search
• Currency switching between naira, dollars, pounds and euros

Design & build

The brand runs on forest and moss greens against cream, with Fraunces for display type, Inter for everything else and a W-and-leaf mark rebuilt as SVG from the brand guide. The tone matches the tagline, "Smarter money. Brighter you.": warm, quiet and confident.

It's built with Next.js 16 and Tailwind CSS 4. All data lives in the browser's localStorage, and first-time visitors see clearly labelled sample data, so previews never look empty. Motion is layered with restraint: Lenis for smooth scrolling, a light IntersectionObserver and Web Animations setup for reveals, and GSAP ScrollTrigger only where it earns its place (the hero, the pinned steps and the footer). Charts animate as they scroll into view.

What it delivers

Worthwise shows how a finance product can earn trust before it asks for anything. Visitors get real value on the first screen, the tools work together, and privacy is built in rather than promised. The structure leaves room to grow, too: the monthly snapshot is designed to become a synced dashboard once accounts launch. It's the kind of product I build as part of my web apps work.