money-trackes

byAbang Raihan

Aku ingin membuat sebuah money-trackes yang asik dan menyenangkan. Desain UI nya gampang diingat dan membuat orang tertarik dengan jasa ku. Aku mau disini dia punya banyak fitur. Aku sebutin ya. Untuk awal-awal dia harus login atau buat akun dulu. Kalo misal dia udah buat akun nih. Dia bakal ke pertanyaan dulu. Dan pertanyaan dimulai dari gajinya berapa, sudah berkeluarga atau belum, lalu nanti kamu kasih dia kotak untuk nulis apa aja sih kebutuhan dia. Lalu kamu tanya tentang apa keluh kesahnya dan emosi penggunanya serta masalah yang sering dia alamin. Lalu yang terakhir adalah tujuan pengguna selama beberapa tahun kedepan. Lalu nanti Ainya bakal kalkulasiinnya semua secara matang lalu dia akan memberikan dari yang ringan dulu jika orangnya boros. Maka diajarin pelan-pelan sama Ainya untuk belajar mengatur uang secara have fun dan seru. Kalo dia orangnya kehematan, kamu juga harus buat dia agar tidak terlalu hemat dan tidak membuat pengguna menyakiti dirinya sendiri. Lalu bakal masuk ke home page. Untuk mengatur home page, ui dll aku serahkan pada kamu. Tapi intinya aku mau fitur ini harus ada: Fitur dimana ada 2 sheet. Sheet 1 adalah kalkulasi Ai yang disesuaikan sama sifat dan kebutuhan pengguna. Lalu Sheet yang ke-2 adalah isi pengeluarannya si pengguna. Nah aku juga mau nambahin fitur notifikasi. Disini bakal ditampilkan berita seputar ekonomi nasional maupun skala global dan juga harus jelas sumbernya dari mana. Dan juga notif memberi peringatan tentang saham atau investasi. Mau itu emas, reksadana, saham apapun itu. Lalu aku mau notif setiap hari selalu diberi notif 2 setiap hari dengan catetan jika notif > 20 = direset/dihapus notifnya. Lalu aku mau ada Ainya. Ainya adalah seorang burung hantu yang lucu, menggemaskan, pinter ekonomi serta menyesuaikan gaya bahasa pengguna saat pertama kali ngechat. Dan disini aku juga mau kalo Ainya bakal Reset jika udah 30 hari. Intinya setiap 30 hari chat Ainya bakal direset. Nah dan juga setiap 30 hari ketika buka aplikasi/webnya. Maka bakal otomatis ke rapot. Dan aku mau rapotnya itu isinya Niali serta emoji yang diberikan sesuai niali. Lalu statistik pengeluaran pengguna, uangnya lebih banyak keluar kemana aja. Entah itu liburan, kebutuhan pokok, sekolah anak, atau apapun itu. Lalu Ai juga bakal kasih saran agar bisa improve dan terus improve seperti memberi tau agar incomenya bertambah atau gaji naik. Lalu juga diberi tau tips and trick modern cara hemat yang diambil dari sosial media atau sumber lainnya. Lalu ada tombol "Mulai Kembali!" Jika dipencet maka akan direset kembali seperti semula. Namun dengan data pengguna dan rapot yang sebelumnya bakal disimpen sama Ai buat dijadiin data pengguna. Nah dan juga saya mau nambahin fitur liat rapot. Rapot yang setiap dia pencet itu akan masuk ke history rapotnya. Dan dikasih liat hasil rapotnya. Misal Bulan ke-1 rapotnya segini. Bulan ke-2 rapotnya segini, dan seterusnya. Pokoknya sampe bulan ke-12 maka akan direset dan tunjukin kalkulasi nilainya dan perkembangannya, duitnya lari kemana aja, dan apa aja yang masih harus diperbaiki. Tapi pas masuk History rapot dia tetep ditunjukin kok nilai nya walalu belum ke-12. Jadi dia bisa liat perubahan dia. Misal rapot dia dari bulan ke 1-5 maka bakal dikalkulasiin tuh disebuah kolom dan ditunjukin nilainya. Oiya aku lupa setiap 30 hari sekali pas dia liat hasil rapot. Jika Ai menghitung semuanya dan menurut Ainya dia siap untuk menaiki levelnya untuk lebih baik. Maka dia bakal dikasih tombol "Aku siap naik level!" Maka Ai bakal nyesusaiin untuk menaikan level dan cara atur duitnya dan bakal ditaro hasil kalkulasinya di sheet 1 alias sheet yang disarankan. Nah beda nih ceritanya kalo dia milih "Belum siap" Dia bakal dipindahin kehalaman selanjutnya dan dikasih kolom yang dimana dia harus jelasin kenapa alasannya dia tidak mau naik level atau disesuaikan lagi agar bisa jadi lebih baik. Pokoknya dia jelasin faktor-faktornya. Lalu ketika dia pencet "halaman berikutnya". Ad kolom yang dimana dia harus kasih tau apa cara ngatur duit yang kayak gimana sih agar dia nyaman dan relevan untuk kondisi dia. Dan Untuk Ainya nama Ainya Barbaya yaa.

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirements Document for money-trackes

1. Introduction

money-trackes adalah aplikasi money-tracker berbahasa Indonesia yang dirancang agar terasa asik dan menyenangkan, bukan seperti audit keuangan yang menakutkan. Produk ini menyasar pengguna baru — pekerja muda dan keluarga baru di Indonesia — yang cemas soal uang dan ingin dibimbing pelan-pelan, bukan dihakimi.

Inti produk: pengguna membuat akun, menjawab rangkaian pertanyaan awal tentang gaji, status keluarga, kebutuhan, keluh kesah, emosi, masalah, dan tujuan beberapa tahun ke depan. AI mengalkulasi semuanya secara matang, lalu membimbing secara bertahap — pengguna boros diajari mengatur uang dengan cara yang seru, pengguna yang terlalu hemat diarahkan agar tidak menyakiti dirinya sendiri. Setelah itu pengguna masuk ke home page dengan dua sheet: Sheet 1 berisi kalkulasi AI yang disesuaikan sifat dan kebutuhan pengguna, Sheet 2 berisi isi pengeluaran pengguna.

Produk juga menghadirkan Barbaya, AI berwujud burung hantu yang lucu, menggemaskan, dan pintar ekonomi, yang menyesuaikan gaya bahasa pengguna saat pertama kali chat dan direset setiap 30 hari. Setiap 30 hari saat membuka aplikasi/web, pengguna otomatis masuk ke rapot berisi nilai, emoji sesuai nilai, statistik pengeluaran, saran perbaikan, dan tips hemat modern. Rapot tersimpan ke history per bulan hingga bulan ke-12, dan pengguna dapat memutuskan naik level atau menjelaskan alasan belum siap.

Audiens: pengguna konsumen mobile-first di Indonesia yang baru pertama kali mengatur keuangan, termasuk pengguna baru (calon pengguna) dan pengguna aktif yang mengelola keuangan harian.

Page 1 of 44

2. System Overview

money-trackes adalah aplikasi web mobile-first dengan backend yang menangani identitas aplikasi, penyimpanan durable, otomasi siklus (notifikasi harian, reset chat 30 hari, pembukaan rapot 30 hari, reset bulan ke-12), dan pemanggilan AI untuk kalkulasi personal serta percakapan Barbaya.

Aktor manusia (closed set):

  • Pengguna Baru (Calon Pengguna)
  • Pengguna Aktif (Money-Tracker)
  • Pengguna yang Mengevaluasi Rapot & Naik Level

Aktor non-persona: layanan AI (kalkulasi & Barbaya), sumber berita ekonomi eksternal, sumber data investasi/pasar (emas, reksadana, saham), sumber tips hemat (sosial media/sumber lain), dan proses otomasi terjadwal milik sistem.

Perilaku yang diterima (ringkas): pendaftaran/login, onboarding pertanyaan awal, kalkulasi AI personal, home page dengan dua sheet, notifikasi ekonomi & investasi dengan sumber jelas dan siklus harian 2 notifikasi (reset bila > 20), chat Barbaya dengan adaptasi gaya bahasa dan reset 30 hari, rapot otomatis 30 hari dengan nilai + emoji + statistik + saran + tips, tombol "Mulai Kembali!" yang mereset siklus namun menyimpan data pengguna dan rapot sebelumnya, history rapot per bulan hingga bulan ke-12, serta alur naik level ("Aku siap naik level!" / "Belum siap" → Level Feedback → Money Preferences).

Kepemilikan: seluruh permukaan interaktif dimiliki aplikasi (custom UI). Identitas dimiliki aplikasi (app-owned identity). Berita ekonomi, data investasi, dan tips hemat berasal dari sumber eksternal dan ditampilkan dengan sitasi sumber.

Page 2 of 44

