Gubuku – 1. Tetapkan Color Palette yang Fungsional (Bukan Cuma Cantik)
Di dashboard, warna itu punya fungsi, bukan sekadar hiasan.
-
Gunakan Aturan 60-30-10: 60% warna netral (latar belakang), 30% warna sekunder (kartu/panel), dan 10% warna aksen (penanda data penting).
-
Semantik Warna: Pakai warna universal untuk status. Hijau buat tren naik/positif, merah buat tren turun/peringatan, dan abu-abu/biru buat data netral. Jangan dibalik-balik ya!
2. Buat Hirarki Tipografi yang Jelas
Pilih maksimal dua jenis font yang gampang dibaca (misalnya font sans-serif seperti Inter, Roboto, atau Plus Jakarta Sans).
-
Ukuran & Ketebalan: Bedakan ukuran font untuk Header (judul dashboard), Section Title (nama grafik), dan Data Value (angka utama).
-
Highlight Angka Utama: Angka statistik kunci (KPI metric) harus dibuat paling menonjol biar langsung kedetek sama mata.
3. Atur Grid system dan Spacing (Beri “Napas” buat Visual)
Jangan mentang-mentang ada ruang kosong, semua data dimasukkan dalam satu layar.
-
Gunakan Grid 8px atau 4px buat mengatur jarak antar komponen biar presisi.
-
Manfaatkan white space (ruang kosong) di antara kartu grafik. Visual yang punya ruang bernapas bakal jauh lebih nyaman dilihat dan gak bikin panik.
4. Kategori Visualisasi Data (Pilih Grafik yang Pas)
Gak semua data cocok dijadikan diagram lingkaran (pie chart)! Tentukan standar penggunaan grafik di guidelines kamu:
-
Line Chart: Cocok buat ngeliat tren dari waktu ke waktu (misal: views bulanan).
-
Bar Chart: Pas buat membandingkan antar kategori.
-
Single Value Cards: Ideal buat nampilin angka KPI paling krusial.
5. Konsistensi Elemen UI & Mode Tampilan
Atur bentuk sudut kartu (border-radius), gaya icon, hingga bayangan (shadow). Pastikan juga kamu sudah menyiapkan versi Light Mode dan Dark Mode kalau dashboard kamu bakal sering dipakai malam hari.
Checksheet Ringkas Visual Guidelines
Biar makin gampang, ini rangkuman komponen wajib yang harus ada di dokumen visual guidelines kamu:
| Komponen | Yang Harus Diatur |
| Warna | Warna latar, card, semantic colors (hijau/merah/kuning), dan warna grafik. |
| Tipografi | Font family, font size, line height, dan font weight untuk tiap tingkatan teks. |
| Tata Letak | Ukuran grid, margin, padding, dan jarak antar card. |
| Grafik | Standar warna dataset, ketebalan garis grafik, dan bentuk tooltip. |
Penulis : Adellia smk sudj



Leave a Reply