1. Apa ini
Mazeh merekam klik pengunjung di halaman prototype (prototype.product-sid.us), lalu menggambarnya sebagai flow diagram: dari halaman pertama, ke interaksi ke-1, ke-2, ke-3, dst. Lengkap dengan berapa banyak sesi yang lanjut vs yang berhenti (drop-off) di tiap langkah. Berguna buat lihat di mana orang biasanya nyasar, berhenti, atau nemu jalan yang nggak kepikiran pas desain.
2. Cara kumpulin data
Bagikan link prototype persis apa adanya, termasuk bagian ?mvid=... di belakangnya; itu wajib ada, tanpa itu Mazeh tidak akan merekam apa pun:
https://prototype.product-sid.us/proj-platform-expert/1783571768087.html?mvid=cmrcziya5003uty2025810bqz
i
Kirim satu link yang sama ke semua tester. Semua sesi klik mereka akan digabung jadi satu flow di dashboard, itu memang tujuannya, biar polanya kebaca dari banyak orang sekaligus. Tester tinggal buka link itu dan pakai prototype-nya seperti biasa, tidak perlu instal atau setting apa pun.
!
Kalau linknya dibuka tanpa ?mvid=..., atau prototype-nya beda file/beda versi, sesi itu tidak akan tercatat di flow yang sama (lihat FAQ di bawah).
3. Cara lihat hasil
- Buka research.product-sid.us/mazeh
- Pilih prototype dari dropdown di kiri atas (muncul otomatis begitu ada minimal 1 sesi tercatat)
- Klik Refresh untuk menarik data terbaru kapan saja
4. Cara membaca chart
Contoh di bawah pakai data ilustrasi (bukan data asli) supaya tiap bagian bisa dijelaskan satu-satu:
Ringkasan warna
Hijau = sesi yang lanjut ke langkah berikutnya
Merah = sesi yang berhenti di situ (drop-off)
Garis kecil di kiri tiap bar = identitas halaman/aksi (warna beda = label beda, abu-abu = bucket "sisanya")
5. Cara mengambil insight
- Drop-off (merah) besar di satu langkah tertentu → itu titik gesekan (friction). Cek label node-nya: apa yang bikin orang berhenti di sana? Copy membingungkan? Tombol nggak kelihatan? Fitur dianggap selesai di situ?
- Satu label dominan dengan bar besar → jalur utama yang dipakai kebanyakan orang. Itu jalur yang paling penting untuk dipoles.
- Banyak masuk ke "(N more pages)" → orang menyebar ke banyak arah berbeda di langkah itu, tidak ada satu jalur dominan. Bisa berarti navigasi terlalu terbuka/membingungkan, atau memang wajar (menu utama).
- Pita hijau tebal dari node A ke node B → jalur populer spesifik dari satu halaman ke halaman berikutnya. Pita tipis = jalur jarang dipakai.
- Arahkan mouse ke bar mana pun untuk lihat detail persis: nama, total sesi, berapa lanjut, berapa drop-off.
6. FAQ
- Dashboard kosong / prototype tidak muncul di dropdown?
- Belum ada yang klik link dengan
?mvid=... yang benar. Cek juga apakah linknya benar-benar dibuka (bukan cuma di-share doang), dan bahwa itu file yang sama.
- Refresh halaman prototype, terus datanya kepisah jadi 2 sesi?
- Ya, itu sengaja: sesi cuma bertahan selama 1 kali buka halaman (tidak disimpan lewat refresh), karena prototype dijalankan dalam mode "sandboxed" yang tidak mengizinkan penyimpanan browser. Jadi 1 sesi = 1 kali buka link, dari awal sampai user pindah/tutup tab.
- Prototype lain (bukan yang ini) bisa ikut dilacak juga?
- Tergantung. Yang sudah aktif baru
proj-platform-expert/1783571768087.html. Beberapa prototype disajikan lewat backend yang berbeda (contoh: /api/proto-html/... itu server MUV, bukan Flask app-showcase), perlu pengecekan/integrasi terpisah dulu sebelum bisa dilacak. Tanya dulu ke yang pegang Mazeh sebelum asumsi semua prototype otomatis kecover.
- Boleh ganti-ganti
mvid sendiri?
- Untuk prototype yang lewat app-showcase (seperti contoh di atas), boleh:
mvid di situ cuma dipakai sebagai label pengelompokan, bukan divalidasi ke database manapun. Tapi jangan pakai mvid punya prototype lain untuk file yang berbeda, nanti datanya kecampur jadi satu grup padahal beda prototype.
- Datanya kepakai buat apa selain flow diagram ini?
- Saat ini cuma untuk flow diagram di dashboard ini. Tidak terhubung ke sistem lain, tidak menyimpan data pribadi pengunjung (tidak ada IP/nama, cuma id sesi acak + label klik).