/ Zena / splitku.fig ● Tersimpan
100% ▾
Z D
← Beranda
UAS · UI/UX 4 · 2026
Disusun oleh
Alzena Danas Azalia
Kelas
UI/UX 4
Dosen Pengampu
Bapak Hamzah Ramadhan
Program Studi
Bisnis Digital
Universitas
Cakrawala University

Case Study · UAS UI/UX 4 · 2026

Splitku

Konsep aplikasi patungan tagihan untuk anak kos, geng nongkrong, dan housemate. Bagi tagihan tanpa drama.

Before = tampilan kerja di Figma (ada layer panel, properties, komentar). After = preview mode yang lebih bersih. Frame desainnya sama.

Konsep Aplikasi

Splitku .

Aplikasi orisinal (bukan brand existing)
Institusi Cakrawala University Cakrawala University
Peran
UX Researcher & Designer
Durasi
3 minggu
Tools
HTML/CSS · Google Forms · Whiteboard
Konteks
Tugas akademik mandiri

01

Latar Belakang & Masalah

Patungan tagihan kos, traktir geng, atau bagi bensin trip jalan kelihatan sederhana, tapi sering bikin drama kecil. Saya menemukan empat pain point yang sering muncul.

Hitung manual ribet

Tagihan dibagi pakai kalkulator HP, sering salah, apalagi kalau ada yang ikut sebagian doang.

Lupa siapa sudah bayar

Tanpa catatan, dalam 1-2 minggu jadi lupa siapa yang sudah bayar dan siapa yang belum.

Awkward menagih

Banyak yang merasa segan menagih teman dekat / housemate karena takut hubungan jadi canggung.

Pembagian terasa tidak adil

Bagi rata kadang tidak masuk akal kalau ada yang konsumsi lebih banyak atau hadir lebih sebentar.

Pertanyaan riset: Bagaimana cara membantu mahasiswa kos dan geng nongkrong membagi tagihan patungan dengan adil, transparan, dan tidak awkward saat menagih?

02

Hasil Riset

Saya pakai dua metode: kuesioner kuantitatif (10 responden) untuk melihat pola, dan wawancara kualitatif (4 responden) untuk konteks di balik angka.

10 Responden Kuesioner Selesai
4 Wawancara Mendalam Selesai
3 Persona Tervalidasi Selesai
4.4 Skor Validasi Solusi (rata-rata /5) Tinggi

Temuan Pain Point (skala /5)

Skor rata-rata setuju responden terhadap pernyataan pengalaman patungan tagihan saat ini.

Validasi Solusi (skala /5)

Skor rata-rata setuju responden terhadap kebutuhan fitur Splitku.

Insight utama: Pain terbesar adalah awkward menagih (3.9/5), dan fitur yang paling dibutuhkan adalah reminder halus (4.5/5). Pasangan masalah-solusi ini menjadi anchor utama desain Splitku, terutama pada screen Settle Up dan reminder otomatis via WhatsApp.

03

Persona

Tiga persona yang diturunkan dari hasil kuesioner dan wawancara. Mayoritas responden berusia 18-25 tahun dan masih tinggal bersama orang tua, sehingga konteks patungan lebih banyak ke geng kuliah, keluarga, atau kantor.

RA

Rina, 21

Mahasiswa Geng Kuliah

"Tiap nongkrong, yang bayarin sering nombokin terus."

  • Patungan teman
  • Bagi rata
BR

Bayu, 26

Karyawan Squad Kantor

"Yang bayarin gengsi nagih, sering jadi merelakan."

  • Bagi tagihan
  • Reminder halus
SP

Sarah, 23

Trip Organizer

"Bagi bensin sama tol harus adil sesuai kontribusi."

  • Custom split
  • Settle up

04

Prinsip Desain

Empat prinsip yang saya pakai untuk mengambil keputusan desain.

P-1

Transparency First

Semua transaksi terlihat oleh seluruh anggota grup. Tidak ada hitungan tersembunyi atau perubahan diam-diam.

P-2

Show, Don't Tell

Saldo, posisi utang, dan rekomendasi transfer ditampilkan secara visual. Pengguna tidak perlu menghitung sendiri.