Pengecualian sempit: tidak ada modul akuntansi perusahaan, tidak ada integrasi rekening bank otomatis, tidak ada fitur sosial/berbagi antar pengguna, dan tidak ada kontrol izin berbasis peran — semua pengguna terautentikasi memiliki akses penuh ke data keuangannya sendiri.

2a. Product Interpretation and Delivery Boundary

Kepemilikan delivery & akses. money-trackes memiliki identitas aplikasi sendiri: pengguna mendaftar mandiri (self-service sign up) dan memverifikasi identitas saat kembali. Landing dapat diakses tanpa identitas; seluruh permukaan kerja (Onboarding, home page, Notifications, Barbaya, rapot, Level Feedback, Money Preferences, History rapot) memerlukan login. Identitas diperlukan karena produk menyimpan state durable yang terikat pada satu pengguna: profil onboarding, pengeluaran, percakapan Barbaya, rapot bulanan, dan rekomendasi AI. Tidak ada peran atau izin berbeda — setiap pengguna hanya melihat dan mengubah datanya sendiri.

Batas current vs future. Semua fitur yang disebutkan di atas adalah current. Tidak ada fitur future yang diminta secara eksplisit dalam sumber; bagian future sengaja dibiarkan kosong agar tidak menambah cakupan.

Kepemilikan eksternal. Berita ekonomi nasional/global, peringatan saham/investasi (emas, reksadana, saham, dan lainnya), serta tips hemat dari sosial media/sumber lain adalah konten yang berasal dari sumber eksternal. Aplikasi menampilkan konten tersebut beserta sitasi sumbernya; aplikasi tidak memproduksi berita atau data pasar itu sendiri. Kalkulasi personal, penilaian rapot, dan percakapan Barbaya adalah tanggung jawab AI yang diorkestrasi aplikasi.

2b. Source Content Inventory

Tidak ada direktif referensi dengan content_source pada permintaan ini, sehingga tidak ada Source Content Inventory yang disertakan.

Page 3 of 44

2c. Page Content and Component Coverage

Landing

  • Informasi/state: penjelasan singkat money-tracker, siapa calon penggunanya, dan manfaat pengelolaan uang sebelum identitas dibuat; pratinjau visual produk (chip notifikasi dengan sitasi sumber, kartu rapot dengan emoji, mini rencana Sheet 1).
  • Aksi utama: "Mulai kenalan sama Barbaya" (menuju Sign Up and Login untuk membuat akun).
  • Aksi pendukung: tautan "Login" (menuju Sign Up and Login untuk verifikasi pengguna kembali).
  • Entitas domain: tidak ada data pengguna; hanya konten pengantar.
  • Tanggung jawab komponen: hero ilustratif dengan Barbaya; headline besar; CTA pilled; tautan login; tumpukan kartu pratinjau (desktop).
  • State: loading (konten pengantar dimuat), empty (tidak berlaku — konten statis), success (halaman tampil), error (gagal memuat aset → tampilkan fallback teks + CTA tetap berfungsi), recovery (CTA tetap dapat ditekan meski aset gagal).
Page 4 of 44

Sign Up and Login

  • Informasi/state: satu permukaan kohesif untuk pendaftaran pengguna baru dan verifikasi pengguna yang kembali; pemilihan avatar modular (rambut, warna kulit, pakaian) saat pendaftaran.
  • Aksi utama: buat akun (pendaftaran mandiri); login (verifikasi pengguna kembali).
  • Aksi pendukung: beralih antara mode daftar dan login; memilih/mengganti avatar.
  • Entitas domain: kredensial akun, profil avatar pengguna.
  • Tanggung jawab komponen: form daftar, form login, pemilih avatar modular, validasi input, pesan error inline.
  • State: loading (proses submit), empty (form kosong), success (akun dibuat → Onboarding; login berhasil → home page atau rapot bila siklus 30 hari tercapai), error (kredensial salah, email sudah terdaftar, input tidak valid → pesan jelas + form tetap terisi), recovery (pengguna dapat memperbaiki input dan submit ulang).
Page 5 of 44

Onboarding

  • Informasi/state: rangkaian pertanyaan awal satu per satu — besaran gaji; status sudah berkeluarga atau belum; kotak untuk menuliskan kebutuhan; keluh kesah, emosi, dan masalah yang sering dialami; tujuan pengguna beberapa tahun ke depan.
  • Aksi utama: menjawab setiap pertanyaan dan melanjutkan ke pertanyaan berikutnya; menyelesaikan seluruh rangkaian.
  • Aksi pendukung: kembali ke pertanyaan sebelumnya; mengedit jawaban sebelum submit akhir.
  • Entitas domain: profil onboarding (gaji, status keluarga, daftar kebutuhan, keluh kesah/emosi/masalah, tujuan multi-tahun).
  • Tanggung jawab komponen: satu pertanyaan per layar dengan prompt ilustratif besar; CTA pilled tunggal di bawah; indikator progres; kotak teks bebas untuk kebutuhan, keluh kesah/emosi/masalah, dan tujuan.
  • State: loading (menyimpan jawaban), empty (belum ada jawaban pada pertanyaan aktif), success (seluruh jawaban tersimpan → kalkulasi AI → home page), error (gagal menyimpan jawaban → tawarkan coba lagi tanpa kehilangan input), recovery (jawaban sebelumnya tetap tersimpan sehingga pengguna dapat melanjutkan).
Page 6 of 44

home page

  • Informasi/state: dua sheet yang dapat digeser — Sheet 1 "Rencana Barbaya" berisi kalkulasi AI yang disesuaikan sifat dan kebutuhan pengguna (termasuk hasil kalkulasi naik level bila ada); Sheet 2 "Pengeluaranku" berisi isi pengeluaran pengguna.
  • Aksi utama: beralih antara Sheet 1 dan Sheet 2; mencatat pengeluaran baru di Sheet 2.
  • Aksi pendukung: melihat rincian kalkulasi AI di Sheet 1; mengedit/menghapus catatan pengeluaran.
  • Entitas domain: rencana AI (kalkulasi personal), catatan pengeluaran (kategori seperti liburan, kebutuhan pokok, sekolah anak, dan lainnya, beserta nominal).
  • Tanggung jawab komponen: tab-pill switcher dua sheet; kartu deck Sheet 1; daftar/form pengeluaran Sheet 2; avatar Barbaya di sudut sebagai elemen hidup.
  • State: loading (memuat rencana dan pengeluaran), empty (Sheet 1 belum ada rencana → tampilkan ajakan menyelesaikan onboarding; Sheet 2 belum ada pengeluaran → ilustrasi empty state), success (rencana dan daftar pengeluaran tampil), error (gagal memuat/menyimpan → pesan + coba lagi), recovery (input pengeluaran yang gagal disimpan tetap tersedia untuk dicoba ulang).
Page 7 of 44

Notifications

  • Informasi/state: feed notifikasi berisi berita ekonomi nasional dan global dengan sumber yang jelas, serta peringatan tentang saham/investasi (emas, reksadana, saham, dan lainnya); setiap chip menampilkan dot-code warna (coral = peringatan pengeluaran, hijau = investasi naik, amber = berita/ekonomi, clay = sistem) dan baris sitasi sumber.
  • Aksi utama: membaca notifikasi dan membuka detail/sumber.
  • Aksi pendukung: menandai sudah dibaca; melihat sitasi sumber.
  • Entitas domain: item notifikasi (judul, isi, kategori, sumber, waktu), peringatan investasi (jenis instrumen, arah perubahan).
  • Tanggung jawab komponen: daftar chip notifikasi dengan dot-code; baris sumber 13px clay; rail kanan di 1280px / bottom sheet di 375px.
  • State: loading (memuat feed), empty (belum ada notifikasi → ilustrasi empty state), success (feed tampil dengan sumber), error (gagal memuat berita/investasi → tampilkan item yang tersedia + pesan sumber tidak tersedia), recovery (coba muat ulang; item tanpa sumber tidak ditampilkan).
Page 8 of 44

Barbaya

  • Informasi/state: ruang percakapan dengan AI Barbaya — burung hantu lucu, menggemaskan, pintar ekonomi — yang menyesuaikan gaya bahasa pengguna saat pertama kali chat; riwayat chat direset setiap 30 hari.
  • Aksi utama: mengirim pesan dan menerima balasan Barbaya.
  • Aksi pendukung: melihat riwayat percakapan dalam siklus berjalan; memulai percakapan baru.
  • Entitas domain: pesan percakapan (pengirim, isi, waktu), preferensi gaya bahasa pengguna, siklus chat 30 hari.
  • Tanggung jawab komponen: jendela chat; avatar Barbaya dengan scarf yang berubah warna sesuai register emosi (coral = peringatan lembut, hijau = pujian, butter = mengajar); indikator siklus reset.
  • State: loading (Barbaya sedang menyusun balasan), empty (belum ada chat → sapaan pembuka Barbaya), success (balasan tampil), error (gagal mendapat balasan → pesan + coba kirim ulang), recovery (pesan pengguna tetap tampil dan dapat dikirim ulang).
