Skip to content
ui ux2026

Ledgerly

Ledgerly is a self-initiated financial SaaS case study designed to simplify financial management for small businesses and independent professionals. The experience consolidates income, expenses, invoices, subscriptions, budgets, and forecasts into a unified workspace.

fintechfinancial-dashboardsaasanalyticsdata-visualizationproduct-designdashboard-designresponsive-uidesign-systemux-case-study
Ledgerly cover
Client

Self-initiated

Year

2026

Role

Product Designer, UX Researcher, UI Designer, Interaction Designer

Duration

8 weeks

UI/UX flow

Scroll the product story from start to finish.

Screens, responsive states, and prototype GIFs are arranged vertically so the case study reads like a polished portfolio presentation.

Step 01

Design screen

Scroll
Ledgerly UI/UX screen 1

Step 02

Design screen

Scroll
Ledgerly UI/UX screen 2

Step 03

Design screen

Scroll
Ledgerly UI/UX screen 3

Step 04

Design screen

Scroll
Ledgerly UI/UX screen 4

Step 05

Design screen

Scroll
Ledgerly UI/UX screen 5

Step 06

Design screen

Scroll
Ledgerly UI/UX screen 6

Step 07

Design screen

Scroll
Ledgerly UI/UX screen 7

Step 08

Design screen

Scroll
Ledgerly UI/UX screen 8
rich text

Project introduction

Self-initiated portfolio case study. Ledgerly is a self-initiated financial SaaS case study designed to simplify financial management for small businesses and independent professionals. The experience consolidates income, expenses, invoices, subscriptions, budgets, and forecasts into a unified workspace.

callout

Problem statement

Show current financial position quickly
Track income, expenses, and overdue invoices
Monitor cash flow and compare periods
Detect financial risks before they become serious
feature list

Core product features

A modular finance dashboard with clear summaries, interactive reports, simplified navigation, and context-aware financial insights.

  • Financial overview dashboard
  • Revenue and expense analytics
  • Cash-flow forecasting
  • Invoice tracking
  • Subscription monitoring
  • Budget categories
  • Smart alerts
  • Downloadable reports
process steps

Design deliverables

The case study covers research framing, product architecture, interface design, responsive behavior, and system decisions.

  • Product discovery
  • Competitive analysis
  • Information architecture
  • User flows
  • High-fidelity dashboard
  • Responsive screens
  • Design system
  • Interactive prototype
image grid

Case-study image set

Generated as separate full-resolution boards and arranged in portfolio story order.

Case-study image set media
Case-study image set media
Case-study image set media
Case-study image set media
technology stack

Tools and represented technologies

Technologies represent the proposed product architecture for the concept.

  • Figma
  • FigJam
  • Adobe Photoshop
  • Notion
  • Maze
  • React
  • Next.js
  • TypeScript
  • Charting library
  • Supabase
  • Financial API
Related

More work from nearby categories.