P-3

Smart Defaults

Aplikasi sudah tahu konteks user. Kursi sebelahan otomatis. Penumpang tersimpan pre-fill. Jadwal yang sering dipakai di-suggest.

P-4

Reduce Repetition

Input sekali, pakai berulang. NIK keluarga disimpan terenkripsi. Multi-passenger jadi 1 tap, bukan 6 form.

05

Low-Fidelity Wireframe

Sebelum eksekusi visual, saya menggambar wireframe sederhana untuk memvalidasi alur navigasi tanpa terdistraksi warna dan tipografi. Lima frame berikut adalah versi grayscale dari Hi-Fi.

Lo-Fi Wireframe · Grayscale 5 frames
01 Home
Header
Saldo total
Grup Kamu
02 Group Detail
Group title + members
Posisi kamu di grup
Tagih Settle Up
Pengeluaran terbaru
+ Tambah Pengeluaran
03 Add Expense
Tambah Pengeluaran
Untuk apa?
Jumlah total
Dibayar oleh
Simpan
04 Settle Up ★
Settle Up
Solusi optimal: 2 transfer
Andi → Zena (Rp 50.000)
Budi → Zena (Rp 30.000)
Reminder halus?
Tandai semua lunas
05 Activity
Aktivitas

Tujuan tahap Lo-Fi: menguji kerangka informasi, hierarki, dan alur halaman sebelum biaya iterasi naik. Ketika Lo-Fi sudah terasa pas, baru lanjut ke pemilihan warna, tipografi, dan komponen visual.

06

High-Fidelity Prototype

Lima screen utama yang mencakup core flow: lihat saldo grup, tambah pengeluaran, dan settle up. Toggle Before untuk lihat working file, After untuk preview mode.

T Frame · Splitku
5 frames 320 × 660 100%
FLOW A · Lihat Saldo & Buat Pengeluaran
01 Home
9:41 ●●●● 5G ▮▮

Halo,

Zena ✨

ZA

Total Saldo Patungan

+ Rp 95.000

Kamu utang

Rp 170.000

Dipiutangi

Rp 265.000

Grup Kamu

+ Bikin Grup
KP

Kos Pondok Indah

3 anggota · Listrik Mei

- Rp 50.000

kamu utang

GM

Geng Makan Senin

5 anggota · Settled up ✓

Beres

WP

Wifi Patungan

4 anggota · Iuran Mei

+ Rp 25.000

dipiutangi

TB

Trip Bandung

6 anggota · Bensin + tol

- Rp 120.000

kamu utang

Beranda
Aktivitas
Grup
Profil
Design by ZENA

Saldo total di atas. List grup dengan posisi utang/piutang per grup.

02 Group Detail
9:41 ●●●● 5G ▮▮

Kos Pondok Indah

3 anggota · Sejak Jan 2026

Z
A
B
+
Posisi Kamu di Grup Net +Rp 80rb
A Andi utang ke kamu Rp 50.000
B Budi utang ke kamu Rp 30.000

Pengeluaran Terbaru

Lihat semua
💡

Listrik Mei

Dibayarin Zena · 8 Mei

Rp 250.000

rata 3

💧

Galon + gas

Dibayarin Andi · 5 Mei

Rp 75.000

rata 3

🧹

Cleaning service

Dibayarin Zena · 1 Mei

Rp 90.000

rata 3

Design by ZENA

Detail grup kos. Posisi tiap anggota terlihat, ada CTA Settle Up.

03 Add Expense
9:41 ●●●● 5G ▮▮
×

Tambah Pengeluaran

Kos Pondok Indah

Untuk apa?

Listrik Mei 2026

💡 Listrik · Tagihan Bulanan

Jumlah Total

Rp 250.000

Dibayar oleh

Z
Zena (saya)

Cara Bagi

⚖️ Rata % Persentase Custom

Dibagi ke 3 orang

Z
Zena Rp 83.333
A
Andi Rp 83.333
B
Budi Rp 83.333

Otomatis dihitung

Andi & Budi akan utang Rp 83.333 ke kamu setelah disimpan.