Page 9 of 44

rapot

  • Informasi/state: rapot berkala berisi nilai beserta emoji yang diberikan sesuai nilai; statistik pengeluaran pengguna (ke mana uang lebih banyak keluar — liburan, kebutuhan pokok, sekolah anak, dan lainnya); saran AI untuk terus improve (misalnya menambah income atau menaikkan gaji); tips and trick modern cara hemat yang diambil dari sosial media atau sumber lainnya; tombol "Mulai Kembali!"; tombol "Aku siap naik level!" bila AI menilai pengguna siap; tombol "Belum siap".
  • Aksi utama: membaca nilai, emoji, statistik, saran, dan tips; memutuskan naik level atau belum siap; menekan "Mulai Kembali!".
  • Aksi pendukung: membuka History rapot; melihat sitasi sumber tips.
  • Entitas domain: rapot bulanan (nilai, emoji, statistik pengeluaran per kategori, saran, tips + sumber), status kesiapan naik level, siklus 30 hari.
  • Tanggung jawab komponen: kartu rapot bergaya stiker kertas sobek dengan skor besar dan emoji; blok statistik pengeluaran; blok saran; blok tips dengan sitasi; tombol keputusan; tombol "Mulai Kembali!".
  • State: loading (AI mengalkulasi rapot), empty (belum ada data cukup untuk rapot → pesan bahwa rapot muncul setelah siklus berjalan), success (rapot tampil dengan nilai + emoji + statistik + saran + tips), error (kalkulasi gagal → pesan + coba lagi), recovery (rapot sebelumnya tetap dapat dilihat di History rapot).
Page 10 of 44

Level Feedback

  • Informasi/state: halaman lanjutan setelah pengguna memilih "Belum siap"; berisi kolom tempat pengguna menjelaskan alasan/faktor mengapa tidak mau naik level atau ingin disesuaikan lagi agar lebih baik.
  • Aksi utama: mengisi kolom alasan/faktor dan melanjutkan ke halaman berikutnya.
  • Aksi pendukung: kembali ke rapot.
  • Entitas domain: umpan balik alasan/faktor penolakan naik level.
  • Tanggung jawab komponen: kolom teks penjelasan; CTA "halaman berikutnya".
  • State: loading (menyimpan umpan balik), empty (kolom kosong), success (umpan balik tersimpan → Money Preferences), error (gagal menyimpan → coba lagi tanpa kehilangan teks), recovery (teks tetap tersimpan di form).

Money Preferences

  • Informasi/state: kolom tempat pengguna memberi tahu cara mengatur uang yang nyaman dan relevan untuk kondisinya, setelah umpan balik level.
  • Aksi utama: mengisi preferensi cara mengatur uang dan menyelesaikannya.
  • Aksi pendukung: kembali ke Level Feedback.
  • Entitas domain: preferensi cara mengatur uang pengguna.
  • Tanggung jawab komponen: kolom teks preferensi; CTA selesai.
  • State: loading (menyimpan preferensi), empty (kolom kosong), success (preferensi tersimpan → AI menyesuaikan rencana di Sheet 1), error (gagal menyimpan → coba lagi), recovery (teks tetap tersimpan di form).
Page 11 of 44

History rapot

  • Informasi/state: daftar rapot per bulan (bulan ke-1, bulan ke-2, dan seterusnya) dengan nilai dan perkembangan; nilai tetap ditampilkan walau belum mencapai bulan ke-12; misalnya rapot bulan ke-1 sampai ke-5 dikalkulasi dalam sebuah kolom dan ditunjukkan nilainya; hingga bulan ke-12 ditampilkan kalkulasi nilai dan perkembangannya, ke mana uangnya pergi, dan apa yang masih harus diperbaiki.
  • Aksi utama: membuka rapot bulan tertentu untuk melihat detail.
  • Aksi pendukung: menggulir strip kartu rapot bulanan; melihat ringkasan kalkulasi agregat.
  • Entitas domain: riwayat rapot bulanan (bulan, nilai, emoji, statistik, catatan perbaikan), ringkasan agregat bulan ke-1..N.
  • Tanggung jawab komponen: strip horizontal kartu rapot bulanan (skor + emoji + verdict satu baris); kolom kalkulasi agregat; penanda siklus 12 bulan.
  • State: loading (memuat riwayat), empty (belum ada rapot → pesan bahwa rapot muncul setelah siklus pertama), success (riwayat tampil, termasuk siklus yang belum 12 bulan), error (gagal memuat → coba lagi), recovery (rapot yang sudah dimuat tetap tampil).
Page 12 of 44

3. Functional Requirements

Setiap requirement diberi label provenance: explicit (dinyatakan sumber), basic_default (default yang diterima), atau required_inference (mekanika yang wajib agar journey berjalan).

FR-01 — Pendaftaran akun baru explicit As a Pengguna Baru (Calon Pengguna), I should dapat membuat akun baru dari Landing melalui Sign Up and Login, agar saya bisa mulai memakai money-tracker.

  • Trigger/input: menekan CTA di Landing, mengisi kredensial, memilih avatar modular.
  • Hasil teramati: akun dibuat dan pengguna diarahkan ke Onboarding.
  • Access state: anonim di Landing/Sign Up and Login; setelah akun dibuat, sesi terautentikasi aktif.
  • Failure/recovery: email sudah terdaftar atau input tidak valid → pesan error inline, form tetap terisi, pengguna dapat memperbaiki dan submit ulang.
  • Continuation: pengguna melanjutkan ke Onboarding.

FR-02 — Login pengguna kembali explicit As a Pengguna Aktif (Money-Tracker), I should dapat login untuk memverifikasi identitas saya saat kembali, agar data keuangan pribadi saya tetap terikat pada saya.

  • Trigger/input: menekan tautan "Login" di Landing, memasukkan kredensial.
  • Hasil teramati: sesi terautentikasi aktif; pengguna diarahkan ke home page, atau otomatis ke rapot bila siklus 30 hari tercapai.
  • Access state: anonim sebelum login; terautentikasi setelah login.
  • Failure/recovery: kredensial salah → pesan error, form tetap terisi, dapat coba lagi.
  • Continuation: masuk ke home page atau rapot.
Page 13 of 44

FR-03 — Rangkaian pertanyaan awal (onboarding) explicit As a Pengguna Baru (Calon Pengguna), I should menjawab pertanyaan awal secara berurutan — gajinya berapa, sudah berkeluarga atau belum, kotak untuk menulis apa saja kebutuhannya, keluh kesah dan emosi serta masalah yang sering dialami, dan tujuan beberapa tahun ke depan — agar AI dapat mengalkulasi rencana yang sesuai.

  • Trigger/input: setelah akun dibuat, pengguna masuk ke Onboarding; menjawab satu pertanyaan per layar.
  • Hasil teramati: seluruh jawaban tersimpan sebagai profil onboarding.
  • Access state: login.
  • Failure/recovery: gagal menyimpan jawaban → tawarkan coba lagi tanpa kehilangan input; jawaban sebelumnya tetap tersimpan.
  • Continuation: setelah semua pertanyaan selesai, AI mengalkulasi dan pengguna masuk ke home page.

FR-04 — Kalkulasi AI personal dan arahan bertahap explicit As a Pengguna Baru (Calon Pengguna), I should menerima kalkulasi AI yang matang atas seluruh jawaban saya, dengan arahan bertahap — jika saya boros, saya diajari pelan-pelan mengatur uang dengan cara yang have fun dan seru; jika saya terlalu hemat, saya diarahkan agar tidak terlalu hemat dan tidak menyakiti diri sendiri — agar saya belajar mengatur uang sesuai sifat dan kebutuhan saya.

  • Trigger/input: penyelesaian Onboarding.
  • Hasil teramati: rencana personal tersimpan dan ditampilkan di Sheet 1 home page.
  • Access state: login.
  • Failure/recovery: kalkulasi gagal → pengguna diberi tahu dan dapat memicu ulang; jawaban onboarding tetap tersimpan.
  • Continuation: pengguna masuk ke home page dan melihat Sheet 1.
Page 14 of 44

FR-05 — Home page dengan dua sheet explicit As a Pengguna Aktif (Money-Tracker), I should melihat home page dengan dua sheet — Sheet 1 berisi kalkulasi AI yang disesuaikan sifat dan kebutuhan saya, Sheet 2 berisi isi pengeluaran saya — agar saya dapat membandingkan rencana dan realisasi.

  • Trigger/input: membuka home page; beralih tab antara Sheet 1 dan Sheet 2.
  • Hasil teramati: Sheet 1 menampilkan rencana AI; Sheet 2 menampilkan daftar pengeluaran.
  • Access state: login.
  • Failure/recovery: gagal memuat salah satu sheet → pesan + coba lagi; sheet lain tetap dapat dilihat.
  • Continuation: pengguna dapat mencatat pengeluaran atau kembali melihat rencana.

