UI/UX / Web DevelopmentInternship2026

Digi Money Manager

A finance system that replaces WhatsApp and spreadsheet reimbursements with one tracked approval flow for five user roles. I designed every screen in Figma and built part of the front end.

Role: UI/UX Designer and Programmer
Year: 2026
Team: Team of 7 students, Rapid Application Development (RAD)
Platform: Web
Tools: Figma, Next.js, TypeScript, Tailwind CSS

Sign-in screen with a green panel listing three features on the left and an email and password form on the right. — Sign in: the left panel introduces three ideas, receipts filled by AI, an automatic debit and credit journal, and a real-time budget.

Employee screen for submitting a reimbursement: a four-step progress bar and an upload area for a receipt photo. — Employee: submit a reimbursement by uploading a receipt. Four steps: upload, AI reads the data, review and send, submitted.

Submission history detail panel showing status, amount, budget item levels, anti-fraud status and an approval timeline. — Employee: submission detail with the budget item (Main, Sub, Keterangan), an anti-fraud status and the approval timeline.

Project manager approval queue with a list of requests and a detail panel showing budget realization and Reject and Forward buttons. — Project manager: approval queue with budget realization next to each request, and actions to reject or forward to finance.

Finance disbursement queue with a detail panel and a preview of the automatically generated accounting journal. — Finance: disbursement queue with a preview of the debit and credit journal entry that is generated automatically.

Executive dashboard with summary cards, a 12-month cash flow bar chart, submission and installment summaries and an active projects table. — Director: executive dashboard with totals, a cash flow chart, submission and installment summaries and active projects.

Project management screen with project cards filtered by status: planning, active, done, canceled. — Director: project management with search, status filters and a card per project.

Overview

Digi Money Manager is a web-based project finance system for PT Metanouva Informatika that centralizes reimbursement and project financial records. Before it, reimbursements ran through WhatsApp messages and spreadsheets, which scattered the data, made approval status hard to track, and made recording and reporting slow.

The system serves five roles: Superadmin, Director, Project Manager, Finance and Employee. An employee submits a reimbursement, the project manager approves it, and finance disburses it. The director approves budget item requests from project managers, and the superadmin manages accounts and the Chart of Accounts. It also reads receipts with a vision language model, exports to Excel, and includes Smart Chat, an AI assistant that answers finance questions based on the signed-in role.

Context

The app began as a Computing Project course with the same partner. I continued it during my internship from June to August 2026, working in a team of seven using the Rapid Application Development (RAD) method.

Approval flow

Every reimbursement is shown to the user as four steps: submitted, validated by the project manager, verified by finance, and disbursed. The screens above follow that path, and the finance screen previews the accounting journal that is generated when a request is disbursed.

My contribution

I designed all screens in Figma on my own, for all five roles. I also built front-end modules and supporting endpoints together with other team members, fixed QA findings in my modules, and wrote the user manual with the team.

Status

The application is in use at the company.