Design by ZENA

Input pengeluaran dengan tiga mode bagi: rata, persentase, atau custom.

FLOW B · Settle Up & Aktivitas
04 Settle Up ★
9:41 ●●●● 5G ▮▮

Settle Up

Solusi Optimal

2 transfer = beres semua

Dari kemungkinan 6 transfer, dipangkas jadi 2.

Yang harus transfer

A

Dari

Andi

Ke

Zena

Z

Jumlah

Rp 50.000

B

Dari

Budi

Ke

Zena

Z

Jumlah

Rp 30.000

🔔

Kirim reminder halus?

Splitku kirim notifikasi WA otomatis ke Andi & Budi.

Tanpa Splitku

Hitung manual: 6 kemungkinan transfer
Drama mungkin: ada yang kelewat / lupa
Awkward: harus nagih satu-satu

Design by ZENA

Algoritma minimisasi: 6 kemungkinan transfer dipangkas jadi 2. Ada tombol kirim reminder halus.

05 Activity
9:41 ●●●● 5G ▮▮

Aktivitas

Semua Pengeluaran Pembayaran Reminder
💡

Zena menambah Listrik Mei

Kos Pondok Indah · 2 jam lalu

Rp 250.000

Andi bayar bagian ke Zena

Kos Pondok Indah · Kemarin

+ Rp 50.000

Sarah menambah Bensin trip

Trip Bandung · 2 hari lalu

Rp 180.000

👋

Doni bergabung ke grup

Wifi Patungan · 3 hari lalu

💧

Budi menambah Galon + gas

Kos Pondok Indah · 5 hari lalu

Rp 75.000

🔔

Splitku kirim reminder ke Budi

Wifi Patungan · 6 hari lalu

Rp 25.000

Aktivitas 30 hari terakhir

Beranda
Aktivitas
Grup
Profil
Design by ZENA

Timeline transparan untuk seluruh anggota grup. Filter pengeluaran, pembayaran, reminder.

1 Z Visualisasi minimisasi transfer terasa kuat

07

Keputusan Desain Penting

Posisi Saldo di Header Beranda

Masalah: Pengguna ingin tahu cepat: "Saya utang berapa? Dipiutangi berapa?" tanpa harus masuk per grup.

Solusi: Card hitam di header beranda menampilkan saldo total + breakdown utang/piutang dalam dua chip merah-hijau.

Hasilnya: Pengguna dapat informasi paling penting dalam 1 detik buka aplikasi.

Settle Up dengan Algoritma Minimisasi

Masalah: Di grup 4-5 orang, jumlah transfer "naive" bisa jadi 6-10 transfer. Capek dan rentan kelewat.

Solusi: Aplikasi otomatis menghitung jumlah transfer minimum (mis. 6 transfer dipangkas jadi 2). Ditampilkan dengan card gelap "✨ Solusi Optimal".

Hasilnya: Settle Up lebih cepat selesai, dan kemungkinan ada yang lupa membayar berkurang drastis.

Tiga Mode Pembagian (Rata, Persen, Custom)

Masalah: Bagi rata tidak adil saat ada anggota yang konsumsi berbeda. Tapi mode custom yang kompleks bikin user menyerah.

Solusi: Tiga pill di atas (Rata default, Persentase, Custom). Auto-recalc real-time saat user pilih mode.

Hasilnya: Use case 80% (bagi rata) tetap satu tap. Use case kompleks tetap bisa di-handle.

Reminder Halus, Bukan Tagihan Galak

Masalah: Kebanyakan user merasa awkward menagih teman dekat. Banyak yang akhirnya merelakan utangnya.

Solusi: Tombol "🔔 Kirim reminder halus" yang otomatis kirim notifikasi WA berformat sopan ke teman yang belum bayar.

Hasilnya: Aplikasi yang menagih, bukan user. Hubungan teman tetap aman.

08

Pelajaran & Tantangan

Yang Berjalan Lancar

  • Menggabungkan data kuesioner dengan wawancara bikin temuan lebih kuat. Angka saja kurang, cerita saja juga kurang.
  • Fokus pada 2 flow saja (booking + refund) ternyata pas. Kalau redesign semua, hasilnya pasti dangkal.
  • Menentukan prinsip desain dulu sebelum membuat screen, jadi pas eksekusi tidak random.