FR-06 — Pencatatan pengeluaran di Sheet 2 explicit As a Pengguna Aktif (Money-Tracker), I should mencatat pengeluaran saya di Sheet 2, agar isi pengeluaran saya tercatat dan dapat dianalisis.

  • Trigger/input: menambah catatan pengeluaran (kategori seperti liburan, kebutuhan pokok, sekolah anak, dan lainnya, beserta nominal).
  • Hasil teramati: catatan pengeluaran tersimpan dan tampil di Sheet 2.
  • Access state: login.
  • Failure/recovery: gagal menyimpan → input tetap tersedia untuk dicoba ulang.
  • Continuation: pengguna dapat menambah catatan lain atau melihat Sheet 1.
Page 15 of 44

FR-07 — Notifikasi berita ekonomi bersumber jelas explicit As a Pengguna Aktif (Money-Tracker), I should menerima notifikasi berisi berita seputar ekonomi nasional maupun skala global dengan sumber yang jelas, agar saya tahu dari mana informasinya berasal.

  • Trigger/input: feed notifikasi dimuat; item berita dari sumber eksternal.
  • Hasil teramati: chip notifikasi menampilkan headline dan baris sitasi sumber.
  • Access state: login.
  • Failure/recovery: sumber tidak tersedia → item tanpa sumber tidak ditampilkan; pengguna dapat memuat ulang.
  • Continuation: pengguna membaca notifikasi lain atau membuka detail.

FR-08 — Notifikasi peringatan saham/investasi explicit As a Pengguna Aktif (Money-Tracker), I should menerima notifikasi peringatan tentang saham atau investasi — mau itu emas, reksadana, saham, apapun itu — agar saya waspada terhadap pergerakan investasi saya.

  • Trigger/input: data investasi/pasar dari sumber eksternal.
  • Hasil teramati: chip peringatan investasi dengan dot-code hijau (investasi naik) atau coral (peringatan) dan sitasi sumber.
  • Access state: login.
  • Failure/recovery: data pasar gagal dimuat → tampilkan item yang tersedia + pesan; pengguna dapat memuat ulang.
  • Continuation: pengguna membaca peringatan lain.
Page 16 of 44

FR-09 — Siklus notifikasi harian 2x dan reset > 20 explicit As a Pengguna Aktif (Money-Tracker), I should menerima 2 notifikasi setiap hari, dengan catatan jika notifikasi lebih dari 20 maka notifikasinya direset/dihapus, agar feed tetap ringkas dan tidak menumpuk.

  • Trigger/input: penjadwalan harian oleh sistem; penghitungan jumlah notifikasi.
  • Hasil teramati: 2 notifikasi baru per hari; ketika jumlah melebihi 20, notifikasi direset/dihapus.
  • Access state: login (feed hanya terlihat saat login).
  • Failure/recovery: kegagalan penjadwalan → notifikasi berikutnya tetap dikirim pada jadwal berikutnya; feed tetap dapat dibuka.
  • Continuation: pengguna melihat feed terbaru.

FR-10 — Barbaya sebagai AI burung hantu explicit As a Pengguna Aktif (Money-Tracker), I should berinteraksi dengan AI bernama Barbaya — burung hantu yang lucu, menggemaskan, dan pintar ekonomi — yang menyesuaikan gaya bahasa saya saat pertama kali chat, agar saya merasa ditemani, bukan diaudit.

  • Trigger/input: membuka Barbaya dan mengirim pesan pertama.
  • Hasil teramati: Barbaya membalas dengan gaya bahasa yang menyesuaikan gaya bahasa pengguna; avatar Barbaya dengan scarf berwarna sesuai register emosi.
  • Access state: login.
  • Failure/recovery: gagal mendapat balasan → pesan + coba kirim ulang; pesan pengguna tetap tampil.
  • Continuation: pengguna melanjutkan percakapan.
Page 17 of 44

FR-11 — Reset chat Barbaya setiap 30 hari explicit As a Pengguna Aktif (Money-Tracker), I should mengalami reset chat Barbaya setiap 30 hari, agar percakapan dimulai segar pada siklus baru.

  • Trigger/input: siklus 30 hari tercapai.
  • Hasil teramati: riwayat chat direset; pengguna dapat memulai percakapan baru dengan Barbaya.
  • Access state: login.
  • Failure/recovery: kegagalan reset → percakapan lama tetap dapat diakses sampai reset berhasil pada percobaan berikutnya.
  • Continuation: pengguna memulai percakapan baru.

FR-12 — Pembukaan rapot otomatis setiap 30 hari explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should otomatis masuk ke rapot setiap 30 hari ketika membuka aplikasi/web, agar saya langsung melihat evaluasi berkala saya.

  • Trigger/input: pengguna membuka aplikasi/web pada/atau setelah siklus 30 hari.
  • Hasil teramati: pengguna diarahkan ke rapot.
  • Access state: login.
  • Failure/recovery: kalkulasi rapot gagal → pengguna diberi tahu dan dapat mencoba lagi; rapot sebelumnya tetap dapat dilihat di History rapot.
  • Continuation: pengguna membaca rapot dan memutuskan naik level atau belum siap.
Page 18 of 44

FR-13 — Isi rapot explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should melihat rapot berisi nilai beserta emoji yang diberikan sesuai nilai, statistik pengeluaran saya (ke mana uang lebih banyak keluar — liburan, kebutuhan pokok, sekolah anak, dan apapun itu), saran AI agar bisa improve dan terus improve seperti memberi tahu agar income bertambah atau gaji naik, serta tips and trick modern cara hemat yang diambil dari sosial media atau sumber lainnya, agar saya tahu apa yang harus diperbaiki.

  • Trigger/input: pembukaan rapot pada siklus 30 hari.
  • Hasil teramati: kartu rapot menampilkan nilai + emoji, blok statistik pengeluaran per kategori, blok saran, dan blok tips dengan sitasi sumber.
  • Access state: login.
  • Failure/recovery: kalkulasi gagal → pesan + coba lagi; rapot sebelumnya tetap dapat dilihat.
  • Continuation: pengguna memutuskan naik level atau belum siap.

FR-14 — Tombol "Mulai Kembali!" explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should menekan tombol "Mulai Kembali!" untuk mereset kembali seperti semula, namun dengan data pengguna dan rapot sebelumnya disimpan AI sebagai data pengguna, agar siklus baru dimulai tanpa kehilangan riwayat.

  • Trigger/input: menekan "Mulai Kembali!" di rapot.
  • Hasil teramati: siklus direset seperti semula; data pengguna dan rapot sebelumnya tetap tersimpan sebagai data pengguna.
  • Access state: login.
  • Failure/recovery: gagal menyimpan data sebelum reset → reset ditunda dan pengguna diberi tahu agar data tidak hilang.
  • Continuation: pengguna memulai siklus baru dengan data lama tetap tersimpan.
Page 19 of 44

FR-15 — Fitur lihat rapot dan history per bulan explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should membuka fitur lihat rapot yang setiap kali ditekan masuk ke history rapot dan ditampilkan hasil rapotnya per bulan (bulan ke-1, bulan ke-2, dan seterusnya), agar saya bisa melihat perubahan saya.

  • Trigger/input: menekan fitur lihat rapot.
  • Hasil teramati: History rapot menampilkan rapot per bulan.
  • Access state: login.
  • Failure/recovery: gagal memuat → coba lagi; rapot yang sudah dimuat tetap tampil.
  • Continuation: pengguna membuka bulan tertentu atau kembali ke rapot berjalan.

FR-16 — Nilai tetap tampil walau belum bulan ke-12 explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should tetap melihat nilai saya di History rapot walau belum mencapai bulan ke-12, misalnya rapot bulan ke-1 sampai ke-5 dikalkulasi dalam sebuah kolom dan ditunjukkan nilainya, agar saya bisa melihat perubahan saya lebih awal.

  • Trigger/input: membuka History rapot dengan jumlah bulan < 12.
  • Hasil teramati: kolom kalkulasi agregat menampilkan nilai dan perkembangan bulan ke-1..N.
  • Access state: login.
  • Failure/recovery: gagal kalkulasi agregat → tampilkan rapot bulanan individual yang tersedia + pesan.
  • Continuation: pengguna terus memantau perkembangan.
Page 20 of 44

FR-17 — Reset dan kalkulasi pada bulan ke-12 explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should melihat bahwa sampai bulan ke-12 rapot akan direset dan ditunjukkan kalkulasi nilai dan perkembangannya, ke mana uangnya pergi, dan apa yang masih harus diperbaiki, agar siklus 12 bulan ditutup dengan evaluasi lengkap.

  • Trigger/input: pencapaian bulan ke-12.
  • Hasil teramati: rapot direset; kalkulasi nilai dan perkembangan, arah uang, dan daftar perbaikan ditampilkan.
  • Access state: login.
  • Failure/recovery: gagal kalkulasi → pesan + coba lagi; riwayat bulan sebelumnya tetap tersimpan.
  • Continuation: pengguna memulai siklus 12 bulan berikutnya.

