Mengapa Label Teks Diperlukan (Ikon Saja Tidak Cukup)

• Sangat mendukung label teks (text labels)
• Antarmuka modern memiliki terlalu banyak ikon sehingga pengguna menghabiskan terlalu banyak sumber daya kognitif untuk menafsirkan makna ikon
• Akibatnya, kecepatan kerja melambat dan pengalaman yang tidak efisien terus berulang
• Menyampaikan makna hanya dengan ikon bukan hal yang mudah, dan sebagian besar ikon tidak lengkap tanpa label teks

# Masalah yang Ditimbulkan Ikon

1. Sebagian besar ikon tidak dapat menyampaikan makna yang langsung jelas

• Ada pendapat bahwa jika itu adalah “ikon yang bagus”, maka maknanya bisa tersampaikan dengan cukup baik, tetapi pada kenyataannya ikon apa pun tetap menimbulkan beban kognitif saat ditafsirkan
• Misalnya, "ikon tempat sampah" relatif jelas berarti Delete, tetapi "ikon pensil" ambigu
  • Menulis? Mengedit? Menggambar? Membuat?
• Konteks dapat melengkapi makna, tetapi ini pun tetap menuntut beban kognitif tambahan

2. Semakin banyak ikon dalam antarmuka, semakin sulit dinavigasi

• Semakin banyak fungsi, semakin sulit membedakannya hanya dengan ikon.
• Hingga 5-7 fungsi, ikon masih dapat dibedakan, tetapi ketika menjadi 15-20, ikon serupa untuk simpan/bagikan/edit/buat akan sangat mudah tertukar.
• Ketika perbedaan antarikon dengan fungsi yang mirip melemah, keterbacaan pun menurun.

3. Ikon hanya bermakna di dalam antarmuka tertentu

• Pengguna harus berpindah-pindah di antara berbagai lingkungan antarmuka (browser web, sistem operasi, aplikasi, dll.)
• Ikon yang digunakan di satu antarmuka bisa memiliki makna yang sama sekali berbeda di lingkungan lain
• Terutama saat menggunakan set ikon standar (Google Material Design, dll.), kebingungan akan semakin besar jika ikon yang sama dipakai dengan makna berbeda

# Manfaat Label Teks bagi Antarmuka

1. Teks saja pun lebih efisien

• Otak kita dioptimalkan untuk mengenali kata dengan cepat.
  • Kata yang familier dapat dipahami seketika tanpa harus membaca huruf satu per satu
  • Sebaliknya, sebagian besar ikon memerlukan lebih banyak usaha karena kita harus mempelajari bahasa visual yang baru
• Daftar teks cukup dibaca dari atas ke bawah, tetapi jika hanya ada ikon, kita harus memindai secara bergantian ke arah horizontal dan vertikal.
  • Terutama di lingkungan mobile, kebingungan visual menjadi lebih besar ketika ikon dengan bentuk serupa disusun berjajar.

2. Teks membuat ikon menjadi lebih efisien

• Ketika label teks ditambahkan:
  • makna ikon menjadi lebih jelas dan navigasi menjadi lebih cepat
  • beban desainer untuk menyampaikan seluruh makna hanya dengan satu ikon pun berkurang.

3. Ikon dapat menjadi elemen visual penting dalam antarmuka yang berpusat pada teks

• Ikon berperan sebagai penanda visual (visual anchor), dan ketika digabungkan dengan teks, memberikan antarmuka yang paling efektif

Menemukan Keseimbangan antara Ikon dan Teks

• Saat memilih antara ikon dan label teks, beban kognitif pengguna harus dipertimbangkan.
• UI yang hanya terdiri dari ikon mungkin tampak rapi pada awalnya, tetapi justru bisa membebani pengguna dengan tugas menafsirkan dan menjadi tidak efisien
• Menemukan ikon yang sempurna bukanlah jawabannya.
  → Yang penting adalah menggabungkan ikon dan teks untuk memberikan pengalaman terbaik.

# Prinsip Inti untuk Desain UI yang Optimal

1. Jangan mencoba mengekspresikan semuanya hanya dengan ikon.
2. Menambahkan label teks meningkatkan keterbacaan dan aksesibilitas.
3. Ikon dan teks bukan hubungan yang saling bersaing, melainkan elemen yang saling melengkapi.
4. Pertimbangkan bagaimana aplikasi atau situs web digunakan dalam keseluruhan lingkungan digital.
5. Buat agar pengguna tidak perlu ‘menafsirkan’ antarmuka, melainkan dapat ‘langsung memahaminya’.

