Ringkasan
FinTime adalah aplikasi keuangan pribadi yang dikembangkan sebagai capstone tim Coding Camp 2026. Aplikasi ini menyajikan ringkasan keuangan dan simulasi pembelian agar pengguna lebih mudah memahami kondisi saat ini serta konsekuensi dari beberapa pilihan pengeluaran.
Fokus antarmukanya adalah mengubah data keuangan menjadi informasi yang mudah ditinjau: saldo, aset, transaksi, grafik, dan skenario pembelian disusun dalam pengalaman yang saling terhubung.
Masalah dan tujuan
Informasi keuangan pribadi sering tersebar pada beberapa catatan. Pengguna dapat mengetahui saldo, tetapi belum tentu memiliki gambaran tentang pola transaksi atau dampak rencana pembelian terhadap kondisi keuangannya.
FinTime dirancang untuk membantu pengguna:
- Meninjau ringkasan saldo, aset, dan transaksi.
- Memahami perubahan kondisi keuangan melalui grafik.
- Membandingkan skenario pembelian, termasuk tunai dan PayLater.
- Membaca informasi dalam antarmuka bahasa Indonesia dan Inggris.
Pendekatan antarmuka
Dashboard menjadi titik awal untuk membaca kondisi keuangan. Grafik responsif membantu menunjukkan perubahan data, sedangkan indikator visual dan avatar kondisi finansial memberikan ringkasan yang mudah dipahami.
Simulasi pembelian menyajikan perbandingan berdasarkan asumsi skenario yang digunakan. Nilai utama fitur ini adalah membantu pengguna meninjau konsekuensi pilihan sebelum mengambil keputusan.
Pengaturan hierarki informasi, komponen dashboard, dan transisi halaman mendukung pengalaman yang konsisten pada berbagai ukuran layar.
Implementasi teknis
Frontend dibangun menggunakan React 19 dan Vite. React Router menangani navigasi; React Context mengelola state bersama; SWR menangani pengambilan data; dan Recharts menyajikan grafik. Tailwind CSS digunakan untuk pengaturan tampilan.
Komponen antarmuka dipisahkan dari hook, state, dan API client. Alamat backend dikonfigurasi melalui environment variable sehingga pengembangan antarmuka dapat mengikuti lingkungan layanan yang digunakan.
Pemisahan tanggung jawab ini membantu pemeliharaan dashboard, penambahan halaman, dan pengujian perubahan tanpa menempatkan seluruh logika di komponen presentasi.
Alur penggunaan
- Pengguna membuka dashboard untuk meninjau ringkasan kondisi keuangan.
- Informasi transaksi dan grafik membantu pengguna membaca pola yang relevan.
- Pengguna meninjau skenario pembelian yang tersedia.
- Perbandingan skenario membantu menjelaskan pengaruh pilihan terhadap kondisi yang dimodelkan.
Keutuhan alur data bergantung pada konfigurasi dan kesiapan backend. Simulasi mengikuti asumsi yang ditentukan dalam model skenario.
Hasil dan batasan
Hasil pengembangan mencakup frontend dashboard, visualisasi keuangan, antarmuka simulasi, dan dukungan dua bahasa. FinTime merupakan proyek tim dengan fokus studi kasus pada penyajian informasi serta integrasi antarmuka.
Simulasi digunakan untuk membantu memahami skenario. Hasilnya perlu dibaca bersama asumsi input dan tidak menjamin kondisi keuangan di masa mendatang. Validasi penggunaan nyata masih memerlukan pengujian bersama backend dan pengguna.
Pengembangan berikutnya
Pengembangan berikutnya diarahkan pada kejelasan asumsi simulasi, penanganan data kosong dan kegagalan API, serta pengujian alur utama dengan data yang representatif. Pengujian kegunaan juga diperlukan untuk menilai apakah grafik dan perbandingan skenario benar-benar membantu pengguna memahami pilihannya.
Kode dan dokumentasi
Fokus pengembangan
Proyek tim dengan fokus studi kasus pada penyajian dashboard, visualisasi keuangan, skenario pembelian, dan integrasi frontend.