Přeskočit na obsah
Vývoj aplikací

Dashboard plný dat, ale bez odpovědi? Navrhněte ho pro rozhodnutí

Na obrazovce je dvanáct grafů. Vedoucí přesto otevírá Excel, aby zjistil, které úkoly stojí. Přehledný dashboard musí ukázat význam čísla, rozsah dat a další akci. Velké množství podkladů není důvod zobrazit je všechny najednou.

Design dashboardů: rozhodnutí uživatele, správný kontext dat a přechod od přehledu ke konkrétní akci.

Dobrý dashboard odpoví na otázku, kvůli které ho člověk otevřel. Dispečer potřebuje zjistit, co se zpožďuje. Vedoucí podpory hledá nevyřízené požadavky. Jednatel sleduje výsledek a jeho příčinu. Stejná sada dat neznamená stejnou úvodní obrazovku.

Před návrhem si napište tři skutečné pracovní situace. Co uživatel potřebuje poznat, podle čeho to vyhodnotí a co udělá dál? Teprve potom vybírejte metriky, grafy a tabulky. Užitečnost ověřujte na úkolu, ne na dojmu z barevného návrhu.

01Začněte rozhodnutím a rolí uživatele

Oddělte přehled pro vedení, analytický průzkum a pracovní frontu. První shrnuje stav, druhý hledá souvislosti a třetí pomáhá vyřídit konkrétní položku. Mohou sdílet data, ale potřebují jiné priority a míru podrobnosti.

Microsoft v doporučení pro dashboardy Power BI začíná publikem a metrikami pro rozhodování. Přehled odlišuje od detailních reportů a doporučuje zvýraznit důležité informace. Jde o vodítko pro návrh, nikoli povinnou šablonu pro každou aplikaci.

Ve firmě se ptejte konkrétně: Co musíte zkontrolovat ráno? Kdy zasahujete? Co potřebujete otevřít, abyste si číslo ověřili? Pokud odpověď zní „chci všechno“, projděte s uživatelem poslední situaci, kdy podle dat skutečně jednal. Z ní vyberete podstatně přesnější zadání.

Rozhodnutí může mít více vlastníků. Vedoucí vidí souhrn za tým, pracovník své úkoly a administrátor chybu zpracování. Nesnažte se jejich rozdílné potřeby vyřešit jedním dlouhým seznamem dlaždic.

02Každé číslo potřebuje definici, období a zdroj

Metrika „otevřené požadavky“ může zahrnovat vše kromě uzavřených, pouze nepřidělené úkoly nebo také položky čekající na zákazníka. Domluvte definici ještě před návrhem grafu. Jinak dva správné výpočty vypadají jako chyba systému.

PrvekCo musí uživatel vědětTypická nejasnostVhodná kontrola
KPICo se počítá a pročRůzná definice otevřeného úkoluPopis pravidla a návazný seznam
Časový filtrZa jaké období jsou hodnotyČást přehledu ukazuje jiné datumViditelný rozsah a označení výjimek
AktualizaceZ jakého času pocházejí dataČerstvá stránka se starými údajiČas úspěšného načtení zdroje
SrovnáníVůči čemu se hodnota měníNeúplný týden proti celémuShodná období a poznámka
Pracovní frontaKdo má položku řešitSouhrn bez dalšího krokuStav, vlastník a odkaz na detail
Prázdný stavZda nic není nebo data chybíNula místo chyby načteníRozlišení výsledku, chyby a oprávnění
Kontrolní tabulka pro zadání a přejímku dashboardu. Konkrétní definice metrik určuje firma.

U peněžních hodnot uveďte měnu a relevantní základ, například zda jde o cenu s DPH. U počtů rozlišujte položky, zákazníky a události. U procent ukažte, z jakého základu vycházejí. Detailní vysvětlení může být dostupné přes odkaz nebo nápovědu, ale jednotka a období nesmí být skryté.

03Dejte přehledu pořadí: pozornost, trend, konkrétní práce

Ne všechny informace mají stejnou váhu. Horní část může zvýraznit stav vyžadující zásah. Další ukáže vývoj a níže následuje seznam položek. Důležitost nevytváří počet barev, ale pořadí, velikost, popisek a smysluplná návaznost.

Pro názornou ukázku používáme modelové údaje provozního dashboardu. Prioritní KPI je 12 úkolů čekajících na zásah. Trend dokončených úkolů ve čtyřech týdnech má hodnoty 18, 24, 21 a 30. Jde o dvě odlišné metriky: aktuální práci k řešení a dokončenou práci za období. Čísla nejsou výsledkem žádné firmy.

Pracovní fronta v ukázce obsahuje pouze dva ilustrační řádky 001 a 002 s vlastníky A a B a stavy „Čeká“ a „V řešení“. Nezobrazuje celý seznam dvanácti úkolů. Tlačítko vede k otevření fronty, kde může uživatel pokračovat. Filtr a čas aktualizace dávají údajům kontext.

