Perbedaan UI dan UX Design: Kenapa Developer Wajib Paham?

Cantik saja tidak cukup

Seringkali developer pemula menghabiskan waktu berhari-hari untuk memilih kombinasi warna dan membuat animasi transisi yang memukau. Namun saat websitenya dirilis, pengguna malah bingung cara mencari tombol Checkout atau cara kembali ke halaman sebelumnya. Di sinilah letak perbedaan antara UI dan UX.

UI (User Interface): Bagaimana Tampilannya?

User Interface adalah segala sesuatu yang bisa dilihat dan disentuh oleh mata pengguna di layar. Fokus utama UI adalah estetika dan visual.

• Tugas UI: Memilih jenis font yang mudah dibaca, menentukan palet warna yang serasi, mendesain bentuk tombol (apakah ujungnya membulat atau kotak), dan membuat tata letak yang proporsional.
• Analogi: UI adalah cat dinding yang indah, desain kursi yang elegan, dan penataan piring yang estetik di sebuah restoran.

UX (User Experience): Bagaimana Rasanya?

User Experience adalah pengalaman dan perasaan pengguna saat menggunakan aplikasimu. Fokus utama UX adalah kemudahan, kecepatan, dan pemecahan masalah.

• Tugas UX: Memastikan alur pendaftaran tidak terlalu panjang, memastikan teks error mudah dimengerti (bukan cuma tulisan 'Error 500'), dan menempatkan tombol di lokasi yang mudah dijangkau jempol saat pakai HP.
• Analogi: UX adalah seberapa empuk kursi di restoran tersebut, seberapa cepat pelayan datang saat dipanggil, dan apakah alur memesan makanannya membingungkan atau tidak.

Analogi Botol Saus Tomat

Ada satu analogi klasik di dunia desain:
Botol saus kaca dengan desain elegan dan tutup di atas adalah UI yang bagus. Tapi saat isinya tinggal sedikit, kamu harus memukul-mukul pantat botolnya dengan keras agar sausnya keluar.

Botol plastik yang bisa dipencet (squeeze) dengan posisi tutup berada di bawah mungkin terlihat biasa saja (UI biasa), tapi jauh lebih mudah digunakan sampai tetes terakhir. Itu adalah UX yang luar biasa.

Kesimpulan untuk Developer

Sebagai developer, kamu bertugas mewujudkan desain ke dalam bentuk kode. Jika kamu melihat desain tombol Cancel dan Submit memiliki warna hijau yang sama terangnya, kamu harus kritis karena itu adalah UX yang buruk (pengguna bisa salah klik). Aplikasi yang sukses adalah aplikasi yang memiliki keseimbangan antara UI yang rapi dan UX yang intuitif.