Informační smetí v UI: jak ho odstranit

Jak odstranit informační smetí v UI designu

Informační smetí v rozhraních je nadbytečný vizuální nebo textový obsah, který soutěží o pozornost uživatele a zvyšuje kognitivní zátěž. Snižuje rychlost vnímání, prodlužuje čas na úkoly a zvyšuje riziko odchodů. Smetí se objevuje v textech, barvách, navigaci, liniích a ikonách, což narušuje zaměření na klíčové prvky.

Lidská pozornost je omezená: mozek se nevyrovná s přetížením podněty stejné důležitosti. Výsledkem je rozptýlení, chyby a opuštění webu.

Textové smetí a jeho odstranění

V textech se smetí projevuje opakováním klíčových frází, tautologiemi a nízkou hustotou informací. Klasický případ: stránka s 200+ zmínkami jedné formulace, kde se text stává nečitelným.

V tabulkách se problém zhoršuje:

• Přetížeností buněk bez hierarchie.
• Absencí důrazů (efekt von Restorff pro stavy).
• Opakujícími se jednotkami měření v každém řádku (ks, Kč, ID).

Řešení:

• Vypisujte jednotky do záhlaví sloupce.
• Používejte zkratky podle pravidel (viz "Příručka redaktora" Milčina a Čelcové).
• Aplikujte zarovnání pro ceny a data.
• Umisťujte vizuální důrazy na prioritní řetězce.

Tím se sníží zátěž, urychlí skenování a zlepší porozumění.

Koloristika bez přetížení

Barvy kódují priority, ale jejich nadbytek vytváří šum. Nadměrná značková barva, mnoho důrazů nebo nevyvážený kontrast rozmazávají zaměření.

Princip 3-17-80: 3 základní barvy, 17 důrazných, 80% neutrálních. Nadbytek vede k:

• Bombardování podněty.
• Snížení reakce na CTA-tlačítka.
• Růstu času úkolu, míry chyb a odchodů.

Doporučení:

• Omezte značkovou barvu na CTA-prvky.
• Zajistěte dostatečný kontrast bez extrémů.
• Vyhněte se "barevnosti" komponent.

Optimalizace navigace

Navigační smetí – nadbytek položek menu, duplikace kategorií, nejasná hierarchie. Hickův zákon: výběr z n možností roste logaritmicky, což prodlužuje čas rozhodování a zvyšuje podráždění.

Problémy:

• Duplikáty v nadpisech a podnadpisech (5–6 slov místo 1–2).
• Slabá informační architektura (špatné drobečkové navigace).

Opravy:

• Zkracujte menu, odstraňujte duplikáty.
• Používejte stručné podnadpisy: místo "Pokuty řidičů osobních aut" – "Osobní".
• Kategorizujte podle typu (A, B, C) nebo podstaty.
• Zlepšujte informační architekturu pro přirozenou navigaci.

Linie a ohraničení: minimum vizuálního šumu

Linie (oddělovače, ohraničení) přidávají proměnné: tloušťka, barva. Zlevňují design, pokud nejsou potřeba.

V tabulkách: zebra vzor nahrazuje oddělovače; nekombinujte.

V blocích: negativní prostor místo linií dává "vzduch".

Ohraničení – symptom slabého kontrastu pozadí a komponenty.

Pravidla:

• Odstraňujte zbytečné linie, pokud logika zůstává.
• Nekombinujte zebra + oddělovače.
• Minimalizujte proměnné pro čistotu.

Ikony: od pomoci k smetí

Nadbytek ikon duplikuje text, zatěžuje kognici. 60+ ikon na stránce (včetně popoverů) otupuje pozornost – mozek ignoruje podněty.

Problémy:

• Různý styl a tloušťka tahů.
• Absence cíle: nezaostřují, ale rozptylují.

Přístup:

• Používejte ikony pouze pro posílení smyslu.
• Jednotný styl, tloušťka.
• Testujte odstranění: pokud se nic nemění – smetí.

Citát Antoina de Saint-Exupéryho: "Dokonalost je dosažena ne tehdy, když není co přidat, ale když není co ubrat."

Co je důležité

• Odstraňujte duplikáty: text, barvy, ikony – kontrolujte na nadbytek.
• Hierarchie pomocí důrazů: efekt von Restorff, kontrast, zkratky.
• Minimalizujte proměnné: barvy (3-17-80), linie, menu.
• Testujte navigaci: Hickův zákon, stručnost.
• Cíl – komfort: snižujte čas úkolu, míru chyb, růst konverzí.

— Editorial Team