School of Information Systems

Pentingnya Hirarki Visual Dalam Desain UI/UX dan praktiknya

Hiraki visual dapat diartikan sebagai sebuah prinsip dalam desain yang memerhatikan importance level dalam desain sehingga semakin penting sebuah komponen, maka komponen desain tersebut harus dibuat lebih menonjol dari komponen lain yang secara skala prioritas berada di bawah. Hierarki visual sendiri memegang peran yang sangat penting dalam perancangan desain user interface karena dapat mempengaruhi psikologis pengguna untuk lebih mudah mendapatkan informasi atau melakukan sebuah aksi. Dalam praktik menerapkan hirarki, UI designer dapat memerhatikan beberapa prinsip hirarki sebagai berikut: 

  • Ukuran dan skala 

Prinsip yang pertama adalah semakin penting sebuah komponen maka kita dapat membuat ukurannya lebih besar dibandingkan dengan komponen lainnya. Dengan membuat perbedaan ukuran antar komponen, maka penguna dapat lebih mudah mengindentifikasi komponen yang ukurannya lebih besar saat penglihatan pertama pada halaman aplikasi. 

  • Warna dan kontras 

Kontras warna juga adalah hal yang sangat mempengaruhi penglihatan pengguna terhadap komponen. Semakin besar kontras komponen dengan latar belakangnya, maka semakin terlihat juga komponen itu di mata pengguna. 

  • Tipografi 

Permainan tipografi meliputi jenis, ukuran, bold, italic, dan space dari tipografi sangat mempengaruhi hirarki dari informasi yang ingin disampaikan. Ada jenis font yang bersifat tegas ada pun yang cenderung tipis. Semakin tebal dan tegas tipografi yang digunakan, maka informasi yang ingin disampaikan akan terlihat lebih dahulu oleh pengguna. 

  • Pola baca 

Prinsip membaca pengguna cenderung dimulai dari kiri ke kanan diikuti juga dengan atas ke bawah. Sehingga secara pola dan analisis yang dilakukan terhadap pengguna, pengguna punya kecenderungan membaca dengan pola F pada membaca website. Sehingga semakin pojok kiri atas sebuah komponen, maka semakin besar kemungkinannya pengguna melihat komponen tersebut terlebih dahulu. 

  • Proximity 

Prinsip proximity adalah prinsip yang menyatakan bahwa segala komponen sejenis harus dikelompok dan dan memiliki jarak yang sama. Namun, antar kelompok perkumpulan komponen tersebut harus memiliki jarak berbeda bahkkan cenderung harus lebih jauh. 

  • White space 

Semakin banyak ruang kosong yang kamu berikan pada desain mu, maka akan semakin fokus juga pengguna pada komponen. Semakin banyak komponen yang ada pada halaman tersebut, maka pengguna juga semakin tidak bisa menentukan fokus utama. Maka dari itu, pastikan untuk komponen utama harus memiliki white space yang cukup disekitarnya. 

Referensi: 

https://glints.com/id/lowongan/prinsip-hierarki-visual/#.Y0Yp83ZBzIU  

https://webdesign.tutsplus.com/id/articles/understanding-visual-hierarchy-in-web-design–webdesign-84  

Lisa Mega Tanto Kusumo