UX/UI & Web Design
| Orçamento: Aberto |
Publicado: |
Propostas: 17
## Objetivo
Criar mockups e protótipos (alta fidelidade) de um web app que represente os relatórios em uma interface moderna, com componentes de visualização de dados, filtros e comparações, mantendo clareza, rastreabilidade e fidelidade ao significado dos indicadores.
## Escopo do trabalho
1. **Levantamento e mapeamento**
* Inventariar cada relatório e listar: seções, métricas, tabelas, gráficos, textos e regras de leitura.
* Definir quais partes viram “visões” do app e quais viram “detalhes” ou “anexos”.
2. **Arquitetura de informação e navegação**
* Estruturar menu, rotas e hierarquia: visão geral, diário, intersemanal, semanal, mensal, matriz e páginas de detalhe.
3. **Design de UI para dashboards**
* Definir padrões de componentes: cards de KPI, tabelas, séries temporais, heatmaps/matrizes, gráficos de área empilhada, comparadores, tooltips, legendas e notas.
* Tratar estados: carregando, vazio, erro, sem dados, “dados preliminares” vs “dados consolidados”.
4. **Design system mínimo para implementação**
* Tipografia, espaçamentos, cores, tokens, grid, ícones, botões, inputs, tabs, filtros, padrões de tabela.
* Diretrizes de visualização (ex.: escalas, cores para calor/frio, alertas, thresholds, acessibilidade).
5. **Protótipo navegável e handoff**
* Protótipo clicável em Figma com fluxos principais.
* Especificação para dev: medidas, comportamento, componentes reutilizáveis, variações e exemplos.
## Telas mínimas sugeridas (para orientar o orçamento, mas podem variar com recálculo do orçamento passado)
* **Home / Visão geral**: resumo dos principais KPIs e “últimos relatórios”.
* **Diário DESSEM**: temperatura, eólica/solar, carga líquida (comparação EARLY vs PRELIMINAR), atendimento à carga por subsistema, PLD D+1.
* **Intersemanal**: mapas/cenários de precipitação e narrativa por subsistema.
* **Semanal**: resultados do PMO, ENA/carga, PLD, reservatórios, gráficos de projeção/decomposição.
* **Mensal**: evolução de reservatórios, histórico de PLD e distribuição das séries de preços.
* **Matriz DC**: matriz interativa (heatmap/tabela) com eixos de ENA e valores de preço, com legenda e filtros.
## Entregáveis (o que deve ser entregue)
* 1 arquivo Figma contendo:
* Wireframes (opcional) e **telas em alta fidelidade**.
* **Protótipo clicável**.
* **Biblioteca de componentes** (design system mínimo).
* Especificações e anotações para desenvolvimento (handoff).
* Documento curto (pode ser dentro do Figma) com:
* mapa de páginas/rotas
* regras de visualização (padrões de tabela, cores, escalas, tooltips)
* lista de componentes e estados
## Requisitos e restrições
* Layout responsivo (desktop prioritário, com adaptação para celular e tablet).
* Componentes pensados para implementação (reutilizáveis, consistentes, sem soluções “artísticas” difíceis de codar).
* Clareza de leitura para dados densos (tabelas extensas e matrizes).
* Prever exportação/compartilhamento (ex.: imprimir ou baixar visões) se isso fizer parte do produto.
## Perfil do profissional
* UI/UX Designer com experiência em **dashboards e data visualization**.
* Domínio de Figma (Auto Layout, Variants, Components, prototipação).
* Capacidade de transformar relatórios técnicos em UX (boa hierarquia visual, redução de ruído, comparações, contexto).
* Diferencial: familiaridade com produtos de energia, finanças quantitativas ou analytics B2B.
Habilidades desejadas: User Interface / UI, UI Design e UX.