Belajar UX Designer - Information Architecture

#Pendahuluan

Setelah di episode 4 kita menetapkan problem statement dan success metrics JagaKota, sekarang kita membangun kerangka tempat semua informasi duduk. Inilah information architecture (IA): bagaimana konten diorganisasi, dilabeli, dan dinavigasikan.

Mengapa IA penting? Karena sebaik apa pun tampilan sebuah layar, jika pengguna tidak bisa menemukan apa yang dicari, semua sia-sia. Konversi dimenangkan di navigasi, bukan di tombol berwarna. Untuk JagaKota, pertanyaan IA intinya: "di mana warga yang ingin melapor mencari tombol lapor, dan bagaimana laporan yang sudah diajukan bisa ditemukan kembali?"

#Konsep Dasar IA

IA beroperasi pada tiga lapisan:

1. Organisasi — bagaimana konten dikelompokkan (taxonomy).
2. Labeling — nama yang dipakai untuk tiap kelompok.
3. Navigasi — bagaimana pengguna berpindah antar kelompok.

Kesalahan klasik adalah menyusun IA berdasarkan struktur organisasi pemerintah (per dinas) padahal pengguna berpikir berdasarkan tujuan (saya melihat lampu mati, bukan "saya butuh dinas perhubungan"). IA yang baik memetakan cara berpikir pengguna, bukan struktur internal.

#Card Sorting: Menemukan Mental Model

Card sorting adalah teknik riset untuk menemukan cara pengguna mengelompokkan konten. Tulis setiap konten di kartu, minta peserta mengelompokkannya dengan caranya sendiri, lalu beri nama tiap kelompok. Ada dua jenis:

• Open card sorting: peserta bebas membuat kelompok sendiri (untuk menemukan struktur baru).
• Closed card sorting: kelompok sudah disediakan, peserta memasukkan kartu (untuk memvalidasi struktur yang ada).

Contoh kartu untuk JagaKota:

# Jalan
Lubang jalan | Trotoar rusak | Jalan tergenang | Lampu jalan mati
 
# Lingkungan
Sampah menumpuk | Saluran tersumbat | Pohon tumbang | Bau tidak sedap
 
# Layanan
Listrik padam | Air tidak mengalir | Marka jalan pudar

Dari 8-12 partisipan, pola pengelompokan yang konsisten menunjukkan taxonomy yang aman. Setelah itu, validasi struktur dengan tree testing: minta partisipan mencari item di sitemap (tanpa visual), ukur apakah mereka berhasil menemukannya.

#Menyusun Sitemap JagaKota

Berdasarkan hasil card sorting, kita bisa menyusun sitemap awal:

Home
├── Lapor Masalah
│   ├── Pilih kategori
│   ├── Isi lokasi & detail
│   └── Konfirmasi
├── Laporan Saya
│   ├── Daftar laporan
│   └── Detail & status
├── Peta Laporan
│   ├── Filter kategori
│   └── Detail titik
├── Info
│   ├── Cara melapor
│   ├── FAQ
│   └── Kontak
└── Pengaturan
    ├── Profil
    ├── Notifikasi
    └── Privasi

#Prinsip IA yang Baik

• Label pakai bahasa pengguna, bukan istilah teknis atau dinas: "Lapor Masalah" bukan "Kirim Surat Aduan".
• Kedalaman seimbang: terlalu dalam membuat pengguna tersesat, terlalu datar membuat layar penuh. 2-3 tingkat cukup untuk aplikasi seperti JagaKota.
• Ambiguity dijaga minim: jika pengguna ragu di mana suatu item berada, berarti labeling-nya gagal.
• Progressive disclosure: sembunyikan detail ke tingkat yang tepat; beranda hanya menampilkan pintu masuk utama.

#Common Pitfalls

• Menyalin struktur organisasi ke IA — pengguna tidak peduli "dinas mana" yang menangani.
• Kategori yang tumpang tindih — "Jalan" dan "Lampu jalan" saling berkaitan; tetapkan aturan eksklusif.
• Over-labeling — memakai istilah seperti "infrastruktur horizontal" yang hanya dipahami pejabat.
• Mengabaikan tipe konten — laporan yang diproses vs riwayat lama butuh status yang membedakannya.

#Penutup

Inti yang harus dibawa pulang:

• IA terdiri dari organisasi, labeling, dan navigasi — disusun berdasarkan cara berpikir pengguna, bukan struktur internal.
• Card sorting mengungkap mental model; tree testing memvalidasi struktur.
• Label harus memakai bahasa pengguna; kedalaman sitemap 2-3 tingkat cukup.
• Sitemap adalah hipotesis yang harus diuji, bukan dokumen final.

Di episode 6 selanjutnya kita akan membahas user flows dan journey mapping — memetakan perjalanan pengguna dari melihat masalah infrastruktur hingga laporannya terselesaikan, lengkap dengan touchpoints dan emosi di tiap tahap. Sampai jumpa di episode 6!