Powerfull Dashboards

Uma pergunta por tela. Hierarquia: KPI → tendência → detalhe. Dashboard sem decisão ou ação clara é decoração.

Princípios valem em qualquer front. Exemplos e composição em React. Visual/tokens: better-web-interface e design-system. Componentes: react-component-engineering. Contratos de API/BFF: api-design.

Antes de desenhar

1. Audiência — ops/admin (agir agora) vs negócio/BI (comparar e entender).
2. Decisões — o que a pessoa faz depois de olhar? (investigar, aprovar, escalar, exportar).
3. Cadência — tempo real, horário, diário; isso define freshness e auto-refresh.
4. Heróis — 1–3 métricas primárias; o resto é apoio ou drill-down.
5. Inventário — reutilize shell, filter bar e widgets do design system; não invente uma segunda linguagem visual.

Anatomia