Modelový provozní dashboard: KPI 12 úkolů k zásahu, trend 18/24/21/30, filtr čtyř týdnů, čas aktualizace a fronta 001/002.
Ilustrativní údaje, nikoli výsledky firmy. Pozornost směřuje na 12 úkolů k zásahu; filtr, aktualizace a měřítko objasňují trend 18/24/21/30. Dva ukázkové řádky mají stav a vlastníka, další krok otevírá frontu.

Otestujte také návrat z detailu. Uživatel nemá po vyřešení jedné položky znovu nastavovat období, hledání a pořadí. Stav pohledu by měl odpovídat jeho práci a být zřejmý i po otevření uloženého odkazu.

04Graf vybírejte podle otázky a hlídejte měřítko

Pro porovnání kategorií bývají vhodné pruhy. Vývoj v čase může ukázat spojnicový nebo sloupcový graf podle významu dat. Přesnou hodnotu a další akci často nejlépe podá tabulka. Přehled typů grafů ONS rozděluje vizualizace podle porovnávání, času a dalších účelů.

Délka pruhu reprezentuje velikost hodnoty, proto ONS u pruhových grafů doporučuje začít osu nulou. Oříznutí může zdánlivě zvětšit malý rozdíl. U jiného typu grafu může dávat jiné měřítko smysl; vždy ale musí být čitelné a odpovídat sdělení.

  • Porovnávejte stejné jednotky a stejně vymezená období.
  • Chybějící měření nepřevádějte automaticky na nulu.
  • Nespojujte do jednoho trendu hodnoty s jinou definicí.
  • Označte změnu metodiky, která narušuje srovnání.
  • Doplňte popisky os a možnost dohledat důležité hodnoty.

Souhrn může skrýt problém menší skupiny. Průměrná doba vyřízení může vypadat dobře, přestože několik požadavků čeká výrazně déle. Umožněte zjistit rozložení nebo otevřít konkrétní výjimky. Ukazatel má podporovat rozhodnutí, ne uklidnit uživatele za každou cenu.

05Filtry a tabulky musí fungovat i s velkou pracovní frontou

U rozsáhlých dat zobrazujte nejprve to, co uživatel potřebuje pro rozhodnutí. Připravte hledání, filtry, stránkování a srozumitelné řazení. Základní pohled má odpovídat běžné práci; úplný export může být samostatnou funkcí.

Ukažte aktivní filtry, počet výsledků a možnost návratu k výchozímu stavu. Pokud jeden filtr ovlivňuje jen část obrazovky, musí to být vidět. Uživatel nemá porovnávat tým A s celou firmou v domnění, že oba grafy používají stejné podmínky.

Hromadná akce potřebuje přesně popsat výběr. Rozlišujte označené řádky na aktuální stránce od všech výsledků hledání. Před změnou stavu ukažte rozsah a důsledek. Oprávnění ověřujte na serveru, včetně exportu a přímého odkazu na detail.

Pro běžné tabulkové informace preferujte odpovídající HTML strukturu. W3C APG rozlišuje tabulku a interaktivní grid. Grid vyžaduje vlastní model ovládání; nepřidávejte ho jen kvůli vzhledu podobnému Excelu. Pokud tabulka obsahuje akce, ověřte jejich ovládání a popisky.

06Čerstvost dat a chybové stavy jsou součást návrhu

Čas vykreslení stránky není čas poslední úspěšné aktualizace zdroje. U více systémů se mohou data obnovovat různě. Dashboard má vysvětlit, z jakého okamžiku informace pocházejí a zda přehled čeká na další načtení.

Když integrace selže, nechte viditelně oddělený poslední známý stav a upozornění na chybu. Zvažte, které akce mají být dostupné se staršími údaji. Potvrzení platby nebo dostupnosti skladu může potřebovat nové ověření před samotnou akcí.

  • Bez výsledků: hledání je platné, ale žádná položka nevyhovuje.
  • Bez dat: zdroj ještě neposkytl potřebné údaje.
  • Chyba: načtení se nepodařilo a stav není ověřený.
  • Bez oprávnění: uživatel k informaci nemá přístup.
  • Načítání: operace běží a uživatel vidí její stav.

Rozhraní má nabídnout další krok, třeba změnu filtru, opakování načtení nebo kontakt na správce. Technické podrobnosti integrací doplňuje propojení systémů přes API. Dashboard nemůže zaručit správnost údajů, které zdroj neposkytuje nebo mají odlišný význam.

07Přístupnost a menší obrazovka nesmějí přijít až na konec

Barva pomáhá, ale stav potřebuje také text nebo jiný rozpoznatelný znak. WCAG 2.2 řeší mimo jiné použití barvy, ovládání klávesnicí a viditelný fokus. Navrhněte kontrast, popisky filtrů a pořadí ovládacích prvků společně s hlavním pohledem.

U grafu nemá být jedinou cestou k hodnotě najetí myší. Důležité informace zpřístupněte i jinak, například textovým souhrnem a datovou tabulkou. W3C návod pro komplexní obrázky rozlišuje krátký alternativní popis a podrobnější textovou reprezentaci významu grafu.