FR-18 — Tombol "Aku siap naik level!" explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should, ketika AI menghitung semuanya dan menilai saya siap naik level, mendapat tombol "Aku siap naik level!" yang membuat AI menyesuaikan kenaikan level dan cara mengatur uang, dengan hasil kalkulasinya ditaruh di Sheet 1, agar saya naik ke level yang lebih baik.

  • Trigger/input: penilaian AI bahwa pengguna siap; menekan "Aku siap naik level!".
  • Hasil teramati: AI menyesuaikan level dan cara mengatur uang; hasil kalkulasi tampil di Sheet 1.
  • Access state: login.
  • Failure/recovery: gagal menyimpan penyesuaian → pesan + coba lagi; level lama tetap berlaku sampai berhasil.
  • Continuation: pengguna melihat Sheet 1 yang diperbarui.
Page 21 of 44

FR-19 — Pilihan "Belum siap" dan Level Feedback explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should, jika saya memilih "Belum siap", dipindahkan ke halaman selanjutnya dan diberi kolom untuk menjelaskan alasan/faktor mengapa saya tidak mau naik level atau ingin disesuaikan lagi agar lebih baik, agar penyesuaian tetap relevan dengan kondisi saya.

  • Trigger/input: menekan "Belum siap" di rapot.
  • Hasil teramati: pengguna diarahkan ke Level Feedback dengan kolom penjelasan.
  • Access state: login.
  • Failure/recovery: gagal menyimpan umpan balik → coba lagi tanpa kehilangan teks.
  • Continuation: pengguna menekan "halaman berikutnya" menuju Money Preferences.

FR-20 — Money Preferences setelah umpan balik level explicit As a Pengguna yang Mengevaluasi Rapot & Naik Level, I should, setelah menekan "halaman berikutnya", mendapat kolom untuk memberi tahu cara mengatur uang yang nyaman dan relevan untuk kondisi saya, agar AI dapat menyesuaikan rencana sesuai preferensi saya.

  • Trigger/input: menekan "halaman berikutnya" dari Level Feedback; mengisi kolom preferensi.
  • Hasil teramati: preferensi tersimpan dan AI menyesuaikan rencana di Sheet 1.
  • Access state: login.
  • Failure/recovery: gagal menyimpan → coba lagi; teks tetap tersimpan di form.
  • Continuation: pengguna kembali ke home page dan melihat Sheet 1 yang disesuaikan.
Page 22 of 44

FR-21 — Penyimpanan durable state pengguna required_inference As a Pengguna Aktif (Money-Tracker), I should memiliki profil, pengeluaran, percakapan Barbaya, rapot, dan rekomendasi yang tersimpan secara durable, agar data saya tetap ada saat saya kembali.

  • Trigger/input: setiap penyimpanan data pengguna.
  • Hasil teramati: data tersimpan dan dapat dimuat kembali pada sesi berikutnya.
  • Access state: login.
  • Failure/recovery: kegagalan penyimpanan → pesan + coba lagi; data lama tetap utuh.
  • Continuation: pengguna melanjutkan pekerjaannya.

FR-22 — Otomasi siklus terjadwal required_inference As a Pengguna Aktif (Money-Tracker), I should mengalami otomasi siklus — notifikasi harian, reset chat 30 hari, pembukaan rapot 30 hari, dan reset bulan ke-12 — agar siklus berjalan tanpa saya harus memicunya.

  • Trigger/input: penjadwalan sistem.
  • Hasil teramati: notifikasi harian terkirim, chat direset pada 30 hari, rapot dibuka otomatis pada 30 hari, rapot direset pada bulan ke-12.
  • Access state: login (efek terlihat saat pengguna login).
  • Failure/recovery: kegagalan satu siklus → siklus berikutnya tetap berjalan; pengguna dapat memicu ulang secara manual bila perlu.
  • Continuation: pengguna melanjutkan penggunaan normal.

4. User Personas

Page 23 of 44

Pengguna Baru (Calon Pengguna)

  • Konteks produk: orang yang belum punya akun dan ingin mulai memakai money-tracker. Ia datang dari Landing, penasaran tapi juga cemas soal uang.
  • Tujuan utama: membuat akun dan menyelesaikan pertanyaan awal agar AI dapat mengalkulasi rencana pengaturan uang yang sesuai sifat dan kebutuhannya.
  • Tanggung jawab yang diterima: membuat akun atau login; menjawab rangkaian pertanyaan awal (gaji, status keluarga, daftar kebutuhan, keluh kesah/emosi/masalah, tujuan beberapa tahun ke depan); menerima kalkulasi AI dan arahan bertahap.
  • Input/keputusan: besaran gaji; status sudah berkeluarga atau belum; daftar kebutuhan; keluh kesah, emosi, dan masalah yang sering dialami; tujuan beberapa tahun ke depan; pemilihan avatar.
  • Interaksi dengan peserta lain: berinteraksi dengan AI (kalkulasi) dan dengan sistem identitas (pendaftaran). Ia belum berinteraksi dengan rapot atau Barbaya sampai onboarding selesai.
  • Keberhasilan teramati: akun dibuat, seluruh jawaban tersimpan, kalkulasi AI tampil di Sheet 1, dan ia masuk ke home page.
Page 24 of 44

Pengguna Aktif (Money-Tracker)

  • Konteks produk: pengguna yang sudah punya akun dan mengelola keuangannya sehari-hari. Ia sudah melewati onboarding dan kini bekerja dengan rencana dan realisasi.
  • Tujuan utama: menjaga rencana AI tetap relevan sambil mencatat pengeluaran nyata, dan merasa ditemani oleh Barbaya.
  • Tanggung jawab yang diterima: melihat Sheet 1 berisi kalkulasi AI yang disesuaikan sifat dan kebutuhannya; mencatat pengeluaran di Sheet 2; menerima notifikasi harian berisi berita ekonomi bersumber jelas dan peringatan saham/investasi; berinteraksi dengan Barbaya yang menyesuaikan gaya bahasa dan direset setiap 30 hari.
  • Input/keputusan: catatan pengeluaran (kategori dan nominal); pesan chat ke Barbaya; membaca/mengabaikan notifikasi.
  • Interaksi dengan peserta lain: berinteraksi dengan Barbaya (AI), dengan sumber berita/investasi eksternal (melalui notifikasi), dan dengan sistem otomasi siklus.
  • Keberhasilan teramati: Sheet 1 dan Sheet 2 konsisten, pengeluaran tercatat, notifikasi terbaca dengan sumber jelas, dan percakapan Barbaya terasa sesuai gaya bahasanya.
Page 25 of 44

Pengguna yang Mengevaluasi Rapot & Naik Level

  • Konteks produk: pengguna aktif yang setiap 30 hari otomatis dibawa ke rapot. Ia berada di titik refleksi: melihat hasil, lalu memutuskan arah berikutnya.
  • Tujuan utama: memahami nilai dan perkembangan keuangannya, lalu memutuskan naik level atau menjelaskan mengapa belum siap, dan memastikan cara mengatur uang yang nyaman baginya.
  • Tanggung jawab yang diterima: membaca rapot berisi nilai, emoji, statistik pengeluaran, saran perbaikan, dan tips hemat; memutuskan lewat tombol "Aku siap naik level!" atau "Belum siap"; menjelaskan faktor alasan di Level Feedback; memberi tahu cara mengatur uang yang nyaman di Money Preferences; menekan "Mulai Kembali!" untuk mereset siklus sambil menyimpan data dan rapot sebelumnya; membuka History rapot untuk melihat nilai serta perkembangan bulan ke-1 hingga ke-12.
  • Input/keputusan: keputusan naik level; alasan/faktor penolakan; preferensi cara mengatur uang; keputusan reset siklus.
  • Interaksi dengan peserta lain: berinteraksi dengan AI (penilaian kesiapan dan penyesuaian level), dengan sistem otomasi (pembukaan rapot 30 hari dan reset bulan ke-12), dan dengan sumber tips eksternal (melalui sitasi).
  • Keberhasilan teramati: rapot terbaca, keputusan tercatat, rencana di Sheet 1 diperbarui sesuai keputusan, dan history menunjukkan perkembangan dari bulan ke bulan.

5. Core User Flows

Page 26 of 44

