Synergy Insurance Affiliates

Trabalhei nos fluxos de usuário e nas interfaces para desktop e celular da Synergy Insurance Affiliates, arquivada como Media Base / Base Media. O design contempla os papéis de Super Admin, Office Admin e Agente, com páginas de protótipo separadas para cada papel nos dois formatos.

O material apresentado reúne design e protótipos no Figma. As telas de desktop compartilham o menu do Super Admin. Nomes, fotos e valores são exemplos usados para demonstrar a interface; o case não atribui resultados de negócio nem uso em produção ao projeto.

Os fluxos do usuário cobrem três papéis: Super Admin, Office Admin e Agente. A partir do dashboard, o fluxo do Super Admin se divide em metas, desempenho das afiliadas, análise financeira, ranking, escritórios afiliados e formulários.

Os wireframes em cinza mostram a hierarquia sem depender da identidade visual: indicadores de resumo, comparações e registros detalhados ocupam áreas distintas. Na interface final, Analytics, Management e Account separam o acompanhamento das ações que alteram a operação. Conferir o desempenho e executar uma tarefa administrativa têm, assim, destinos diferentes.

A primeira decisão é o recorte da pergunta: como está o desempenho da rede e qual escritório merece uma análise mais próxima? O dashboard começa por renovação, caducidade, retenção e apólices vendidas, acompanhadas pelo Goal Score e pela receita semanal. O design mantém o contexto da rede à vista antes de entrar em um escritório específico.

A tela Affiliate Performance repete essa leitura para um escritório, escolhido em um seletor no topo. Ela acrescenta blocos coloridos de leads, vendas e taxa de fechamento e uma fileira de números de gastos, e a coluna da direita acompanha a escolha: o ranking vira Agent Leaderboard - Office.

O Agent Leaderboard dá aos primeiros colocados cards grandes com leads, vendas, taxa de conversão e uma semana de atividade de vendas. O amarelo marca o primeiro lugar, e a fileira de cards continua por trás da coluna da direita. A tabela abaixo lista todos os agentes, com bill rate, CPA, gastos, vendas, leads e taxa de conversão em uma só linha.

Uma versão curta dessa lista fica na coluna da direita, abaixo de Notifications, na maioria das telas de desktop. Assim, o ranking e as últimas vendas e leads continuam à vista durante outras tarefas.

O Campaign Overview combina uma tabela com um gráfico de rosca que mostra a participação de cada campanha nas vendas. As taxas de conversão têm um ponto colorido, do vermelho na mais baixa ao verde na mais alta, o que ajuda as campanhas fracas a se destacarem em uma lista longa. Um filtro restringe a visão por escritório, e uma chave ativa a edição.

O wireframe do construtor reserva espaços separados para o formulário e suas ferramentas de edição. O design final mantém essa divisão: as perguntas ocupam a coluna principal, enquanto o painel direito adiciona conteúdo. Form Builder, Settings e Preview distinguem editar uma pergunta, configurar o formulário e conferir o resultado.

Os formulários funcionam como um pequeno editor com três abas: Form Builder, Settings e Preview. Cada pergunta tem seu tipo de resposta e sua chave de obrigatoriedade, e todo bloco pode ser duplicado ou excluído. A coluna de notificações dá lugar a um painel para adicionar perguntas, títulos, imagens, vídeos e seções ou importar perguntas, com Copy Link e Save Form no topo.

O design mobile prioriza as mesmas perguntas operacionais com menos detalhes simultâneos. O progresso das metas continua visível, as tabelas mostram menos colunas e a adição de um elemento do formulário sai de um painel permanente para uma ação flutuante. A tarefa continua disponível enquanto o layout se adapta à tela menor.

No celular, uma barra flutuante com cinco ícones leva às áreas principais, e as taxas se reorganizam em uma grade de dois por dois acima do Goal Score. Em Goals Settings, abas separam afiliadas e agentes, e cada meta é um card com o objetivo, o status semanal ou mensal, uma barra de progresso e um lápis de edição.

O ranking mantém o card amarelo e reduz a tabela às primeiras colunas. O construtor de formulários fica empilhado em uma coluna, com um botão flutuante de adicionar no lugar do painel lateral do desktop.