Risers, kamu pernah nggak sih pas lagi buka aplikasi yang desainnya keren banget, penuh warna, dan animasi tapi kamu malah bingung mau klik apa? Atau sebaliknya, ada aplikasi yang tampilannya biasa aja, tapi kamu merasa nyaman dan gampang banget menggunakannya?
Nah, itu adalah peran dari User Experience (UX) Design loh.
5 Elemen Dasar UX Design dari Jesse James Garrett
Kalau kamu baru mulai belajar tentang UX Design, mungkin kamu bertanya-tanya, “Sebenarnya apa saja sih yang harus dipikirkan supaya sebuah aplikasi atau website terasa nyaman dan gampang digunakan?” Nah, untuk menjawab itu, Jesse James Garrett , seorang pakar UX, memperkenalkan konsep yang dikenal dengan Five Planes of UX Design atau Lima Elemen Dasar UX Design .
Beliau menjelaskan kalo bikin pengalaman pengguna yang oke itu nggak instan. Kayak kamu bangun rumah, nggak bisa langsung dekor tanpa bikin pondasi dulu. Nah, UX Design juga gitu, ada proses dari hal-hal yang nggak kelihatan sampai ke tampilan yang kamu pakai langsung.
Nah, aplikasi atau website yang terasa gampang dan nyaman digunakan itu sebenarnya adalah hasil dari serangkaian keputusan desain loh. Mulai dari hal kecil sampai keputusan besar.
Berikut adalah 5 elemen dasar UX Design dari Jesse James Garrett:
Surface (Permukaan)
Ini adalah hal pertama yang kamu lihat saat membuka sebuah aplikasi atau website. Di sini ada teks, gambar, tombol, ikon, dan elemen visual lainnya. Contohnya, kamu melihat foto produk, logo brand, atau tombol "Beli Sekarang". Sebagian dari elemen ini bisa diklik (interaktif), dan sebagian hanya hiasan atau informasi visual. Intinya, surface adalah lapisan paling atas yang berinteraksi langsung dengan mata pengguna, tetapi bukan satu-satunya penentu kenyamanan pengguna.
Skeleton (Kerangka)
Di balik permukaan yang terlihat, ada kerangka yang mengatur posisi dari semua elemen tadi. Skeleton berperan untuk menentukan tata letak: di mana tombol ditempatkan, di mana teks muncul, dan bagaimana elemen-elemen saling tersusun. Misalnya, tombol “Checkout” diletakkan di pojok kanan atas supaya mudah ditemukan atau “navigasi utama” dibuat tetap terlihat saat pengguna scroll halaman. Dengan kerangka yang baik, pengguna tidak hanya merasa tampilan aplikasinya rapi, tapi juga lebih mudah memahami informasi.
Structure (Struktur)
Lapisan ini adalah “alur” di balik kerangka. Structure menjelaskan bagaimana pengguna berpindah dari satu halaman ke halaman lain dan bagaimana informasi diatur. Misalnya, dari homepage ke halaman produk, lalu ke keranjang, dan akhirnya ke pembayaran. Semua itu diatur di level ini. Structure berfungsi untuk menyusun perjalanan pengguna ( user flow ) agar terasa logis dan terarah.
Scope (Ruang Lingkup Fitur)
Scope berkaitan dengan fitur-fitur yang akan disediakan dalam sebuah produk digital. Di sini diputuskan fitur apa saja yang akan ada dan tidak akan ada. Contohnya, apakah pengguna bisa menyimpan alamat pengiriman untuk pembelian berikutnya? Apakah ada fitur “wishlist”? Semua hal tersebut ditentukan di tahap scope. Scope berfungsi sebagai batasan sekaligus panduan agar produk tetap fokus dan tidak terlalu rumit bagi pengguna.
Strategy (Strategi)
Ini adalah fondasi dari semuanya. Strategi menjawab dua pertanyaan utama: apa yang diinginkan pengguna dari produk ini dan apa yang ingin dicapai oleh pemilik produk? Misalnya, pengguna ingin proses belanja yang mudah dan cepat. Sementara dari sisi bisnis, tujuannya bisa berupa peningkatan penjualan atau pengumpulan data pelanggan. Singkatnya, strategi adalah arah besar yang menentukan keputusan di lapisan-lapisan berikutnya.
Gimana Sih 5 Elemen UX Ini Saling Terhubung?
Picture by: https://www.softformance.com
Kelima elemen UX Design di atas bisa dibayangkan seperti proses membangun rumah dari nol. Kamu tentu nggak bisa mulai dari memasang atap dulu, kan? Semua harus berurutan: mulai dari menggali pondasi, bikin kerangka, lalu naik ke dinding dan atap. Nah, proses desain UX juga seperti itu, dibangun dari bawah ke atas secara bertahap. Strategy
S trategy , fokus kita masih ada pada hal-hal besar yang abstrak. Misalnya, apa tujuan bisnis dari aplikasi ini? Apa yang dibutuhkan pengguna? Ibarat membangun rumah, ini adalah saat kamu menentukan: rumah ini mau dipakai untuk apa? Apakah rumah keluarga, rumah kontrakan, atau cafe kecil?
S cope . Di sini kita mulai mendefinisikan fitur apa saja yang dibutuhkan. Apakah aplikasi ini perlu fitur login? Apakah pengguna bisa menyimpan produk favorit? Ini seperti kamu menentukan isi rumah: berapa kamar yang dibutuhkan, perlu dapur besar atau tidak, dan sebagainya.
Structure , yang mulai menyusun bagaimana semua fitur itu diatur. Misalnya, kalau pengguna klik "keranjang", dia akan diarahkan ke halaman checkout . Ini seperti menentukan denah rumah: kalau dari ruang tamu, ke mana arah dapur? Di mana letak kamar mandi?
Skeleton , yaitu tata letak elemen seperti tombol, teks, gambar, dan navigasi. Di tahap ini, kamu sudah menggambar sketsa interior rumah. Di mana pintu diletakkan, jendela ada di sebelah mana, dan perabotan disusun bagaimana agar alurnya nyaman.
Surface adalah visual akhir yang dilihat pengguna. Mulai dari warna tombol, jenis font, gambar produk, dan sebagainya. Ini seperti mengecat rumah, memilih furniture, dan dekorasi agar tampilannya menarik dan bikin betah.
Yang perlu kamu ingat, setiap lapisan ini saling bergantung. Kamu nggak bisa mendesain tampilan kalau belum tahu fitur dan strukturnya. Kalau salah satu bagian loncat atau nggak sinkron, bisa berantakan semua. Contohnya, kamu bikin tampilan keren tapi ternyata navigasinya membingungkan, pengguna bisa frustasi dan langsung keluar dari aplikasi.
Baca juga: 10 Plugin Figma Terbaik 2022 untuk UI UX Designer
Kesimpulan
Dari penjelasan tadi, kamu bisa lihat bahwa UX Design bukan sekadar soal tampilan yang menarik, tapi tentang bagaimana sebuah produk digital bisa memberikan pengalaman yang nyaman, jelas, dan memudahkan pengguna. Lima elemen dari Jesse James Garrett ( strategy, scope, structure, skeleton , dan surface ) membantu kita memahami bahwa desain yang baik dibangun secara bertahap, dari fondasi ide dan tujuan, hingga tampilan akhir yang bisa dilihat dan digunakan. Setiap keputusan di satu tahap akan mempengaruhi tahap berikutnya, seperti efek domino yang menentukan arah dan kualitas keseluruhan produk.
Dengan mengikuti urutan ini, kita bisa menghindari banyak masalah desain seperti fitur yang membingungkan, navigasi yang rumit, atau tampilan yang tidak selaras dengan kebutuhan pengguna. Jadi, jika kamu ingin menjadi UX Designer yang andal, mulailah dari memahami strategi dan kebutuhan pengguna, bukan langsung memilih warna atau font. Dari pemahaman itulah desain yang fungsional sekaligus menyenangkan bisa tercipta.
Gimana nih, Risers? Udah makin paham kan tentang 5 elemen UX Design dong. Kalau kamu ingin belajar lebih dalam dan siap jadi UX Designer profesional, kamu bisa ikut Bootcamp UI/UX dan Product Manajer dari Harisenin , loh!
Yuk, asah skill kamu dan mulai perjalanan jadi UX Designer bareng Harisenin!
Referensi: Jesse James Garrett, The Elements of User Experience: User-Centered Design for the Web and Beyond , edisi kedua, New Riders, 2011.
