Website

Search

Pahami Prinsip Gestalt untuk Design UI/UX!

Pahami Prinsip Gestalt untuk Design UI/UX!

Desain UI baik itu website atau aplikasi membutuhkan kreativitas dan inspirasi yang bisa menarik pengunjung untuk bertahan lama di aplikasi atau website buatan desainer. Jika tampilan UI biasa-biasa saja. Pengunjung akan pergi dengan cepat karena warna yang kurang mungkin atau tampilan nya kurang memadai.   

Apa itu prinsip Gestalt?  

Prinsip gestalt adalah seperangkat prinsip yang berasal dari psikologi Gestalt, yang mempelajari bagaimana manusia memandang dan mengorganisir elemen visual menggunakan psikologi manusia. Dalam UI design, prinsip ini dapat membantu memberikan tampilan yang menarik dan terorganisir. Pencetus teori Gestalt tersebut adalah Max Wertheimer, Wolfgang Kohler and Kurt Koffka.   

Prinsip Gestalt  

  1. Prinsip Kedekatan (Proximity)  

Prinsip kedekatan ini adalah elemen yang berada dekat satu sama lain cenderung dianggap sebagai bagian dari grup yang sama. Contoh nya seperti label dan input form, harus diletakkan berdekatan untuk menunjukkan hubungan mereka.  

AD_4nXfagM7xh-r-zslBrLtiXZzBuiRi90a6sMY6024x-5VHX00NsCzoxpVpjo0HbRu-eBZb904p8jOSOT8KPu9rtRHV0D0s08gu7DmRAH5pmfgz7Z1xPhUS5iN5Jqh_8WrMV54PeWbGan72nOf3ULyFhWwnh7Js?key=oLrCY3BlEutfR0e2z3NY2Q  

  1. Prinsip Kesamaan (Similarity)  

Prinsip kesamaan adalah prinsip dimana elemen yang tampak serupa dalam warna, bentuk, ukuran, dll dianggap sebagai bagian dari grup yang sama. Prinsip ini dapat membantu pengguna (User) mengenali pola dan keterkaitan antar elemen di dalam interface. Contoh nya, Tombol action seperti "Submit", "Save", dan "Cancel" diberi warna dan bentuk yang sama untuk menunjukkan bahwa mereka adalah elemen interaktif yang serupa. Ini membantu pengguna (User) mengenali dan mengingat fungsi tombol-tombol ini dengan lebih mudah.  

  1. Prinsip Penutupan (Closure)  

Prinsip penutupan adalah prinsip yang bisa digunakan untuk menyarankan bentuk atau struktur tanpa harus menampilkan elemen-elemen dalam tampilan secara lengkap. Pikiran manusia cenderung mengisi kekosongan dalam ruangan nya untuk menciptakan bentuk yang lengkap dari kehampaan/kekosongan tersebut. Sebagai contoh, icon dengan desain yang sederhana tetapi tidak lengkap, seperti ikon keranjang belanja yang hanya terdiri dari beberapa garis, tetap mudah dikenali oleh pengguna (User) karena otak mereka mengisi bagian yang hilang.  

AD_4nXdUJmCe5pRUA4A8L5LgogRqTfaT0gU5wr5sq4lZnDRLp277IlD_RgvDG3ziF1dMa3yOE3rJOtApYlf4ulN_pPQQDP-XVEQ-rhJ2lTqFW0liihA3WILwxHy5EO_DGz9UQ2fNGjl5L75LZEkPvNaSSNBKPQ?key=oLrCY3BlEutfR0e2z3NY2Q  

Source: Shopee.com  

  1. Prinsip Kontinuitas (Continuity)  

Pada prinsip kontinuitas (Continuity), elemen yang diatur dalam garis/kurva cenderung dilihat sebagai satu kesatuan atau pola berkelanjutan. prinsip ini bisa membantu dalam menciptakan navigasi yang lancar dan alur informasi yang jelas dalam desain. Contoh yang bisa kita pakai untuk prinsip ini, Breadcrumb navigation menunjukkan jalur pengguna (User) di dalam sebuah aplikasi atau situs web. Dengan menghubungkan setiap langkah dengan garis atau panah, pengguna (User) dapat dengan mudah memahami alur navigasi dan mengetahui di mana mereka berada dalam struktur situs.  

  1. Prinsip Simetri Dan Urutan (Symmetry and Order)  

Pada prinsip symmetry and order, desain yang simetris dan teratur cenderung lebih menyenangkan dan mudah dipahami oleh pengguna (User). prinsip ini bisa diterapkan dengan tata letak halaman atau struktur menu yang simetris dan teratur. Contoh pada prinsip ini, form input yang disusun dalam grid yang simetris dengan label dan field input yang sejajar memberikan kesan keteraturan dan profesionalisme, serta memudahkan pengguna (User) dalam mengisi form.  

  1. Prinsip Figur Dan Latar Belakang (Figure and Background)  