Na mobilu zachovejte hlavní úkol, i když omezíte počet grafů. Pracovník v terénu může potřebovat otevřít úkol a změnit jeho stav, zatímco kancelář řeší detailní analýzu. Horizontální posun tabulky někdy dává smysl, ale klíčové akce nesmějí zmizet mimo dohled.

Testujte s lidmi, kteří přehled používají, včetně jejich skutečných zařízení. Základní vztah mezi pochopením úkolu a podobou rozhraní vysvětluje rozdíl mezi UI a UX. Automatická kontrola přístupnosti ani hezký screenshot nenahradí provedení pracovního úkolu.

08Přejímejte dashboard podle úkolů a hraničních situací

Připravte testovací data, u kterých znáte správný výsledek. Zahrňte prázdné období, chybějící hodnotu, dlouhý název, vyšší počet položek, omezené oprávnění a chybu zdroje. Pro výkonnost použijte očekávaný objem dat a skutečné kombinace filtrů.

  1. Určete rozhodnutí uživatele a odpovědnou roli.
  2. Dohodněte definice metrik, období a zdroje.
  3. Navrhněte přehled s detailem a dalším krokem.
  4. Ověřte úkoly, chyby, oprávnění a výkon.

Při testu se ptejte, co číslo znamená a co by uživatel udělal dál. Sledujte, zda pozná aktivní filtr a stáří dat. Pokud musí každou odpověď dohledat ve vedlejším Excelu, přehled ještě nesplnil svůj účel.

Po spuštění zaznamenávejte nejasné metriky, nepotřebné prvky a chybějící akce. Změnu definice nebo datového zdroje promítněte i do nápovědy a uložených pohledů. Dashboard potřebuje vlastníka stejně jako ostatní firemní procesy.

Čtyři kroky návrhu dashboardu: pracovní rozhodnutí, definice metrik, návaznost na detail a ověření úkolů.
Návrh začíná potřebou uživatele. Přijetí ověřuje také chyby, oprávnění a práci se skutečným objemem podkladů.

09Časté otázky k dashboardům

Kolik grafů patří na úvodní dashboard?

Univerzální počet není. Vyberte prvky potřebné pro hlavní rozhodnutí dané role a zbytek dejte do detailu. Ověřte, zda uživatel rozpozná prioritu a další krok na svém zařízení.

Kdy použít graf a kdy tabulku?

Graf pomáhá vidět vztah, srovnání nebo vývoj. Tabulka je vhodná pro přesné hodnoty a práci s konkrétní položkou. Oba způsoby se mohou doplňovat.

Musí každý graf začínat nulou?

U pruhů a sloupců je nulový základ důležitý pro pravdivou délku. Jiný typ grafu může vyžadovat jiné měřítko. Osa musí být čitelná a nesmí zkreslovat sdělení.

Proč zobrazovat čas aktualizace?

Uživatel potřebuje vědět, jak čerstvá jsou data. Nově otevřená stránka může používat starý souhrn. U více zdrojů označte i odlišné časy nebo chybu načtení.

Co znamenají čísla v ukázce?

Jsou ilustrativní. KPI 12 označuje úkoly k zásahu a trend 18/24/21/30 dokončené úkoly ve čtyřech týdnech. Dva řádky fronty jsou pouze ukázky. Nejde o výsledky firmy ani o slíbené zlepšení.

Jak řešit velké množství dat?

Vyberte vhodný výchozí rozsah, filtry, hledání a řazení. Podrobnosti načítejte podle úkolu a ověřte výkon na očekávaném objemu. Úplný export oddělte od běžného přehledu a chraňte jeho oprávnění.

Jak poznat, že návrh funguje?

Nechte uživatele vyřešit konkrétní úkol, vysvětlit metriku a určit další krok. Zkontrolujte prázdný stav, chybu, klávesnici, mobil i omezená oprávnění. Vzhled je jen část výsledku.

Tým LISTIFYWeby, aplikace a marketing z Prahy od roku 2008

Další články

Všechny články →
Vývoj aplikací3. 10. 2026 · 8 min čtení

Více lidí, stejná rychlost? Jak škálovat produktový tým

Vývoj aplikací3. 10. 2026 · 8 min čtení

Design systém: proč každé tlačítko ve firmě nemusí vznikat znovu

Vývoj aplikací3. 10. 2026 · 10 min čtení

Mapy a geolokace v aplikacích: 7 rozhodnutí, která neodkládejte na konec

Sdílet stránku

E-mailem

Máte nápad?

V krátkém hovoru zjistíme, co potřebujete, a navrhneme další krok. Pak dostanete nabídku s pevnou cenou a termínem.

+420 771 166 199Po až Pá 8:30 až 16:00 · info@listify.cool

Kdy vám máme zavolat?

Vyberte den a časové rozmezí. Zavoláme my, hovor trvá zhruba 15 minut.

Den