Licitanet · Plataforma de licitações públicas (Brasil)

Licitação pública, desenhada pra cada papel que passa por ela

A Licitanet faz licitações eletrônicas no Brasil: órgãos públicos compram, fornecedores dão lance, tudo em tempo real. Em 2023, pelo estúdio Growmate, redesenhei o site, o cadastro dos dois lados e o sistema que pregoeiros e fornecedores usam. Em 2025 a Licitanet me contratou de novo pra completar o sistema, incluindo o módulo em que os órgãos planejam um ano de compras. Os dois estão no ar.

Papel
Product Designer, única designer
Quando
2023 via Growmate, recontratada em 2025
Usuários
Órgãos públicos, setores de compras e fornecedores
Feito com
Figma

01 · Descobrir · Discovery

Os dois lados do mesmo pregão

Um pregão tem dois usuários que querem coisas opostas: o pregoeiro, que conduz a disputa pelo órgão, e o fornecedor, que quer ganhar. Comecei entrevistando os dois, mapeei as necessidades num mapa de empatia e priorizei as ideias por valor, usabilidade, execução e viabilidade antes de desenhar qualquer coisa.

Quadros de discovery: quatro perguntas sobre valor, usabilidade, execução e viabilidade, e quadros mapeando quem é a Licitanet, seus usuários e as entrevistas com pregoeiros e fornecedores.
Os quadros de discovery, com as entrevistas de pregoeiros e fornecedores.

02 · Entrar · Site e cadastro

O formulário onde a pessoa clicou

Conduzi um design critique da jornada inteira, anotando o que dispara cada etapa e que informação era essencial ou dispensável. O pior momento era o cadastro. O fornecedor clicava em Cadastre-se, caía numa página longa e ainda tinha que rolar pra achar o formulário. Ninguém deveria ter que procurar uma coisa em que já clicou.

Refiz a página pra pessoa chegar no formulário sem procurar, a informação irrelevante saiu, e reescrevi o texto pra quem nunca participou de licitação entender cada passo. Grid, cor e espaçamento viraram componentes com variantes, pro site crescer sem perder a consistência.

Um quadro no Figma com a jornada de cadastro do fornecedor, da home até a escolha do plano, o pagamento e os estados de sucesso e de pagamento recusado, com post-its em cada etapa.
O critique do cadastro do fornecedor, passo a passo, da home ao pagamento.

03 · Planejar · 2025 · Plano anual

Um plano, quatro papéis, sempre claro de quem é a vez

Todo ano os órgãos públicos precisam publicar um Plano de Contratações Anual, o PCA. Ele passa por quatro mãos: o setor requisitante elabora cada demanda, o setor de compras consolida as demandas e forma o plano, e a autoridade competente aprova.

Desenhei o módulo em volta desse revezamento. A mesma barra de quatro etapas fica no topo de todas as telas, com o papel dono de cada etapa escrito embaixo, então quem abre o plano sabe onde ele está e de quem é a vez. A consolidação agrupa as demandas por classe, com totais e prioridade, e o setor de compras vê o todo antes de criar uma contratação.

Tela de consolidação de demandas: uma barra de quatro etapas com o papel embaixo de cada uma, demandas agrupadas por classe com valor total e uma etiqueta de prioridade alta.
Consolidação, etapa dois de quatro. Cada etapa diz qual papel é o dono.
Tela de formação do PCA com abas de contratações em elaboração, aprovadas e reprovadas, cada contratação abrindo pra mostrar as demandas que a compõem.
Formando o plano: cada contratação abre pra mostrar as demandas por trás dela.

04 · Aprovar · 2025 · Devolver com motivo

Uma devolução sempre diz por quê

Quando a autoridade devolve uma contratação, o setor de compras precisa saber o que corrigir, senão o plano trava num vai e volta. Devolver exige uma justificativa escrita, e o botão de confirmar fica desligado até ela existir.

Um diálogo pedindo a justificativa da devolução, com o campo de texto vazio e o botão Devolver contratação desligado.
O diálogo de devolução. Sem motivo, sem devolução.

05 · Pesquisar · 2025 · Pesquisa de preços

O comprador escolhe como precificar cada item

Antes de contratar, os órgãos pesquisam o preço de mercado. Desenhei isso em quatro etapas, dados iniciais, itens, análise de valores e finalização, com um resumo da pesquisa sempre visível ao lado. Na análise, cada item mostra a média, a moda, a mediana e o melhor preço encontrado, e o comprador escolhe qual vira o valor de base. O sistema faz a conta; a decisão fica com quem responde por ela.

Pesquisa de preços, etapa três de quatro: um item com média, moda, mediana e melhor preço, um seletor pra escolher o valor de base e um painel de resumo à direita.
Análise de valores: os números lado a lado, a escolha com o comprador.

O que eu levo daqui

  • Em sistema público, o problema de design mais difícil é a passagem entre pessoas, não uma tela.
  • Nunca faça a pessoa procurar o que ela já clicou.
  • Ser recontratada pelo mesmo cliente é o melhor feedback que uma designer pode receber.

Continue lendo

Savings.Club · Fintech (EUA)A jornada inteira do membro, refeita pra vender, assinar e manterSite, cadastro em três passos, app do membro e CRM.Ler o case ↗