Flow 1 — Pengguna Baru membuat akun dan menyelesaikan onboarding

  1. Pengguna Baru (Calon Pengguna) membuka Landing (anonim) dan membaca penjelasan produk serta pratinjau kartu (chip notifikasi bersumber, kartu rapot, mini Sheet 1).
  2. Ia menekan CTA "Mulai kenalan sama Barbaya" dan masuk ke Sign Up and Login.
  3. Ia mengisi kredensial dan memilih avatar modular (rambut, warna kulit, pakaian).
  4. Hasil teramati: akun dibuat dan sesi terautentikasi aktif; ia diarahkan ke Onboarding.
  5. Kegagalan/recovery: jika email sudah terdaftar atau input tidak valid, pesan error inline muncul, form tetap terisi, dan ia dapat memperbaiki lalu submit ulang.
  6. Di Onboarding, ia menjawab satu pertanyaan per layar: gajinya berapa; sudah berkeluarga atau belum; kotak untuk menulis apa saja kebutuhannya; keluh kesah, emosi, dan masalah yang sering dialami; tujuan beberapa tahun ke depan.
  7. Hasil teramati: seluruh jawaban tersimpan sebagai profil onboarding.
  8. Kegagalan/recovery: jika penyimpanan gagal, ia dapat mencoba lagi tanpa kehilangan input; jawaban sebelumnya tetap tersimpan.
  9. Langkah berikutnya: AI mengalkulasi seluruh jawaban secara matang dan ia masuk ke home page dengan Sheet 1 berisi rencana personal.
Page 27 of 44

Flow 2 — Pengguna Aktif bekerja dengan dua sheet dan Barbaya

  1. Pengguna Aktif (Money-Tracker) login melalui Sign Up and Login dan masuk ke home page.
  2. Ia melihat Sheet 1 "Rencana Barbaya" berisi kalkulasi AI yang disesuaikan sifat dan kebutuhannya — jika ia boros, rencana mengajarinya pelan-pelan dengan cara have fun dan seru; jika ia terlalu hemat, rencana mengarahkannya agar tidak menyakiti diri sendiri.
  3. Ia beralih ke Sheet 2 "Pengeluaranku" dan mencatat pengeluaran (kategori seperti liburan, kebutuhan pokok, sekolah anak, dan lainnya, beserta nominal).
  4. Hasil teramati: catatan pengeluaran tersimpan dan tampil di Sheet 2.
  5. Kegagalan/recovery: jika penyimpanan gagal, input tetap tersedia untuk dicoba ulang.
  6. Ia membuka Barbaya dan mengirim pesan pertama; Barbaya menyesuaikan gaya bahasanya dan membalas dengan scarf berwarna sesuai register emosi (coral = peringatan lembut, hijau = pujian, butter = mengajar).
  7. Hasil teramati: percakapan berjalan; riwayat chat tersimpan dalam siklus berjalan.
  8. Kegagalan/recovery: jika balasan gagal, pesan pengguna tetap tampil dan dapat dikirim ulang.
  9. Langkah berikutnya: ia melanjutkan penggunaan harian; pada 30 hari, chat Barbaya direset dan ia dapat memulai percakapan baru.
Page 28 of 44

Flow 3 — Pengguna Aktif menerima notifikasi harian

  1. Pengguna Aktif (Money-Tracker) membuka Notifications.
  2. Ia membaca chip berita ekonomi nasional dan global; setiap chip menampilkan headline dan baris sitasi sumber di bagian bawah.
  3. Ia membaca chip peringatan saham/investasi (emas, reksadana, saham, dan lainnya) dengan dot-code hijau (investasi naik) atau coral (peringatan).
  4. Hasil teramati: feed menampilkan 2 notifikasi baru setiap hari; ketika jumlah notifikasi melebihi 20, notifikasi direset/dihapus.
  5. Kegagalan/recovery: jika sumber berita/investasi tidak tersedia, item tanpa sumber tidak ditampilkan dan ia dapat memuat ulang.
  6. Langkah berikutnya: ia kembali ke home page atau membuka Barbaya untuk membahas peringatan tersebut.
Page 29 of 44

Flow 4 — Pengguna yang Mengevaluasi Rapot & Naik Level: siklus 30 hari

  1. Setelah 30 hari, Pengguna yang Mengevaluasi Rapot & Naik Level membuka aplikasi/web dan otomatis masuk ke rapot.
  2. Ia membaca rapot: nilai beserta emoji sesuai nilai; statistik pengeluaran (ke mana uang lebih banyak keluar — liburan, kebutuhan pokok, sekolah anak, dan apapun itu); saran AI agar terus improve seperti menambah income atau menaikkan gaji; serta tips and trick modern cara hemat yang diambil dari sosial media atau sumber lainnya beserta sitasinya.
  3. Hasil teramati: rapot tampil lengkap dengan nilai, emoji, statistik, saran, dan tips.
  4. Kegagalan/recovery: jika kalkulasi gagal, ia diberi tahu dan dapat mencoba lagi; rapot sebelumnya tetap dapat dilihat di History rapot.
  5. Keputusan: jika AI menilai ia siap naik level, tombol "Aku siap naik level!" muncul.
    • Jika ia menekan "Aku siap naik level!": AI menyesuaikan kenaikan level dan cara mengatur uang, dan hasil kalkulasinya ditaruh di Sheet 1. Ia melihat Sheet 1 yang diperbarui.
    • Jika ia menekan "Belum siap": ia dipindahkan ke Level Feedback dan mengisi kolom alasan/faktor mengapa tidak mau naik level atau ingin disesuaikan lagi agar lebih baik.
  6. Langkah berikutnya (jalur "Belum siap"): ia menekan "halaman berikutnya" dan masuk ke Money Preferences, tempat ia memberi tahu cara mengatur uang yang nyaman dan relevan untuk kondisinya.
  7. Hasil teramati: preferensi tersimpan dan AI menyesuaikan rencana di Sheet 1.
  8. Kegagalan/recovery: jika penyimpanan umpan balik atau preferensi gagal, teks tetap tersimpan di form dan ia dapat mencoba lagi.
  9. Langkah berikutnya: ia kembali ke home page dan melihat Sheet 1 yang disesuaikan.
Page 30 of 44

Flow 5 — Pengguna yang Mengevaluasi Rapot & Naik Level: "Mulai Kembali!" dan History rapot

  1. Pengguna yang Mengevaluasi Rapot & Naik Level berada di rapot dan menekan tombol "Mulai Kembali!".
  2. Hasil teramati: siklus direset kembali seperti semula, namun data pengguna dan rapot sebelumnya disimpan AI sebagai data pengguna.
  3. Kegagalan/recovery: jika penyimpanan data sebelum reset gagal, reset ditunda dan ia diberi tahu agar data tidak hilang.
  4. Ia menekan fitur lihat rapot dan masuk ke History rapot.
  5. Ia melihat hasil rapot per bulan (bulan ke-1, bulan ke-2, dan seterusnya) sebagai strip kartu rapot bulanan dengan skor + emoji + verdict satu baris.
  6. Hasil teramati: nilai tetap ditampilkan walau belum mencapai bulan ke-12; misalnya rapot bulan ke-1 sampai ke-5 dikalkulasi dalam sebuah kolom dan ditunjukkan nilainya, sehingga ia bisa melihat perubahannya.
  7. Kegagalan/recovery: jika kalkulasi agregat gagal, rapot bulanan individual yang tersedia tetap ditampilkan dengan pesan.
  8. Langkah berikutnya: sampai bulan ke-12, rapot direset dan ditunjukkan kalkulasi nilai dan perkembangannya, ke mana uangnya pergi, dan apa yang masih harus diperbaiki; ia lalu memulai siklus 12 bulan berikutnya.
Page 31 of 44

6. Visuals Colors and Theme

Muse & headline: Pablo Stanley — "Uangmu bisa rapi. Pelan-pelan aja." Arah kreatif ini otoritatif untuk seluruh produk: hangat, manusiawi, sedikit lucu; money coaching yang terasa seperti teman, bukan bank.

Mode: light mode sebagai mode utama. Cream adalah tanah di mana-mana — tidak pernah putih-first.

Palet (light mode):

PeranHexPenggunaan
Background#FFF7ECGround cream di seluruh halaman
Surface#FFFFFFKartu, sheet, chip
Text#2B2118Warm ink untuk semua teks — tidak pernah hitam murni
Primary#FF6B4ACoral: CTA utama, ujung sayap Barbaya, stempel rapot, tab aktif
Accent#2F9E7CTeal-green: momen money-positive (income, savings, perayaan naik level)
Muted#8A7B6CClay: label, metadata, timestamp, sitasi sumber
Butter#FFD66BHanya isian ilustrasi (Barbaya mengajar)
Sky#7FB5E8Hanya isian ilustrasi
Blush#FFB3C7Hanya isian ilustrasi

Proporsi: cream 60%, kartu putih 25%, coral/green 10%, ilustrasi pastel 5%.

Dot-code notifikasi: coral = peringatan pengeluaran; hijau = investasi naik; amber = berita/ekonomi; clay = sistem.

Page 32 of 44

