Kenapa Hierarki dalam UI Design Penting, Baca Alasannya

Desain memang tentang estetika, tapi tak hanya itu, desain juga harus berguna untuk menyampaikan informasi dengan lebih baik. Apalagi jika desain digunakan untuk alat pemasaran atau jadi tombak utama untuk menarik perhatian utama, salah satu contoh aplikasinya ada di desain website.
Website yang baik tidak cuma menarik secara tampilan, namun juga mampu menampilkan informasi yang jelas. Cara menampilkan informasi ini akan terbantu jika memiliki tampilan antar muka (interface) yang mendukung atau. Salah satu cara untuk bisa memberikan informasi dengan baik kepada pengunjung website adalah dengan menerapkan hirarki dalam desain user interface website.
Pengertian Hierarki Visual
Secara umum, pengertian hirarki visual adalah untuk memberikan penekanan di satu elemen dengan tujuan menarik perhatian mata pengunjung. Dengan memberikan fokus pada elemen tertentu, pengunjung seakan dipandu untuk membaca informasi yang ditampilkan.
Hierarki visual juga bisa ditampilkan dengan konsep cukup sederhana. Misal dengan memberikan warna berbeda, memberikan highlight atau memberikan ukuran yang berbeda. Intinya sebagai pembeda dan jadi panduan untuk mata agar tidak semua elemen berbentuk dan berwarna sama.
Kenapa Hierarki Menjadi Penting?
Seperti dijelaskan sebelumnya, hirarki visual yang kuat memberikan panduan kepada pengunjung dari mana memulai atau mana informasi yang paling penting. Dengan begitu, proses penyampaian informasi akan menjadi lebih efektif.
Dalam sebuah website yang punya struktur baik, pengunjung lebih bisa menangkap informasi yang disampaikan dengan begitu, mereka pun lebih mudah mengerti apa yang harus dilihat dan dibaca berikutnya. Alhasil, tujuan penyampaian informasi melalui website bisa tercapai dengan lebih maksimal, tingkat konversi juga bisa lebih tinggi.
Cara Membangun Hierarki dalam Desain UI Desain
Desain UI desain dalam sebuah website punya peran penting dalam proses penyampaian informasi kepada pengunjung. Hirarki visual adalah salah satu elemen UI desain untuk memberikan panduan bagi pengunjung dengan memberikan focal point dalam satu elemen.
Ada beberapa cara untuk membuat hierarki dalam desain website, bisa menggunakan unsur dasar seperti garis, bentuk, ruang, warna, ukuran yang akan kita ulas di bawah ini:
– Menggunakan Unsur Garis
Garis bisa memberikan sebuah hirarki visual pada desain website. Penerapan garis secara umum bisa memberikan kesan pembatas antara satu bagian dengan bagian yang lain. Selain itu, garis juga dapat memperindah tampilan layout.
– Bentuk
Berdasarkan sifatnya, bentuk bisa dikategorikan menjadi 3 yakni, huruf, simbol dan bentuk nyata (contohnya segitiga, kotak, lingkaran dan bentuk lainnya). Selain itu, bentuk bisa berupa objek 2 dimensi maupun 3 dimensi.
Foto atau gambar adalah salah satu penerapan unsur bentuk dalam desain website. Penggunaan foto dengan ukuran besar dalam website dapat menarik perhatian pengunjung, menjaga mata tetap fokus kepada pesan yang ingin disampaikan.
– Ruang Kosong / Whitespace
Sekalipun dinamakan whitespace bukan berarti ruang kosongnya harus berwarna putih, ia bebas diisi warna apapun asalkan bebas dari unsur teks, gambar serta elemen lainnya. Dilihat dari unsur fisiknya, whitespace diidentifikasikan menjadi dua unsur, yaitu objek (figure) dan latar belakang (background).
Whitespace adalah tentang mengatur tata letak elemen serta memandu pengunjung memperhatikan elemen tertentu. Salah satu website yang terkenal dengan penerapan whitespace ini adalah halaman pencarian google.
– Warna dan Kontras
Warna dan kontras punya pengaruh besar pada hirarki visual. Kombinasi keduanya dapat menarik perhatian mata. Warna yang berlawanan menimbulkan kontras sehingga lebih bisa menarik perhatian.
– Hierarki dengan Tekstur
Dalam desain visual, tekstur tak bisa disentuh atau diraba. Meski begitu, tekstur atau yang juga disebut corak bisa tetap digunakan untuk memberikan dimensi, sebagai penegasan dan juga memberikan emosi atau rasa tertentu.
– Hierarki dengan Ukuran (Contrast Size)
Ukuran yang kontras adalah kunci dari hirarki visual. Dengan menggunakan perbandingan ukuran ini, kamu bisa menciptakan kontras dalam sebuah desain. Tujuannya jelas, untuk memberikan penekanan terhadap elemen tertentu atau menonjolkan sisi menarik yang menjadi bagian utama dari sebuah desain.
Hierarki yang bisa dibentuk dari ukuran/kontras adalah tipografi, foto, bentuk, garis hingga whitespace.
Uraian di atas menjelaskan mengapa hirarki penting dalam proses ui desain. Ia ibaratnya petunjuk jalan atau baliho dengan lampu warna-warni di jalan untuk menarik perhatian. Kreasikan sendiri komposisi serta layout hierarki berbeda untuk memaksimalkan proses penyampaian informasi di website kamu. Karena desain tak hanya estetika, tapi juga merupakan fungsi.

Sumber: 1 2