bonsai Expenses tracking dashboard

Role

UI/UX design: design an expenses tracking dashboard
Frontend development: develop the dashboard with Vue.js

Toolkit

Figma, VueJS

Year

2024

General

bonsai - Overview screen

Overview

The application provides users with an overview of their monthly expenses, income, and savings.

It includes a detailed list of all transactions, complemented by graphical representations to help users understand trends and track their financial evolution.

Transaction detail

Users can view additional details for each transaction in a right drawer, where they can also update the transaction category.

I opted for a right drawer to maintain context while accessing transaction details, ensuring a seamless user experience.

bonsai - Right drawer

Filter and search

bonsai - Search

Search transactions

Users can perform a quick search to locate specific transactions, with the option to export search results to a spreadsheet file.

Filter transactions

In addition to searching, users can also apply filters to refine their transaction view.

bonsai - Filter

Contact

Are you looking for a senior UI/UX designer & frontend developer to strengthen your team?

I'd love to connect in a personal meeting—feel free to reach out!

Email me