GROUPING
Dwinawan Hariwijaya
• • •
Apa itu Grouping?
Mari kita lihat design dashboard dibawah ini dan apa pendapatmu? Apakah mudah dibaca dalam beberapa detik setelah melihat? Apakah mudah untuk membedakan mana batas konten satu dengan yang lain?
Asumsi saya, setelah beberapa detik melihat design dashboard di atas kesan nya adalah semua nya jadi satu, tidak ada pemisah yang jelas antar bagian.
Dan itulah penting nya grouping, untuk mengelompokkan, untuk memisahkan, membantu user untuk membaca informasi atau konten dengan nyaman tanpa terganggu dengan konten disekitarnya.
• • •
Metode Grouping
Mari kita bahas metode grouping yang sering digunakan. yang paling simple dan mudah adalah menggunakan garis pemisah seperti dibawah ini.
Warna garis cukup jelas dan tebal sehingga mudah untuk melihat batas antar konten.
Selanjutnya adalah menggunakan metode memasukkan konten ke sebuah kotak atau istilah nya card layout.
Grouping dengan cara ini lebih jelas dibandingkan dengan cara menggunakan garis. Karena perbedaan background konten yang mana berwarna abu abu dengan
background kotak yang berwarna putih sangat mencolok.
Selanjutnya adalah menggunakan metode color block dan garis seperti gambar dibawah ini
Color block untuk memisahkan konten navigasi dengan konten utama dashboard. Lalu garis digunakan untuk memisahkan antar konten utama nya.
Selanjutnya adalah menggunakan metode color block, garis dan jarak.
Metode jarak untuk memisahkan konten navigasi dengan konten utama. Metode garis untuk memisahkan antar konten utama yang berada di tengah. Lalu metode color block untuk memisahkan antar konten utama yang berada di area sebelah kanan.
• • •
Grouping pada website
Mari kita lihat beberapa grouping dari website website yang sering kita jumpai.
Twitter , website yang didominasi oleh teks sebagai konten nya menggunakan metode garis dan card untuk grouping konten,
sehingga walaupun lebih dari 70% isi website nya adalah teks, tetap mudah untuk melihat batas batas antar konten nya.
Shopify , halaman depan nya menggunakan metode jarak dan color block untuk memisahkan konten konten nya. Metode jarak untuk memisahkan area navigasi dengan judul dan gambar grafik.
Metode color block digunakan untuk memisahkan section pertama dan section kedua.
• • •
Takeaways
- Grouping digunakan untuk memisahkan konten konten. Pemisahakan konten ini penting agar user bisa fokus untuk membaca informasi di suatu area tanpa terganggu oleh info info lain di area sekitarnya.
- Metode grouping ada beberapa diantaranya metode jarak, garis, card dan color block.
- Memadukan beberapa metode grouping dalam satu area bisa bisa saja. Yang penting tujuan grouping yaitu memisahkan konten nya tercapai.
• • •
Seberapa suka kamu dengan artikel ini?
