UI/UX / Web DevelopmentAcademic project2025

MoneyTime

A web app that puts money and schedules on one dashboard. A group project for the course Software Implementation and Testing, where I worked on both design and code.

Role: Designer and Developer
Year: 2025
Team: Team of 5 students
Platform: Web
Tools: HTML, CSS, JavaScript, Flask, Supabase, Groq

Dashboard page with income, expense, balance and upcoming schedule cards, a list of transactions by day, a schedule list and an assistant chat window. — Dashboard: monthly income, expenses and balance, transactions by day, upcoming schedule and the MoneyTime Assistant chat.

Money page with summary cards, a list of transactions by day and a pie chart of spending by category. — Money: transactions by month and a pie chart of spending by category.

Time page with counters for upcoming, completed and overdue schedules and lists grouped into Today and Next 7 Days. — Time: upcoming, completed and overdue schedules, grouped by Today, Next 7 Days and Later.

Overview

MoneyTime is a web application that combines money tracking and schedule management. It has three main pages: a Dashboard that summarizes both, a Money page for transactions and a spending chart, and a Time page for schedules. The Dashboard also has a chat assistant. We built it as a group project for the course Software Implementation and Testing (Implementasi dan Pengujian Perangkat Lunak).

Tech stack

The front end uses HTML, CSS and JavaScript. The back end uses Python (Flask), Supabase and Groq. Groq powers the MoneyTime Assistant chat on the Dashboard.

My contribution

I worked on both the design and the code, in a team of five. The exact split of work between team members is not available yet.

Status

All features work except Google Calendar sync, which is not functional. The transactions and amounts in the screenshots are sample data.