Yang Sulit

  • Mencari minimal 10 responden butuh effort. Saya tidak bisa hanya mengandalkan teman dekat, jadi saya juga sebar ke grup-grup lain.
  • Menahan diri untuk tidak redesign semua. Banyak ide muncul, tapi harus dipotong supaya scope tetap terkendali.
  • Konsistensi warna dan spacing lumayan menguras waktu karena tidak ada design system yang sudah jadi.

Kalau Ada Waktu Lagi

  • Saya ingin tes prototype ke 5 user beneran, bukan hanya berdasarkan asumsi.
  • Eksplor error state (booking gagal, payment timeout, kuota habis).
  • Bandingkan dengan kompetitor lokal (Tiket.com, Traveloka) supaya tahu pola yang sudah familiar di mata user Indonesia.

Awalnya saya kira tugas ini hanya soal bikin tampilan yang bagus. Ternyata sebagian besar drama patungan tagihan bukan soal hitung-hitungan, tapi soal kepercayaan, transparansi, dan rasa awkward saat menagih teman.

09

Pertanyaan yang Sering Muncul

Beberapa pertanyaan yang sering ditanyakan tentang konsep Splitku.

Apa itu Splitku?

Splitku adalah konsep aplikasi mobile untuk membagi tagihan patungan antar teman, housemate, atau keluarga. Tujuannya menghilangkan drama hitung manual dan rasa awkward saat menagih bagian patungan.

Kenapa bikin aplikasi baru, bukan redesign yang sudah ada?

Saya ingin merasakan seluruh proses UX dari awal: riset, persona, prinsip desain, sampai eksekusi visual. Dengan membuat dari nol, saya tidak terbatas oleh brand guideline aplikasi yang sudah ada dan bisa fokus mempraktikkan metodologi yang dipelajari di kelas.

Apa bedanya dengan Splitwise atau fitur Split Bill di DANA / Jenius?

Splitku punya tiga pembeda utama:

  • Algoritma minimisasi transfer. Di grup 4-5 orang, jumlah transfer settle up dipangkas dari 6-10 menjadi 2-3 transfer.
  • Reminder halus otomatis. Aplikasi kirim notifikasi WhatsApp sopan ke teman yang belum bayar, jadi user tidak perlu menagih sendiri.
  • Tiga mode pembagian. Rata, persentase, atau custom amount, biar fleksibel sesuai kontribusi tiap orang.
Tools apa yang dipakai?

Riset: Google Forms (kuesioner) dan WhatsApp voice note (wawancara asynchronous). Desain: HTML/CSS dengan struktur frame mengikuti workflow Figma (layer panel, properties, komentar). Pemilihan HTML supaya prototipe bisa di-test langsung di HP responden, bukan hanya mockup statis.

Berapa responden untuk riset?

Target minimum 10 responden untuk kuesioner kuantitatif dan 4 responden untuk wawancara mendalam. Saat halaman ini dipublikasikan, pengumpulan data masih berjalan. Hasil akan ditampilkan di section riset setelah data terkumpul.

Apakah Splitku akan benar-benar diluncurkan?

Untuk saat ini, Splitku adalah konsep akademik untuk tugas UAS UI/UX 4. Belum ada rencana peluncuran komersial. Namun, fondasi riset dan desain ini bisa menjadi dasar pengembangan lebih lanjut di masa depan.

Bagaimana model bisnisnya kalau dirilis?

Beberapa skenario yang dipertimbangkan: freemium dengan limit grup di versi gratis, partnership dengan bank/e-wallet untuk fitur transfer otomatis, atau konten promosi tematik (mis. promo restoran untuk grup makan). Validasi UX adalah fokus utama tugas ini, monetisasi adalah eksplorasi lanjutan.

Boleh memberi masukan untuk desain ini?

Boleh sekali. Anda bisa email ke [email protected] dengan subjek "Feedback Splitku". Setiap masukan saya catat dan menjadi bahan iterasi berikutnya.