Jak byste navrhovali ikonografii a používání ikon tak, aby podporovaly porozumění a nevedly k chybám? Kdy má mít ikona textový popisek a jak souvisí konzistence stylu s důvěryhodností a kognitivní zátěží?
1) Ikona jako zkratka, ne hádanka
- Ikony fungují, když:
- jsou kulturně/doménově srozumitelné,
- jsou konzistentní v produktu,
- nejsou jediným nosičem významu u kritických akcí.
2) Metafory a rizika
- Metafora („koš“, „disketa“) může pomoci učení, ale:
- nemusí být univerzální,
- může být nejednoznačná (např. „hvězda“ = oblíbené vs hodnocení).
3) Kdy doplnit text
- Doporučeně:
- v navigaci,
- u destruktivních/nezvratných akcí,
- u ikon, které nejsou 100% jednoznačné,
- u publika s nižší doménovou gramotností.
- Text snižuje kognitivní zátěž a chybovost.
4) Signifikátory interakce
- Ikona sama neříká, že je klikací.
- Potřebujete signifikátory:
- umístění v tlačítku,
- hover/focus/active stavy,
- dostatečná hit area,
- konzistentní styling akčních ikon.
5) Konzistence stylu
- Tloušťka tahu, radius, fill/outline, optická velikost.
- Konzistence:
- urychluje rozpoznání,
- zvyšuje důvěru,
- snižuje vizuální šum.
6) Přístupnost
- Ikony musí mít textový ekvivalent (accessible name).
- Barva nesmí být jediný rozdíl stavu.
Shrnutí
Ikonografie je systém: metafora + konzistence + signifikátory + text tam, kde je to potřeba.
Všechny otázky - Design uzivatelskych rozhrani
- 1. Vizuální design jako funkční jazyk UI
- 2. Barva: sémantika, kontrast a redundance
- 3. Layout a vizuální hierarchie: mřížky a whitespace
- 4. Gestalt principy v praxi UI
- 5. Fitts a Hick: dopad na vizuální návrh
- 6. Typografie: hierarchie, čitelnost a technika
- 7. Typografie, mikrokopie a prevence chyb
- 8. Vizualizace dat: volba kódování a grafu
- 9. Dashboard: hierarchie KPI a prezentace insightů
- 10. Ikony, metafory a signifikátory interakce
- 11. Stavy UI a zpětná vazba (feedback)
- 12. Design systém ve vizuálním designu (tokeny)
- 13. Konzistence vs lokální optimalizace (výjimky)
- 14. Etika vizuálního designu a dark patterns