Tipografi:

  • Heading: Baloo 2 700–800, rounded terminals, tracking -0.01em, sentence case (bukan all-caps).
  • Body: Nunito.
  • Angka (saldo, skor, Rupiah): Baloo 2 700 dengan spasi tabular-feel agar rapot terbaca seperti papan skor.
  • Label kecil: Nunito 800 uppercase dengan tracking +0.08em, dipakai hemat untuk eyebrow section ('SHEET 1', 'RAPOT BULAN KE-3').
  • Skala 1.25 modular dengan lompatan display lebar: 20/24/30/38/48/64; display clamp(40px, 8vw, 72px) untuk headline hero; 28px mobile untuk judul section; 17px body pada line-height 1.65; minimum 13px untuk label dan sitasi sumber.

Shape language: radius besar dan lembut — kartu 24px, sheet 28px, tombol fully pilled (999px), avatar bubbles circular, chip notifikasi 16px. Bentuk blob dan stiker sebagai pembawa ilustrasi: Barbaya duduk di bidang coral berbentuk pebble; kartu rapot adalah stiker kertas sobek dengan rotasi sedikit (-2deg). Shadow offset lembut 0 8px 0 rgba(43,33,24,0.08) alih-alih drop shadow blur, sehingga kartu terasa seperti stiker yang ditempel. Bentuk bersudut keras dilarang; bahkan daftar notifikasi memiliki row caps membulat.

Layout: mobile-first satu kolom yang menjadi dua kolom 'sticker board' pada 768px dan tiga zona pada 1280px. Onboarding satu pertanyaan per layar dengan prompt ilustratif besar dan satu CTA pilled di bawah — tidak pernah form panjang. Home page adalah tab-pill switcher horizontal antara 'Rencana Barbaya' (Sheet 1) dan 'Pengeluaranku' (Sheet 2), dengan konten sheet masuk sebagai card deck. Notifikasi berada di rail kanan pada 1280px dan bottom sheet pada 375px. History rapot adalah scroll horizontal kartu stiker bulanan, masing-masing menampilkan skor + emoji + verdict satu baris, dapat ditekan untuk diperluas. Gutter 20px di mobile, 48px di desktop.

Page 33 of 44

Imagery: ilustrasi vektor modular dalam semangat Humaaans/Open Peeps — Barbaya si burung hantu dibangun dari bentuk bulat sederhana dengan mata ekspresif dan scarf kecil yang berubah warna sesuai mood (coral = khawatir, hijau = bangga, butter = mengajar). Avatar pengguna adalah orang modular dengan rambut, warna kulit, dan pakaian yang bisa dipadupadankan — dipilih saat signup dan muncul di kartu rapot. Spot illustration untuk empty state (celengan berkaki, struk yang tertidur, dompet berplester). Tanpa stock photography, tanpa render 3D, tanpa gradient blob. Squiggle underline dan arrow doodle sebagai aksen.

Page 34 of 44

7. Signature Design Concept

"Poster hangat Barbaya" — layar pertama bukan hero SaaS, melainkan adegan ilustratif hangat yang terasa seperti poster ramah.

  • Komposisi: dua per tiga kiri (full bleed di 375px, 60% di 1280px) adalah ground cream dengan Barbaya si burung hantu dirender besar (sekitar 40% tinggi viewport), bertengger di atas tumpukan koin Rupiah, satu sayap terangkat melambai, mata mengikuti kursor sedikit. Menumpuk di atasnya, headline Baloo 2 oversized dalam coral dan ink pada clamp(40px, 9vw, 76px), tersusun tiga baris, flush-left: "Uangmu bisa rapi. Pelan-pelan aja." dengan kata terakhir "aja." dalam coral.
  • Kontrol: di bawah headline, satu CTA pilled "Mulai kenalan sama Barbaya" dalam coral dengan teks ink, dan tautan kecil clay "Login".
  • Sepertiga kanan (desktop saja, tersembunyi di mobile): tumpukan miring tiga sticker-card yang mempratinjau produk — chip notifikasi dengan sitasi sumber, kartu rapot dengan emoji grade, dan mini rencana Sheet 1 — masing-masing dirotasi 2–4deg, saling menumpuk, dengan soft offset shadow.
  • Larangan komposisi: tanpa teks terpusat, tanpa paragraf subteks, tanpa tombol biru, tanpa gradient blob. Seluruh komposisi terbaca seperti poster ramah, bukan landing page.
  • Kepatuhan keterbacaan: headline, wordmark, label, angka, teks kartu, dan kontrol tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px; elemen yang boleh terpotong hanyalah ilustrasi dan dekorasi.
Page 35 of 44

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: expressive Hero Dimensionality: layered_2d

Landing Hero Motion Brief

Page 36 of 44
  • Focal subject: Barbaya si burung hantu, dirender besar di atas tumpukan koin Rupiah, satu sayap terangkat melambai, mata mengikuti kursor sedikit.
  • Input → transformation → outcome thesis: saat kursor bergerak di atas hero, mata Barbaya mengikuti sedikit dan scarf-nya bergerak halus; saat pengguna menekan CTA, tombol squash ke 0.96 lalu bounce kembali dengan overshoot ringan, dan halaman bertransisi ke Sign Up and Login. Tidak ada perilaku baru — hanya reaksi visual atas kontrol yang sudah diterima.
  • Motion vocabulary: springy micro-interactions — tombol squash 0.96 saat ditekan dan bounce kembali dengan overshoot ringan; kartu masuk dengan slide 12px ke atas + fade selama 320ms cubic-bezier(0.34, 1.56, 0.64, 1); Barbaya berkedip setiap 6 detik dan menoleh saat pesan AI baru tiba; tab switch antara Sheet 1 dan Sheet 2 adalah horizontal push dengan sheet keluar berotasi 2deg; kartu rapot mengungkap skornya dengan counting number dan stamp-drop.
  • Composed first frame: ground cream penuh, Barbaya besar di kiri dengan sayap terangkat, headline tiga baris flush-left dalam coral dan ink, CTA pilled coral di bawahnya, tautan clay "Login", dan tumpukan tiga sticker-card miring di kanan (desktop).
  • Reduced-motion state: semua gerakan jatuh ke perubahan state instan — tanpa slide, tanpa bounce, tanpa counting; Barbaya tampil diam dengan mata terbuka; kartu-kartu tetap tersusun rapi dan terbaca; konten yang dapat digulir tetap dapat digulir agar setiap item dapat dibawa sepenuhnya ke dalam tampilan.
Page 37 of 44

Signature moves (produk-wide):

  • Barbaya sebagai elemen UI hidup: duduk di sudut setiap layar sebagai avatar coral berbentuk pebble, berkedip pada loop 6 detik, menoleh saat pesan baru tiba, dan warna scarf-nya mengkodekan register emosi nasihat saat itu (coral = peringatan lembut, hijau = pujian, butter = mengajar).
  • Dua sheet sebagai tab-pill switcher fisik: 'Rencana Barbaya' dan 'Pengeluaranku' dirender sebagai dua tab chunky membulat yang kontennya meluncur di antaranya dengan rotasi 2deg saat keluar, sehingga berpindah terasa seperti membalik halaman stiker.
  • Rapot sebagai stiker kertas sobek: setiap rapot bulanan adalah kartu putih terotasi dengan soft offset shadow, angka skor Baloo 2 raksasa, emoji grade (\xf0\x9f\xa6\x89 →\x20\xf0\x9f\x8c\x9f →\x20\xf0\x9f\x8f\x86), dan verdict satu baris; dua belas bulan menumpuk menjadi strip scroll horizontal sehingga pertumbuhan terlihat sebagai baris fisik kartu rapot.
  • Chip notifikasi dengan dot-code warna dan baris sumber wajib: setiap berita atau peringatan investasi adalah chip membulat dengan dot coral/hijau/amber/clay, headline Nunito 700, dan sitasi sumber 13px clay yang dipin di bawah chip — tanpa sumber, tanpa chip.
  • Momen naik level sebagai coral takeover layar penuh: saat pengguna menekan "Aku siap naik level!", layar terisi coral, Barbaya tumbuh setengah viewport dengan confetti squiggle, dan rencana Sheet 1 baru meluncur naik dari bawah sebagai sticker card segar — satu-satunya momen full-bleed di produk.
Page 38 of 44

