Fokusnya bukan menghafal istilah, tapi paham ALASAN di balik sebuah desain — supaya nanti kamu bisa menganalisis kasus baru, bukan cuma mengenali kasus yang sudah pernah dibaca. Contoh dominan pakai skenario aplikasi resep masakan, biar konsisten dan gampang dibayangkan.
Human Interface Guidelines (HIG) adalah panduan desain resmi Apple untuk semua platformnya (iOS, iPadOS, macOS, dst). Isinya bukan cuma aturan teknis, tapi prinsip berpikir — tujuannya supaya aplikasi apa pun terasa familiar dan mudah dipakai oleh siapa saja yang sudah pernah pegang perangkat Apple, tanpa harus belajar ulang dari nol tiap buka aplikasi baru.
Penting diluruskan sejak awal: HIG resmi Apple menyebut secara eksplisit HANYA TIGA prinsip utama — Clarity, Deference, dan Depth. Prinsip-prinsip lain yang sering dibahas bersamaan (Consistency, Feedback, Affordance & Signifier, Simplicity, Familiarity, Direct Manipulation) itu prinsip interaksi/desain yang MENDUKUNG ketiganya, bukan sejajar sebagai "core". Membedakan mana yang inti dan mana yang pendukung membantu kamu tidak bingung saat ketiganya (terutama Clarity dan Deference) terasa mirip.
Tiga Prinsip Utama
Cara cepat membedakan keduanya: kalau pertanyaannya soal "apakah teks/ikon ini mudah dibaca dan dipahami", itu Clarity. Kalau soal "apakah tombol/menu ini cukup diam dan tidak mengganggu fokus ke konten utama", itu Deference.
Prinsip Pendukung
Prinsip-prinsip berikut membantu MEWUJUDKAN ketiga prinsip utama di atas dalam praktik, tapi bukan bagian dari trio inti HIG itu sendiri.
Dua istilah yang sering tertukar di bagian ini adalah affordance dan signifier. Affordance adalah kemampuan sebenarnya dari sebuah elemen — tombol itu MEMANG bisa ditekan, itu affordance-nya. Signifier adalah petunjuk visual yang memberi tahu pengguna bahwa affordance itu ada — bayangan halus atau warna kontras pada tombol itulah yang membuat orang SADAR bahwa elemen itu bisa ditekan. Tombol bisa saja "bisa ditekan" (affordance-nya ada) tapi kalau tidak diberi tanda visual apa pun (signifier-nya tidak ada), pengguna tidak akan tahu.
Tiga prinsip pendukung lainnya: Simplicity — buang elemen yang tidak perlu, supaya konten dan aksi utama tetap jadi pusat perhatian. Familiarity — pakai pola dan ikon yang sudah dikenal luas (ikon kaca pembesar untuk cari, ikon keranjang untuk beli) supaya pengguna tidak perlu belajar simbol baru dari nol. Direct manipulation — pengguna berinteraksi LANGSUNG dengan objek di layar dan melihat hasilnya seketika, misalnya menggeser foto resep untuk memperbesar, bukan lewat menu pengaturan terpisah.
Dalam praktik, semua prinsip ini bekerja BERSAMAAN, bukan satu-satu. Contoh: halaman detail resep yang baik menerapkan Clarity (teks jelas), Deference (foto jadi fokus), Consistency (ikon bookmark sama di semua halaman), dan Feedback (animasi saat disimpan) — sekaligus, dalam satu layar yang sama. Bedanya, Clarity/Deference/Depth adalah TUJUAN akhirnya, sedangkan Consistency/Feedback/Affordance-Signifier/Simplicity/Familiarity/Direct Manipulation adalah CARA-CARA konkret untuk mencapai tujuan itu.
UI dan UX sering disebut bergantian padahal artinya beda. UI (User Interface) adalah tampilan dan elemen visual yang dilihat dan disentuh pengguna — warna, tombol, ikon, layout. UX (User Experience) adalah keseluruhan PENGALAMAN memakai produk itu, dari awal sampai akhir — termasuk perasaan, kemudahan, dan kelancaran alurnya. Analoginya: UI itu seperti tampilan dapur (rapi atau berantakan), UX itu keseluruhan pengalaman memasak di dapur itu, dari mencari alat sampai selesai masak. Dapur bisa terlihat cantik (UI bagus) tapi alat-alatnya susah dijangkau (UX buruk).
UX yang baik dimulai dari user-centered design — desain dimulai dari kebutuhan nyata pengguna, bukan dari asumsi atau selera tim pembuatnya. Ukuran keberhasilannya disebut usability: seberapa mudah dan efisien orang bisa menyelesaikan tugasnya lewat produk itu.
Untuk mencapai usability yang baik, ada beberapa hal yang perlu diatur dengan sengaja. User flow adalah urutan langkah yang dilalui pengguna untuk mencapai tujuan (buka aplikasi → cari resep → pilih resep → mulai masak) — kalau urutannya berbelit, pengguna gampang tersesat. Information architecture adalah cara informasi dikelompokkan supaya masuk akal, misalnya resep dikategorikan berdasarkan jenis masakan, bukan diacak begitu saja. Navigation adalah cara pengguna berpindah antar bagian aplikasi (tab bar, menu), dan hierarchy adalah cara elemen penting ditonjolkan sementara yang kurang penting dikecilkan, supaya mata pengguna tahu ke mana harus fokus dulu.
Semua ini berhubungan dengan mental model — gambaran di kepala pengguna tentang bagaimana sesuatu seharusnya bekerja, berdasarkan pengalaman mereka sebelumnya di aplikasi lain. Orang berharap ikon keranjang berarti "beli" karena itu pola yang mereka temui di mana-mana; kalau aplikasi kamu memakai ikon keranjang untuk hal lain, mental model pengguna akan "tabrakan" dengan desainmu dan mereka jadi bingung.
Beberapa prinsip lain yang perlu diperhatikan dalam praktik sehari-hari: visibility — elemen penting harus terlihat, jangan disembunyikan entah di mana. Error prevention — desain yang mencegah kesalahan SEBELUM terjadi, misalnya tombol "Hapus" sengaja dijauhkan dari tombol lain atau tombol submit dinonaktifkan sampai form lengkap. Error recovery — kalau kesalahan terlanjur terjadi, beri jalan keluar yang jelas (tombol undo, pesan error yang membantu, bukan cuma "Terjadi kesalahan").
Ada satu prinsip yang sering bikin ide desain bagus jadi lebih ringan buat otak pengguna: recognition vs recall. Recognition artinya pengguna cukup MENGENALI opsi yang sudah ditampilkan di layar (menu, ikon, daftar pilihan). Recall artinya pengguna harus MENGINGAT sesuatu dari memori tanpa bantuan visual (misalnya harus hafal command tertentu). Recognition jauh lebih ringan secara mental, makanya UX yang baik cenderung menampilkan pilihan daripada memaksa orang mengingat-ingat.
Terkait erat dengan itu ada progressive disclosure — tampilkan dulu informasi yang paling penting/dibutuhkan saat itu, sembunyikan detail lanjutan di balik tombol "Lihat lebih lanjut" atau menu expand, supaya pengguna tidak dibanjiri informasi sekaligus. Terakhir, Fitts's Law adalah prinsip sederhana tentang jarak dan ukuran: semakin besar dan semakin dekat sebuah target (tombol) dengan posisi jari/kursor pengguna, semakin cepat dan mudah target itu dijangkau. Itu sebabnya tombol-tombol penting (seperti "Mulai Masak") biasanya dibuat besar dan diletakkan di posisi yang gampang dijangkau ibu jari.
User research penting karena tanpanya, tim cuma menebak-nebak apa yang dibutuhkan pengguna berdasarkan asumsi sendiri — dan asumsi itu sering salah. Fondasinya adalah empathy: usaha sungguh-sungguh memahami perasaan dan kondisi nyata pengguna, bukan sekadar melihat angka/data dari jauh.
Tiga metode riset yang paling dasar: interview (ngobrol langsung secara mendalam dengan beberapa pengguna), observation (mengamati perilaku asli pengguna tanpa banyak bertanya — kadang orang bilang satu hal tapi berperilaku beda), dan survey (kuisioner ke banyak orang sekaligus — jangkauannya luas tapi kedalamannya terbatas). Ketiganya saling melengkapi, bukan saling menggantikan.
Hasil riset biasanya dirangkum jadi persona — representasi fiktif dari satu tipe pengguna khas, supaya tim selalu ingat "kita mendesain untuk siapa" saat mengambil keputusan. Dari situ, tim memetakan user journey: perjalanan lengkap pengguna dari pertama kenal produk sampai jadi pengguna setia, mencatat perasaan mereka di tiap tahap — dan dari situ ditemukan pain points, yaitu titik-titik spesifik di mana pengguna merasa frustrasi atau kesulitan.
Satu hal yang penting dipahami sejak awal: user needs vs business needs tidak selalu selaras. User needs adalah apa yang benar-benar dibutuhkan pengguna; business needs adalah target yang dikejar perusahaan (pendapatan, jumlah pengguna aktif). Kadang keduanya bertemu di titik tengah — misalnya pengguna ingin aplikasi gratis, bisnis butuh pemasukan, solusinya bisa berupa model freemium yang tetap memberi nilai gratis sambil membuka opsi berbayar untuk fitur tambahan.
Accessibility memastikan produk bisa dipakai oleh SEMUA orang, termasuk yang punya keterbatasan — ini bukan "fitur tambahan", tapi bagian dari desain yang baik sejak awal. Ada empat jenis keterbatasan yang perlu dipikirkan: visual (buta warna, penglihatan lemah — butuh kontras cukup dan ukuran teks yang bisa diperbesar), auditory (tuli/kurang dengar — butuh teks/subtitle, bukan cuma notifikasi suara), motor (kesulitan gerakan halus — butuh area sentuh yang cukup besar, tidak bergantung pada gesture rumit), dan cognitive (kesulitan fokus atau mengingat — butuh bahasa sederhana dan alur yang tidak berbelit).
Hal-hal teknis yang mendukung aksesibilitas: contrast yang cukup antara teks dan latar, typography/readability (ukuran font cukup besar, jarak antar baris nyaman, jenis huruf mudah dibaca), dan touch target (ukuran minimum tombol/area yang bisa disentuh, supaya tetap mudah ditekan meskipun jari pengguna tidak terlalu presisi). Filosofi payung dari semua ini disebut inclusive design — merancang produk untuk SEMUA orang sejak dari awal proses desain, bukan menambahkan aksesibilitas belakangan sebagai "tempelan" setelah produk selesai.
Satu hal yang sering tertukar: usability dan accessibility itu dua ukuran yang berbeda, bukan hal yang sama.
Sebuah produk bisa saja sangat usable buat orang tanpa keterbatasan, tapi sama sekali tidak accessible buat pengguna tunanetra — dua hal ini perlu diperhatikan bersamaan, bukan salah satu saja.
Dark mode dibuat bukan sekadar tren, tapi punya tujuan konkret: mengurangi silau dan kelelahan mata di lingkungan minim cahaya (misalnya memasak malam hari di dapur redup), sekaligus menghemat baterai di layar tertentu.
Beberapa elemen visual yang bekerja sama membentuk tampilan yang enak dipakai: contrast (perbedaan terang-gelap antara teks dan latar, supaya mudah dibaca), color hierarchy (warna dipakai untuk menandai mana yang paling penting — warna mencolok untuk aksi utama, warna netral untuk yang sekunder), dan typography (ukuran serta ketebalan font dipakai untuk membedakan judul, isi, dan keterangan tambahan).
Spacing adalah jarak antar elemen — kalau terlalu rapat, tampilan terasa sesak dan susah dipindai mata; kalau pas, tampilan terasa lega. Alignment berarti elemen disusun sejajar rapi, bukan asal ditaruh, sehingga tampilan terasa terorganisir. Gabungan dari ukuran, warna, posisi, dan spacing inilah yang membentuk visual hierarchy — urutan mana yang dilihat mata pengguna lebih dulu.
White space (ruang kosong) bukan "sisa yang tidak terpakai" — ia sengaja dipakai supaya elemen tidak berdesakan dan fokus pengguna lebih jelas. Grid adalah sistem kolom/garis bantu di balik layar supaya semua elemen tersusun konsisten antar halaman, bukan berantakan tiap layar beda-beda.
Dalam hal penggunaan warna untuk informasi — misalnya merah untuk bahaya/error, hijau untuk berhasil — warna itu harus SELALU dibarengi ikon atau teks juga, bukan jadi satu-satunya penanda. Kalau tidak, pengguna yang buta warna tidak akan bisa membedakan status "berhasil" dan "gagal" sama sekali.
Kesalahan umum yang sering terjadi dalam visual design: kontras terlalu rendah, terlalu banyak warna atau jenis font dipakai sekaligus dalam satu layar, spacing yang tidak konsisten antar bagian, dark mode yang cuma hasil invert warna mentah, dan warna dijadikan satu-satunya penanda informasi tanpa didukung teks/ikon.
Cara menganalisis sebuah desain — entah punya sendiri atau punya orang lain — selalu bisa dipecah jadi 4 pertanyaan yang sama: Apa masalahnya? Lalu prinsip UX apa yang dilanggar? Kemudian apa dampaknya ke pengguna? Dan terakhir, bagaimana cara memperbaikinya? Latihan menjawab 4 pertanyaan ini berulang-ulang, di berbagai kasus, adalah cara paling efektif melatih "insting" UX — bukan menghafal daftar aturan.
Satu hal yang perlu diluruskan dulu: feedback dan error message itu bukan dua hal yang terpisah.
Jadi error message adalah bagian dari feedback, bukan hal terpisah — tapi error message yang buruk (cuma bertuliskan "Error") gagal menjalankan fungsi feedback yang seharusnya, karena tidak membantu pengguna tahu harus berbuat apa.
Segala produk berawal dari problem — masalah nyata yang dialami seseorang. Pertanyaan berikutnya selalu: siapa user-nya, yaitu kelompok orang yang benar-benar mengalami masalah itu (bukan "semua orang", karena tidak ada produk yang cocok untuk semua orang sekaligus). Dari situ digali needs — apa yang SEBENARNYA dibutuhkan user untuk mengatasi masalah itu, yang kadang berbeda dari apa yang mereka MINTA secara harfiah. Ada ungkapan terkenal soal ini: orang mungkin minta "bor yang lebih cepat", padahal yang sebenarnya mereka butuhkan adalah "lubang di dinding" — bor cuma salah satu cara mencapainya.
Sepanjang perjalanan memakai produk, user mengalami pain points (dibahas juga di bagian 3) — titik-titik spesifik tempat mereka merasa kesulitan. Untuk meyakinkan user memilih produkmu dibanding yang lain (atau dibanding tidak memakai apa-apa), produk butuh value proposition yang jelas: janji nilai utama, alasan konkret kenapa produk ini layak dipakai.
Solution adalah pendekatan besar yang dipilih untuk menjawab problem itu, sementara features adalah bagian-bagian konkret yang benar-benar dibangun untuk mewujudkan solution tersebut. Dua istilah ini gampang tertukar, padahal levelnya beda.
Solution adalah tujuan, feature adalah alat untuk sampai ke sana. Kesalahan yang sering terjadi: tim sibuk membuat banyak feature baru, tapi lupa mengecek apakah feature-feature itu benar-benar mengarah ke solution yang tepat.
Begitu juga dengan user need vs feature — satu need yang sama bisa dipenuhi lewat feature yang berbeda-beda. Misalnya need "user ingin tahu apakah pesanannya aman diterima" bisa dijawab lewat notifikasi push, email konfirmasi, atau badge status di dalam aplikasi — bentuknya beda, tapi menjawab need yang sama.
Karena hampir semua produk baru dimulai dari sumber daya terbatas, dikenal konsep MVP (Minimum Viable Product) — merilis versi paling inti dari solution dulu, untuk menguji apakah orang benar-benar membutuhkannya, sebelum menghabiskan waktu membangun fitur tambahan yang belum tentu dipakai. Data dari MVP itu lalu dipetakan ke user journey untuk melihat tahap mana yang paling butuh perbaikan lebih dulu.
Kalau sebuah produk benar-benar cocok dengan kebutuhan pasarnya, kondisi itu disebut product-market fit — ditandai orang memakai produk itu secara alami dan terus kembali tanpa dipaksa atau dirayu terus-menerus, bukan sekadar "banyak yang unduh" di awal saja lalu ditinggalkan.
Hampir setiap keputusan desain produk melibatkan trade-off — konsekuensi yang harus diterima. Memilih membangun fitur A berarti menunda fitur B; desain yang dibuat sesederhana mungkin untuk pemula mungkin terasa kurang bertenaga untuk pengguna mahir. Tidak ada desain yang "sempurna untuk semua orang" — yang ada cuma pilihan paling masuk akal untuk target user dan kondisi saat itu.
Kesalahan yang sangat umum terjadi sejak tahap paling awal: problem vs solution tertukar, karena orang cenderung langsung meloncat ke solusi sebelum benar-benar memahami masalahnya.
Contoh kesalahan umum: tim mendefinisikan "kita butuh fitur notifikasi" sebagai masalah, padahal itu SUDAH solusi. Problem aslinya ada di baliknya — misalnya "user sering lupa atau telat tahu informasi penting". Kalau problem-nya dirumuskan dengan benar sejak awal, solusinya bisa jadi bukan cuma notifikasi, tapi bentuk lain yang lebih pas.
Dari semua ini terlihat bahwa UX bukan cuma soal "membuat tampilan enak dipakai" — ia bagian dari product thinking secara keseluruhan: memahami problem dan user lewat riset, menentukan value proposition dan solution lewat strategi produk, baru kemudian mewujudkannya jadi feature yang usable lewat desain UX/UI. UX designer yang baik ikut memikirkan KENAPA sebuah fitur perlu dibuat, bukan cuma mendesain tampilan dari fitur yang keputusannya sudah diambil orang lain.
Bagian ini merangkai semua konsep sebelumnya jadi satu alur kerja utuh. Ikuti satu skenario dari awal sampai akhir supaya terasa sebagai satu cerita, bukan potongan-potongan lepas: bagaimana masalah "orang malas masak sendiri" berkembang jadi sebuah fitur nyata.