Pada prinsip figure and background, pentingnya memastikan bahwa elemen interaktif (seperti tombol navigasi, dan hyperlink) terlihat jelas dan tidak tenggelam dalam background pada halaman tersebut. jika tombol tersebut dipasang dengan opacity yang sangat tinggi hingga hampir tak terlihat/transparan akan membingungkan pengguna (User) dan merusak visual elemen pada halaman tersebut. Contoh nya, ketika modal dialog muncul, background seringkali di-blur atau digelapkan untuk menyoroti dialog tersebut sebagai elemen utama. Ini membantu pengguna (User) fokus pada tugas yang sedang mereka lakukan dalam modal dialog tersebut.  

  1. Prinsip Keterhubungan (Connectedness)  

Pada Prinsip keterhubungan (connectedness), Elemen yang terhubung dengan garis dan bentuk lainnya dianggap memiliki hubungan. prinsip keterhubungan ini bisa digunakan untuk menunjukkan keterkaitan antar elemen. Contoh nya, dalam aplikasi project management atau workflow, tugas dan aktivitas dihubungkan dengan garis atau panah yang menunjukkan hubungan dan alur kerja antar elemen. Ini memudahkan pengguna (User) dalam memahami proses atau urutan tindakan yang harus dilakukan.  

AD_4nXejE6LNER32VHpAdlSavJmxQdB2UyomBE7qAUmYjdlEjK3acJmJmd2O42piAO9gaRt6edRJmSlwwQz7w5x_O1aC0TBJGPetAmTypJ8HZETzYeCBxOPVhx2U3P85WNQR7JYVfvDfKZx09_d_CPRLiG7sAFk?key=oLrCY3BlEutfR0e2z3NY2Q

  

Source: Figma (Redesign Mobile celular app project)  

Fokus Utama Prinsip Gestalt  

Fokus utama dalam menerapkan prinsip gestalt ini adalah memahami dan memanfaatkan cara manusia mengorganisir dan memproses informasi visual secara pemikiran alami nya. Dengan memahami bagaimana pemikiran otak manusia mengelompokkan elemen visual dan menciptakan pola dari apa yang mereka lihat, desainer dapat membuat antarmuka yang lebih intuitif dan efektif. Prinsip Gestalt membantu dalam:  

  1. Meningkatkan Keterbacaan dan Pemahaman:  

Keterbacaan dan pemahaman pada desain sangat penting agar informasi tidak disalahpahami dan tidak membuat para pengguna (User) merasa kebingungan. Dengan mengelompokkan elemen yang terkait dan memastikan keterkaitan visual yang jelas, pengguna (User) dapat dengan cepat memahami struktur dan fungsi dari antarmuka.  

  1. Memfasilitasi Navigasi:  

Membantu pengguna (User) dalam menemukan dan memahami jalur navigasi dengan lebih mudah melalui tata letak yang logis dan konsisten.   

  1. Meningkatkan Estetika:  

Prinsip Gestalt juga berkontribusi pada keindahan visual desain, membuat antarmuka lebih menyenangkan dan menarik untuk digunakan. Karena pemikiran manusia suka dengan estetika yang terlihat rapi dan terorganisir.   

  1. Menyederhanakan Interaksi:  

Dengan mengurangi kekacauan visual dan fokus pada elemen penting, prinsip ini membantu dalam menciptakan antarmuka yang lebih mudah untuk berinteraksi dan mengurangi beban kognitif pengguna (User).  

  1. Memastikan Konsistensi:  

Menggunakan prinsip-prinsip seperti kesamaan dan keterhubungan, desainer dapat menciptakan konsistensi di seluruh elemen interface, yang meningkatkan kepercayaan pengguna (User) dan memudahkan pembelajaran informasi yang dikunjungi.  

Belajar UI/UX design bersama kami  

Belajar UI/UX design dan Product manager bersama kami di Harisenin.com. Di Harisenin.com, kamu bisa belajar online bersama dengan expert kami. Kamu akan belajar cara mendesain UI/UX yang menarik dan membuat sebuah project UI/UX design sebagai portfolio kamu. Cara nya kamu bisa mengunjungi halaman  Bootcamp UI/UX design & Product manager di Harisenin.com dan daftar sebagai member untuk mengikuti bootcamp nya. Atau, kamu bisa konsultasi dulu lewat  No Wa ini atau  kirim DM di Instagram kami  

 

Baca juga: 

Rina Rachmawati

Rina Rachmawati

Hi, I'm Rina! I'm interested in writing, especially articles and fiction stories. I understand and can apply SEO into articles very well, I'm creative person and love to learn something new.