Kesimpulan: yang penting bukan "UI yang enak dilihat", melainkan "UI yang mudah dipahami"

• Setiap kali muncul godaan untuk membuat ikon baru atau menghapus label teks, pikirkan kembali.
• Desain yang benar-benar rapi bukanlah yang "terlihat sederhana", melainkan yang "mudah dipahami".

[ndrgrd]

Ikon sepertinya sebaiknya hanya digunakan dalam situasi yang bisa dipahami sekilas, dan juga tampaknya fitur untuk menampilkan teks bantu dengan tekan lama memang benar-benar diperlukan.

[nemorize]

Kami sangat membatasi situasi penggunaan ikon saja.

• Saat ikon yang jelas ditempatkan di posisi yang jelas (ChevronLeft di kiri atas, Vertical3Dots di kanan atas)
• Saat agar ikon tersebut ditampilkan diperlukan interaksi pengguna, dan di area interaksi itu ikon yang sama juga ditampilkan bersama label (ikon BellOff pada elemen saat aksi matikan notifikasi)
• Saat diikuti data numerik yang jelas (suka, tidak suka, waktu)
• Saat ada fungsi yang menjelaskan kegunaan ikon melalui tooltip, tutorial, dan semacamnya yang menerangkan ikon tersebut atau kelompoknya
  ** Jika diminta pelanggan wkwk;

[GN⁺]

Opini Hacker News

• Keseimbangan itu penting. Jika ada beberapa ikon di menu, itu bisa menjadi titik jangkar dan memberi "bentuk" yang khas pada menu
  • Jika semua item menu memiliki ikon, hasilnya membingungkan
• Riset UI sejak 1990-an menunjukkan bahwa label lebih baik daripada ikon untuk dikenali
  • Saat ini teknologi layar memang lebih baik, tetapi ada kecenderungan menghapus teks karena tren desain dan kemalasan dalam lokalisasi
  • Bahkan ketika ada pedoman kegunaan, itu diabaikan. Karena desain UI telah menjadi profesi yang berbasis selera
  • Misalnya, pedoman Human Interface iOS milik Apple dengan jelas menyatakan bahwa tab bar harus menyertakan ikon dan label teks
  • Banyak desainer tidak membaca pedoman ini
• Ada dugaan bahwa banyak penelitian akan direplikasi secara berbeda di Eropa dan Amerika Serikat
  • Rambu jalan di Amerika Serikat sebagian besar terdiri dari teks
  • Eropa memiliki banyak negara kecil sehingga menggunakan piktogram
  • Orang Eropa lebih baik daripada orang Amerika dalam menangkap makna dari piktogram
• Sebagian besar dunia sudah lama beralih ke aksara fonetik
  • Aksara fonetik lebih unggul daripada piktogram
  • Ikon itu opsional, teks itu wajib
• Sering kali sesuatu muncul di HN keesokan harinya saat sedang sibuk dengan topik tertentu
  • Saya membuat aplikasi menggambar kecil untuk anak saya yang berusia 27 bulan, awalnya hanya menggunakan ikon tetapi itu membingungkan baginya
  • Setelah menambahkan label teks, kebingungan visual berkurang
• Ikon tidak masalah, tetapi tanpa tooltip saat kursor diarahkan ke atasnya atau label bergaya alt-text, rasanya membuat frustrasi
  • Mempelajari software baru jadi lebih lambat dan harus mencari dokumentasi atau video tutorial
• UX Myth — mitos bahwa ikon meningkatkan kegunaan
• Saya selalu membenci ikon dan penyebarannya
  • Saya membela teks, tetapi itu tidak diterima dengan baik
  • Banyak orang mengajukan hipotesis baru bahwa mereka adalah pembaca yang lambat
  • Butuh sekitar 1 detik untuk membaca semua label dalam menu
  • Tidak pernah lebih cepat menafsirkan teks daripada ikon
  • Saya jadi setuju bahwa pembaca lambat memang perlu dipertimbangkan
• Saya ingin membela teks dari kekosongan
  • Label teks kecil dan memiliki cukup ruang di sekitarnya
  • Teks bisa ditonjolkan dan memudahkan pemindaian visual
  • Solusi utamanya adalah memungkinkan pengguna mengabaikan kesalahan desainer
  • Menekankan bahwa pengenalan teks lebih mudah daripada pengenalan ikon
  • Ikon memakan ruang lebih sedikit dan lebih efisien
• Saya pernah mendengar ungkapan, "Sebuah gambar bernilai seribu kata, tetapi sering kali satu kata saja sudah cukup"