Ketika Otak, Perut, dan Dompet Tidak Cukup: Beda antara UX dan UI

Baru pertama kali saya melihat debat terbuka dalam rangka Pilkada DKI Jakarta 2017 yang disiarkan secara langsung di televisi.

Sebagai seorang praktisi UX yang lahir dan besar di Jakarta, saya sudah banyak melihat banyak perubahan positif yang terjadi di Ibu Kota negara Indonesia dalam lima tahun terakhir. Saya berharap perubahan positif terus terjadi. Walaupun masih angan-angan, yang pasti debat ini sudah memotivasi saya untuk memilih calon yang terbaik dari calon-calon yang ada secara aktif, entah pada akhirnya nanti siapa yang terpilih menjadi pemimpin DKI Jakarta dalam jangka waktu lima tahun ke depan.

Image for post
Image for post

Otak, Perut, dan Dompet

Metafora dan retorika yang dikemukakan oleh kedua calon ini kebetulan sangat erat dengan bidang yang saya geluti, yaitu: User Experience (UX) atau Pengalaman Pengguna, terutama terkait dengan perbedaan antara UX dan UI.

Dalam sebuah proses Pengalaman Pengguna (UX), otak bisa diasosiasikan dengan data, kecerdasan, pengetahuan, pengalaman, ilmu, dan keterampilan.

Perut bisa diasosiasikan dengan kebutuhan fisik, pemenuhan kepuasan fisik, dan konteks sehari-hari.

Dompet bisa diasosiasikan dengan kepentingan finansial, keuntungan atau profit, bottom line, Return on Investment (ROI), dan investasi.

Hati bisa diasosiasikan dengan emosi, branding, keloyalan (loyalty), persuasi, kebiasaan (habit), kebudayaan (culture), dan tradisi (custom).

Membahas perbedaan antara UX dan User Interface (UI) atau Antarmuka Pengguna dari metafora dan retorika di atas, mana yang bisa diasosiasikan dengan UI?

Sebelum menjawab pertanyaan di atas, kita harus mengerti apa yang dimaksud dengan UI.

UI adalah antarmuka yang digunakan pengguna untuk berinteraksi dengan sebuah sistem dalam mencapai tujuan penggunaan. Sebuah ciri utama dari UI adalah keberadaannya secara fisik yang bisa dipersepsikan oleh panca indera manusia.

Walaupun ada istilah Tangible UI yang lebih spesifik mendeskripsikan antarmuka dimana pengguna berinteraksi dengan sistem digital melalui lingkungan fisik, saya lebih sering menggunakan istilah UI yang lebih umum karena bisa dipakai dalam konteks sistem digital dan non-digital dalam lingkungan fisik dan maya.

Tabel Berikut adalah salah satu contoh persepsi umum mengenai UX dan UI.

Image for post
Image for post

Untuk melengkapi komponen UI design, tentu saja kita bisa menambahkan Auditory design (perancangan yang berhubungan dengan pendengaran), Touch design (perancangan yang berhubungan dengan sentuhan), Smell design (perancangan yang berhubungan dengan penciuman), dan Taste design (perancangan yang berhubungan dengan rasa yang dirasakan oleh lidah).

Dalam konteks produk bisnis umum yang ada di pasar internasional, termasuk Indonesia pada saat ini (2017), perancangan yang dominan dalam UI adalah visual, auditory dan touch design. Sedangkan smell dan taste design baru berkembang dalam tahap protipe.

Di Indonesia pada khususnya, penekanan UI Design pada awalnya hanya pada visual design. Hal ini bisa dilihat dari berbagai spesifikasi proyek, lowongan pekerjaan, dan latar belakang dari UI Designer di berbagai perusahaan di Indonesia. Walaupun begitu, saya sudah melihat kebutuhan UI Designer untuk meningkatkan keterampilan profesionalnya dengan repertoar touch design. Kebutuhan ini timbul dikarenakan kebutuhan pasar untuk merancang aplikasi dan situs berbasis sentuh atau mobile. Berangkat dari tuntutan ini, keterampilan touch design pada umumnya diintegrasikan dalam semua program pelatihan UX Indonesia yang berhubungan langsung dengan UI.

Hal lain yang menarik dari debat Pilkada DKI Jakarta tersebut adalah penggunaan data oleh calon yang seringkali dipakai sebagai acuan klaim atau sanggahan. Kemudian acuan datanya apa?

Sebuah sumber yang bisa diacu adalah pilkada-dki.beritagar.id yang berusaha menampilkan data seobyektif mungkin untuk Pilkada DKI Jakarta 2017. Situs ini merupakan suatu contoh bagaimana sebuah proses UX bisa memperbaiki UI.

Image for post
Image for post

Walaupun masih jauh dari sempurna, dimana data yang ada di situs tersebut masih terbatas dan bisa diinterpretasikan dan dipersepsikan dengan berbeda-beda, paling tidak pola pikir menggunakan data untuk memilih dan mengambil keputusan sudah mulai diperkenalkan di Indonesia. Hal ini kebetulan juga merupakan sebuah dasar yang penting dalam sebuah proses UX, misalnya: Design Sprint.

Coba bandingkan situs di atas dengan situs berikut: ipapa.co.id

Image for post
Image for post

Cukup kontras bukan perbedaannya?

Before and after: Visi dan Misi Pasangan Calon

Image for post
Image for post
Image for post
Image for post

Before and After: Peta Interaktif

Image for post
Image for post
Image for post
Image for post

Before and after: Grafik Interaktif

Image for post
Image for post
Image for post
Image for post

Kembali ke otak, perut, dompet, dan hati. Setelah membaca, sudah jelaskah bagi Anda dari metafora otak, perut, dompet, dan hati, mana yang bisa diasosiasikan dengan UI?

Credit: Thank you to Pak Erwin Susilo for supplying some of the screenshots from pilkada-dki.beritagar.id.

Disclaimer: This is my personal opinion. If you do not like an onion, do not eat one. If you do not like my personal opinion, do not read one. My personal opinion has no professional relationship whatsoever with my current affiliation with UX Indonesia or any other entities.

Penyangkalan: Saya mempunyai keterkaitan emosional dan kepentingan profesional terkait dengan perancangan situs mobile pilkada-dki.beritagar.id

Written by

As a Google Mentor and Certified Design Sprint Master, Josh has a passion for the design, development, and use of ICT in solving business and humanity problems

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store