Belajar Product Designer - Information Architecture & Flows

#Pendahuluan

Setelah di episode 5 kita menyusun vision statement dan pilar strategi Sehati, pada episode ini kita menerjemahkan arah itu menjadi struktur: information architecture (IA) dan user flows. Inilah jembatan antara "produk ingin pergi ke mana" dan "pengguna akan bergerak seperti apa di dalamnya".

IA adalah cara informasi disusun, dilabeli, dan dinavigasikan. Flow adalah urutan langkah pengguna menyelesaikan tugas. Keduanya sering dilewatkan — orang langsung lompat ke desain layar — padahal inilah fondasi yang menentukan apakah produk terasa logis atau membuat pengguna tersesat. Produk dengan layar indah tapi IA berantakan tetap akan ditinggalkan.

#Sitemap: Kerangka Navigasi

Sitemap adalah peta seluruh halaman dan hierarkinya. Untuk Sehati, contoh sitemap awal:

Prinsip IA yang baik:

1. Sesuai model mental user — label "Cek Gejala" lebih dimengerti daripada "Triase Medis".
2. Mendukung pilar strategi — konsultasi dan rekam kesehatan ada di level teratas sesuai pilar akses & kontinuitas.
3. Sesedikit mungkin level — maksimal 3 level dalam untuk tugas inti.
4. Menghindari label ambigu — "Lainnya" adalah tanda IA belum matang.

#User Flows: Langkah demi Langkah

User flow memetakan langkah menyelesaikan satu tugas. Satu sitemap punya banyak flow; buatlah per task inti. Contoh flow untuk tugas "cek gejala lalu booking":

Start → Buka Sehati
      → Ketuk "Cek Gejala"
      → Jawab 5 pertanyaan
      → Lihat hasil triase (hijau/kuning/merah)
      → (merah) → Lihat rekomendasi dokter
      → Pilih slot waktu
      → Konfirmasi & bayar
      → Dapat reminder via notifikasi

Saat membuat flow, perhatikan tiga hal: langkah minimum (hapus langkah yang tidak perlu), decision points (di mana user memilih?), dan error paths (apa yang terjadi jika gagal?).

#Teknik Sederhana: Hitung Jumlah Langkah

Ambil flow di atas dan hitung langkah minimumnya: 9 langkah. Sekarang tanyakan: bisakah menjadi 6? Misal dengan menggabungkan "hasil triase" dan "rekomendasi dokter" dalam satu layar. Setiap langkah yang dihapus mengurangi friksi — dan di dunia kesehatan, friksi adalah alasan orang menunda.

#Journey Design: Lebih Luas dari App

Journey design melihat pengalaman dari sudut pandang pengguna dalam waktu dan konteks, termasuk titik-titik di luar aplikasi. Untuk Sehati, journey pasien bisa mencakup:

Journey design mengingatkan bahwa aplikasi hanyalah satu titik kontak. Keputusan desain harus memperhatikan momen sebelum dan sesudah — misalnya: apakah hasil triase merah mudah dibagikan ke keluarga? Apakah notifikasi pengingat datang di waktu yang tepat?

#Praktik: Flow Produk Utama Sehati

Buka Figma, halaman 02 IA & Flow, dan buat:

1. Sitemap 2 level untuk Sehati (satu layar canvas).
2. User flow untuk 2 task inti: "cek gejala → booking" dan "set pengingat obat".
3. Catat jumlah langkah minimum tiap flow.

Lalu uji dengan skenario nyata: tuliskan satu skenario singkat untuk tiap flow, misalnya "Rina, 25 tahun, bangun pagi dengan demam dan ingin tahu harus ke dokter atau tidak." Semua flow harus mengantarkan Rina ke hasil yang jelas tanpa membingungkan.

#Penutup

Inti yang harus dibawa pulang:

• IA menentukan struktur & label informasi; flow menentukan urutan tugas.
• Sitemap yang baik mengikuti model mental user, mendukung strategi, dan sesedikit mungkin level.
• User flow diukur dari langkah minimum; setiap langkah yang dihapus mengurangi friksi.
• Journey design memperluas pandangan melampaui aplikasi ke seluruh titik kontak.
• Skenario nyata adalah ujian terbaik sebelum melangkah ke desain visual.

Di episode 7 selanjutnya kita akan membahas wireframe & prototype dari lo-fi ke hi-fi — mengubah struktur dan flow yang barusan kalian buat menjadi sketsa kasar, wireframe, hingga prototype hi-fi yang bisa diklik di Figma. Sampai jumpa di episode 7!