Gamificação

O sistema de gamificação motiva os agentes a manter boas práticas de conformidade com rankings, métricas de impacto e histórico mensal de desempenho.

Sistema de Ranking

Cada agente recebe uma rank mensal baseada no volume de consentimentos coletados no mês corrente. O rank é calculado pela função getGamificationStats($total):

Rank Critério (mês atual) Ícone Cores
🥉 Bronze 0 a 50 consentimentos 🥉 Âmbar
🥈 Prata 51 a 200 consentimentos 🥈 Cinza Slate
🥇 Ouro Mais de 200 consentimentos 🥇 Amarelo

Barra de Progresso

Para ranks Bronze e Prata, uma barra de progresso animada exibe:

  • Percentual visual: calculado como min(100, (total / next) * 100)
  • Faltam X para [próximo rank]! — contagem regressiva motivacional
  • A barra usa gradiente azul com transição CSS de 1 segundo ao carregar

Ao atingir Ouro (rank máximo), a barra é substituída por um destaque especial: "👑 Rank Máximo Atingido!"

Métrica: Tempo Economizado

O Card 2 do dashboard calcula o impacto real do uso do sistema:

$minutesSaved = $allTimeTotal * 15; // 15 min por consentimento manual estimado
$hoursSaved = floor($minutesSaved / 60);
$remainingMinutes = $minutesSaved % 60;

Base de cálculo: 15 minutos representa o tempo médio estimado de um processo manual de consentimento — impressão do formulário, assinatura, digitalização e arquivamento. A métrica acumula todos os consentimentos históricos (não apenas o mês atual).

Histórico Mensal

O Card 3 exibe o desempenho dos últimos 12 meses anteriores ao atual. Para cada mês:

  • Nome abreviado do mês em português (Jan, Fev, Mar...)
  • Total de consentimentos
  • Badge do rank correspondente àquele mês

A query é limitada a 12 meses via LIMIT 12, excluindo o mês corrente para não duplicar a informação do Card 1.

Carrossel Mobile

Em dispositivos móveis, os 3 cards são convertidos em um carrossel horizontal com snap scrolling:

  • Botões de navegação anterior/próximo (< e >)
  • Bolinhas indicadoras de posição (dots), que se destacam ao chegar ao card correspondente
  • Loop infinito: ao chegar no último card e clicar em "próximo", volta para o primeiro
  • Em landscape, o Card 1 fica fixo à esquerda e os Cards 2 e 3 formam um mini-carrossel à direita