𝗕𝗲𝗿𝗵𝗲𝗻𝘁𝗶 𝗠𝗲𝗺𝗶𝗹𝗶𝗵 𝗜𝗸𝗼𝗻 𝗗𝗮𝘀𝗯𝗼𝗿 𝗕𝗲𝗿𝗱𝗮𝘀𝗮𝗿𝗸𝗮𝗻 𝗞𝗮𝘁𝗮 𝗞𝘂𝗻𝗰𝗶
Sebagian besar masalah dasbor bukan berasal dari ikon yang buruk.
Masalah tersebut muncul karena penggunaan ikon yang bagus dengan makna yang salah.
Jika Anda mencari "users" dan memilih SVG yang bersih, Anda mungkin akan menghadapi masalah nantinya. Anda akan membutuhkan ikon yang berbeda untuk pelanggan, anggota tim, pemilik akun, dan admin. Tak lama kemudian, satu ikon "user" harus memikul terlalu banyak makna. Hal ini membuat dasbor SaaS Anda terasa penuh gangguan visual.
Berhenti memilih ikon berdasarkan kata kunci. Mulailah memilih berdasarkan peran.
Kata kunci memberi tahu Anda apa yang berkaitan dengan sebuah ikon. Peran memberi tahu Anda apa yang dilakukan oleh sebuah ikon.
Klasifikasikan ikon Anda ke dalam lima kategori berikut:
- Ikon navigasi: Ini merepresentasikan tujuan seperti Dasbor, Penagihan, atau Pengaturan. Ikon ini harus sederhana dan stabil.
- Ikon status: Ini menjawab pertanyaan seperti "Apakah ini aktif?" atau "Apakah ini gagal?" Gunakan simbol langsung seperti tanda centang, peringatan, atau kunci.
- Ikon aksi: Ini merepresentasikan operasi seperti edit, hapus, atau ekspor. Hindari penggunaan ikon ini tanpa label jika aksinya kompleks.
- Ikon objek: Ini mengidentifikasi entitas seperti proyek, faktur, atau folder.
- Ikon empty state: Ini muncul saat data tidak ada. Ikon ini bisa memiliki lebih banyak karakter.
Jangan hanya mencari SVG yang paling cantik. Carilah kosakata visual.
Gunakan tiga pengujian ini sebelum Anda menetapkan sebuah ikon:
- Uji Ukuran: Apakah ikon tersebut masih berfungsi pada ukuran 16px di dalam tabel yang padat? Banyak ikon terlihat bagus pada 32px tetapi gagal saat ukurannya mengecil.
- Uji Konteks: Letakkan ikon di samping label dan ikon di sekitarnya. Apakah ikon tersebut dapat tertukar dengan ikon di sebelahnya?
- Uji Makna: Apakah ikon tersebut mendukung labelnya, atau justru labelnya yang harus menjelaskan ikon tersebut?
Jika Anda tidak dapat menemukan ikon yang berbeda untuk sebuah fitur, nama fitur Anda mungkin terlalu ambigu. Ikon memperkuat makna. Ikon tidak memperbaiki bahasa yang tidak jelas.
Alih-alih mencari "user icon", carilah "internal collaborator icon" atau "customer account icon". Presisi dalam pencarian Anda akan menghasilkan presisi pada UI Anda.
Sumber: https://dev.to/svgicons/stop-picking-dashboard-icons-by-keyword-ij2