9. Non-Functional Requirements

  • NFR-01 — Sumber berita dan investasi harus jelas explicit: setiap notifikasi berita ekonomi dan peringatan investasi wajib menampilkan sitasi sumbernya; item tanpa sumber tidak ditampilkan. Rasional: pengguna harus tahu dari mana informasinya berasal.
  • NFR-02 — Tips hemat bersumber explicit: tips and trick modern cara hemat diambil dari sosial media atau sumber lainnya dan disertai sitasinya. Rasional: kredibilitas dan keterlacakan konten.
  • NFR-03 — Siklus notifikasi harian explicit: 2 notifikasi per hari; jika jumlah notifikasi lebih dari 20, notifikasi direset/dihapus. Rasional: menjaga feed tetap ringkas.
  • NFR-04 — Siklus chat 30 hari explicit: chat AI Barbaya direset setiap 30 hari. Rasional: memulai percakapan segar per siklus.
  • NFR-05 — Pembukaan rapot otomatis 30 hari explicit: setiap 30 hari saat membuka aplikasi/web, pengguna otomatis masuk ke rapot. Rasional: evaluasi berkala tidak boleh terlewat.
  • NFR-06 — Siklus 12 bulan explicit: sampai bulan ke-12 rapot direset dan ditampilkan kalkulasi nilai, perkembangan, arah uang, dan daftar perbaikan. Rasional: penutupan siklus tahunan.
  • NFR-07 — Reset dengan retensi data explicit: tombol "Mulai Kembali!" mereset siklus seperti semula, namun data pengguna dan rapot sebelumnya disimpan AI sebagai data pengguna. Rasional: reset tidak boleh menghapus riwayat.
  • NFR-08 — Identitas aplikasi required_inference: pengguna harus login atau membuat akun terlebih dahulu sebelum dapat menggunakan aplikasi; Landing dan Sign Up and Login dapat diakses anonim, seluruh permukaan kerja memerlukan login. Rasional: data keuangan pribadi harus terikat pada pengguna yang benar.
Page 39 of 44
  • NFR-09 — Penyimpanan durable required_inference: profil, pengeluaran, percakapan, rapot, dan rekomendasi disimpan secara durable. Rasional: journey lintas sesi dan siklus 30/12 bulan memerlukannya.
  • NFR-10 — Keterbacaan lintas viewport explicit (dari arah kreatif): headline, wordmark, label, angka, teks kartu, dan kontrol tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px; hanya ilustrasi dan dekorasi yang boleh terpotong. Rasional: arah kreatif menetapkan ini sebagai aturan yang mengalahkan gestur cropping.
  • NFR-11 — Reduced motion explicit (dari arah kreatif): semua gerakan menghormati prefers-reduced-motion dan jatuh ke perubahan state instan; konten yang dapat digulir tetap dapat digulir agar setiap item dapat dibawa sepenuhnya ke dalam tampilan. Rasional: aksesibilitas.
  • NFR-12 — Bahasa dan nada explicit: antarmuka dan Barbaya menggunakan bahasa Indonesia dengan nada hangat, memaafkan, dan tidak menghakimi. Rasional: kontrak emosional produk.
Page 40 of 44

10. Tech Stack

  • Frontend: React (web, mobile-first) — antarmuka custom untuk Landing, Sign Up and Login, Onboarding, home page, Notifications, Barbaya, rapot, Level Feedback, Money Preferences, dan History rapot.
  • Backend: Python/FastAPI — menangani identitas aplikasi, penyimpanan durable, orkestrasi AI (kalkulasi personal dan Barbaya), serta endpoint untuk notifikasi, rapot, dan history.
  • Storage: basis data relasional untuk profil pengguna, catatan pengeluaran, percakapan, rapot bulanan, dan rekomendasi.
  • Cache/queue: Redis untuk antrean dan penjadwalan otomasi siklus (notifikasi harian, reset chat 30 hari, pembukaan rapot 30 hari, reset bulan ke-12) serta state siklus.
  • AI: layanan AI untuk kalkulasi personal, penilaian rapot, dan percakapan Barbaya dengan adaptasi gaya bahasa.
  • Konten eksternal: sumber berita ekonomi nasional/global, sumber data investasi (emas, reksadana, saham), dan sumber tips hemat — diakses sebagai konten eksternal dengan sitasi.
  • Deployment: Docker/docker-compose untuk menjalankan frontend, backend, dan Redis sebagai layanan yang dapat dijalankan bersama.
Page 41 of 44

11. Assumptions and Constraints

  • A-01 [Default — not specified by user] Basis data relasional dipilih sebagai storage durable karena tidak ada pilihan teknologi penyimpanan yang disebutkan sumber.
  • A-02 [Default — not specified by user] Redis digunakan untuk penjadwalan dan antrean otomasi siklus karena redis_required ditetapkan pada Planning Scope dan tidak ada alternatif yang disebutkan sumber.
  • A-03 [Default — not specified by user] Layanan AI diakses melalui backend; tidak ada penyedia AI spesifik yang disebutkan sumber.
  • A-04 [Default — not specified by user] Sumber berita ekonomi, data investasi, dan tips hemat diakses sebagai konten eksternal; tidak ada penyedia spesifik yang disebutkan sumber.
  • A-05 [Default — not specified by user] Siklus 30 hari dihitung per pengguna sejak siklus dimulai, bukan per tanggal kalender, karena sumber menyebut "setiap 30 hari" tanpa menentukan titik awal.
  • A-06 [Default — not specified by user] Reset notifikasi > 20 menghapus notifikasi lama sehingga feed kembali ringkas; sumber menyebut "direset/dihapus" tanpa menentukan mekanisme persisnya.
  • A-07 [Default — not specified by user] Tidak ada peran atau izin berbeda antar pengguna; setiap pengguna terautentikasi hanya mengakses datanya sendiri, karena sumber tidak menyebut kontrol izin berbasis peran.
  • A-08 [Default — not specified by user] Tidak ada fitur future yang diminta secara eksplisit; seluruh cakupan saat ini bersifat current.
  • A-09 [Default — not specified by user] Avatar modular dipilih saat signup dan muncul di kartu rapot, sesuai arah kreatif; sumber tidak menyebut mekanisme pemilihan avatar secara eksplisit.
  • A-10 [Default — not specified by user] Kategori pengeluaran mencakup liburan, kebutuhan pokok, sekolah anak, dan kategori lain yang relevan, karena sumber menyebut "atau apapun itu".
Page 42 of 44

12. Glossary

Page 43 of 44
  • Barbaya: AI berwujud burung hantu yang lucu, menggemaskan, dan pintar ekonomi; menyesuaikan gaya bahasa pengguna saat pertama kali chat dan direset setiap 30 hari.
  • Sheet 1 ("Rencana Barbaya"): sheet di home page berisi kalkulasi AI yang disesuaikan sifat dan kebutuhan pengguna, termasuk hasil kalkulasi naik level.
  • Sheet 2 ("Pengeluaranku"): sheet di home page berisi isi pengeluaran pengguna.
  • Rapot: evaluasi berkala yang muncul otomatis setiap 30 hari, berisi nilai, emoji sesuai nilai, statistik pengeluaran, saran perbaikan, dan tips hemat.
  • History rapot: daftar rapot per bulan (bulan ke-1, bulan ke-2, dan seterusnya) yang menampilkan nilai dan perkembangan, termasuk siklus yang belum mencapai bulan ke-12.
  • "Mulai Kembali!": tombol di rapot yang mereset siklus seperti semula, namun menyimpan data pengguna dan rapot sebelumnya sebagai data pengguna.
  • "Aku siap naik level!": tombol yang muncul saat AI menilai pengguna siap naik level; menekannya membuat AI menyesuaikan level dan cara mengatur uang, dengan hasil kalkulasi ditaruh di Sheet 1.
  • "Belum siap": pilihan di rapot yang membawa pengguna ke Level Feedback untuk menjelaskan alasan/faktor.
  • Level Feedback: halaman berisi kolom alasan/faktor mengapa pengguna tidak mau naik level atau ingin disesuaikan lagi.
  • Money Preferences: halaman berisi kolom tempat pengguna memberi tahu cara mengatur uang yang nyaman dan relevan untuk kondisinya.
  • Dot-code: penanda warna pada chip notifikasi — coral = peringatan pengeluaran, hijau = investasi naik, amber = berita/ekonomi, clay = sistem.
  • Siklus 30 hari: periode yang memicu reset chat Barbaya dan pembukaan rapot otomatis.
  • Siklus 12 bulan: periode yang memicu reset rapot dan penampilan kalkulasi nilai, perkembangan, arah uang, dan daftar perbaikan.
Page 44 of 44

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View intro
Sign Up and Login: Log in
home page: View AI plan
home page: Switch to expenses sheet
home page: Add expense entry
home page: Retry failed expense save
Notifications: Read economic news
Notifications: Read investment alerts
Notifications: Reload failed feed
Barbaya: Send first message
Barbaya: Continue conversation
Barbaya: Retry failed reply
Barbaya: Start new chat after reset

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View intro
Sign Up and Login: Log in
home page: View AI plan
home page: Switch to expenses sheet
home page: Add expense entry
home page: Retry failed expense save
Notifications: Read economic news
Notifications: Read investment alerts
Notifications: Reload failed feed
Barbaya: Send first message
Barbaya: Continue conversation
Barbaya: Retry failed reply
Barbaya: Start new chat after reset