Pentingnya Visual Hierarchy Pada Desain
Salah satu artikel yang juga membahas pentingnya Visual Hierachy yaitu tulisan Dwinawan yang berjudul “Kenapa Visual Hierarchy itu penting?”. Itu adalah salah satu artikel berbahasa indonesia yang saya rekomendasikan untuk kalian baca terlebih dahulu sebelum membaca tulisan ini.
Sebelumnya kita lebih baik berkenalan terlebih dahulu apa itu Visual Hierarchy.
Apa Itu Visual Hierarchy ?
Visual Hierarchy adalah sebuah prinsip tata letak (layout) elemen desain yang tujuannya menampilkan hal penting lebih dulu, kemudian yang lebih tidak penting. Artinya, desain tersebut harus mampu menampilkan poin utama dan dipahami oleh siapa pun yang melihat.
Visual hierarchy digunakan untuk memberi tingkatan elemen desain dan pengaruh dalam urutan yang kalian inginkan, ketika terlihat oleh pengguna. Dengan menggunakan prinsip-prinsip seperti kontras, skala, keseimbangan, dan masih banyak lagi.
Prinsip visual hierarki ini berlaku luas, untuk segala sesuatu yang bisa didesain, mulai dari poster, flyer, website, hingga tampilan apps.
Bisa dibilang, prinsip ini sangat berguna bagi para UI designer. Pernahkah kalian membuka sebuah aplikasi, tapi bingung mana yang ingin kalian cari karena semua kelihatan sama dan membingungkan? Nah, jika pernah, design UI yang dipakai mungkin belum sesuai dengan prinsip-prinsip visual hierarki.
Apa Saja Prinsip Visual Hierarchy?
Berikut prinsip-prinsip visual hierarki yang yang dapay kalian pelajari
Pola Membaca
Ada dua pola membaca yang menjadi prinsip dalam hierarki visual, yakni pola F dan pola Z.
Pola membaca Z biasanya lebih banyak dipakai untuk situs yang berbasis gambar. Hal ini karena otak manusia memproses gambar lebih cepat ketimbang teks.
Lewat pola ini, informasi penting akan diletakkan di paling atas.
Setelahnya, pengguna akan menyapu pandangannya ke sebelah kanan, untuk kemudian secara diagonal melihat apa yang ada di kiri bawah. Itu sebabnya, pola ini disebut sebagai pola Z.
Pola membaca F adalah pola yang paling umum digunakan banyak orang. Sebab, ini adalah pola yang juga kita gunakan ketika membaca sehari-hari. Beberapa menyebutnya sebagai pola E.
Kita akan mulai membaca dari kiri kemudian ke kanan, baru beranjak ke informasi yang ada di bawahnya. Pola F biasanya digunakan untuk halaman website tradisional, teks-teks berat, atau postingan blog.
Ukuran
Sederhananya, gambar yang lebih besar tentu akan lebih menarik perhatian bagi pembaca di banding gambar atau komponen lainnya yang berukuran lebih kecil. Bukan hanya untuk menarik perhatian, elemen yang berukuran besar seharusnya membawa pesan yang paling penting.
Kamu juga perlu memperhatikan skala dari gambar tersebut. Apalagi, jika kamu akan menampilkan beberapa elemen desain. Jangan membuat ukuran yang terlalu besar, karena dapat mengurangi keterlihatan elemen lainnya.
Pemilihan Warna
Dalam desain penggunaan dan pemilihan warna sangat penting karena dapat memberi arti penting pada elemen desain. Warna-warna yang lebih cerah umunya dapat menarik perhatian daripada warna-warna yang cenderung datar. Warm colors, seperti merah atau kuning akan lebih standout jika disandingkan dengan background berwarna gelap (cool color).
Demikian pula warna dengan kontras yang lebih tinggi akan tampak lebih dekat ke pemirsa. Meski kontras warna membantu menonjolkan desain, menggunakan terlalu banyak juga akan membuat bingung. Hal ini akan mengaburkan elemen desain yang penting.
Tipografi
Pemilihan tipografi adalah salah satu hal penting dalam visual hierarchy. Pemilihan tipografi yang tepat dapat memberikan karakter pada design kalian dan dapat menarik pembaca di area tertentu. Tipografi dengan ukuran dan bobot yang tepat juga dapat digunakan agar elemen teks menjadi lebih menonjol.
Mengombinasikan beberapa ukuran font dalam satu desain juga dapat membantu menentukan elemen paling penting dari sebuah desain. Contoh yang dapat kita temukan dengan mudah yaitu dalam surat kabar. Beberapa di antaranya ditulis dengan beragam ukuran font, untuk menentukan berita mana yang jadi tajuk utama.
Space
Whitespace adalah istilah yang digunakan untuk menggambarkan jarak antar elemen dalam suatu desain. Ini dapat digunakan untuk mengelompokkan elemen bersama atau memisahkannya, untuk memberikan atensi pada pembaca.
Dalam mendesain, terkadang ada keinginan untuk memenuhi ruang-ruang kosong yang masih tersisa.
Padahal, menciptakan ruang kosong merupakan salah satu prinsip hierarki visual yang penting. Adanya ruang kosong pada desain yang kamu buat bisa membuat objek utamamu menjadi “terlihat”. Sebaliknya, menambah terlalu banyak gambar justru akan membuat desainmu tampak ramai dan kehilangan fokus.
Kedekatan (proximity)
Menempatkan beberapa objek berdekatan merupakan salah satu prinsip dasar dalam menyampaikan pesan pada format visual.
Objek yang ditempatkan berdekatan menandakan bahwa elemen-elemen tersebut memiliki hubungan.
