CRO-TO
Institucional, não burocrático: site, CMS e design system para um conselho de odontologia
- Organização
- CRO-TO
- Função
- Product designer e desenvolvedor
- Período
- Outubro de 2026
- Versão no ar
- cro-to.vercel.app
- Design system
- Site
- CMS administrativo
- Migração
- Acessibilidade
Resultados
O projeto
O Conselho Regional de Odontologia do Tocantins registra e fiscaliza os dentistas do estado do Tocantins. Projetei e construí para o conselho um novo site público, um CMS administrativo sob medida e um design system documentado, e levei para eles doze anos de arquivo. Design, front end, back end e migração, feitos por uma pessoa dirigindo agentes de IA.
Site público
21 páginas para dentistas e cidadãos: serviços, notícias, legislação, transparência e ouvidoria.
CMS administrativo
26 páginas para a equipe do conselho: notícias, documentos, pessoas, sedes e a caixa de solicitações.
Ver o adminSó com login da equipe
Design system
99 tokens em três temas, 20 estilos tipográficos e 15 componentes ao vivo, numa só página.
O problema
O site do conselho atende três grupos ao mesmo tempo: dentistas que precisam de uma certidão ou da anuidade, cidadãos que querem consultar um dentista ou registrar uma reclamação, e a equipe que mantém tudo atualizado. O site anterior dava a todos o mesmo paredão de blocos e menus.
- 01Dentistas e cidadãos dividem um paredão de blocos iguais, e cada um precisa passar pelos serviços do outro para achar os seus.Ver como resolvi
- 02Reclamações e pedidos de informação têm prazos legais, 30 dias e 20 mais 10, e tanto o cidadão quanto a equipe precisam saber em que pé cada um está.Ver como resolvi
- 03A equipe precisa publicar notícias, legislação e documentos, e responder a esses pedidos, sem chamar um desenvolvedor.Ver como resolvi
- 04Doze anos de notícias, normas e arquivos estão no site antigo, e nada disso pode se perder na mudança.Ver como resolvi
- 05E sobre o próprio site: um órgão público precisa passar confiança e funcionar para todos, inclusive para quem precisa de alto contraste, texto maior ou língua de sinais.Ver como resolvi
Como resolvi
Uma resposta para cada dor. As páginas públicas são do site no ar; as telas do admin vêm de uma cópia local com o arquivo público migrado e usuários e pedidos inventados.
01
Cada público encontra os seus serviços
Certidões, anuidade e serviços online. Cada card que sai do site diz qual sistema abre, Implanta ou CFO.
A home no celular
A barra de acessibilidade, o aviso e a busca vêm primeiro, depois o card de consulta. O registro nele é fictício, e o card avisa.
Role dentro do celular para ver a página inteira.
02
Todo pedido ganha um protocolo e um prazo
Dia 33: Prazo vencido: vermelho, e primeiro da fila no painel.
Uma explicação remontada com os próprios chips da caixa de entrada e o seu pedido fictício. As telas reais vêm a seguir.
Os mesmos pedidos nas telas reais
- cro-to.vercel.app/ouvidoria
Uma pergunta por vez
O formulário público começa pelo tipo de pedido, em quatro etapas, e promete resposta em até 30 dias. Ao lado fica a consulta de protocolo.
- cro-to.vercel.app/admin/ouvidoria
Todos os pedidos, por prazo
A caixa da equipe mostra cada protocolo com seu status e um chip de prazo: vencido em vermelho, cinco dias ou menos em âmbar, o resto neutro.
- cro-to.vercel.app/admin/ouvidoria
O prazo sempre à vista
Um pedido abre com o solicitante, a resposta oficial, uma linha do tempo e o prazo, que só muda com uma prorrogação justificada.
- cro-to.vercel.app/admin/esic
Pedidos de informação, com relógio próprio
Os pedidos do e-SIC seguem a Lei de Acesso à Informação, 20 dias prorrogáveis por mais 10, com os mesmos chips.
- 01 / 04
Uma pergunta por vez
O formulário público começa pelo tipo de pedido, em quatro etapas, e promete resposta em até 30 dias. Ao lado fica a consulta de protocolo.
- 02 / 04
Todos os pedidos, por prazo
A caixa da equipe mostra cada protocolo com seu status e um chip de prazo: vencido em vermelho, cinco dias ou menos em âmbar, o resto neutro.
- 03 / 04
O prazo sempre à vista
Um pedido abre com o solicitante, a resposta oficial, uma linha do tempo e o prazo, que só muda com uma prorrogação justificada.
- 04 / 04
Pedidos de informação, com relógio próprio
Os pedidos do e-SIC seguem a Lei de Acesso à Informação, 20 dias prorrogáveis por mais 10, com os mesmos chips.
03
A equipe publica por conta própria
Painel, claro. Abre nos prazos, os mais próximos primeiro, com atalhos para notícias, documentos e avisos da home.
- cro-to.vercel.app/admin/noticias
Escrever
Título, um resumo com contador de caracteres, o endereço e uma capa da biblioteca de mídia, com status, data e categoria ao lado.
- cro-to.vercel.app/admin/noticias
Agendar
Um post pode ficar em rascunho, sair na hora ou esperar uma data e hora. Este está marcado para 25 de outubro, o Dia do Dentista.
- cro-to.vercel.app/admin/midia
Uma só biblioteca de mídia
Toda imagem e todo arquivo passam por uma só biblioteca, com busca, filtros por tipo e upload por arrastar e soltar.
- 01 / 03
Escrever
Título, um resumo com contador de caracteres, o endereço e uma capa da biblioteca de mídia, com status, data e categoria ao lado.
- 02 / 03
Agendar
Um post pode ficar em rascunho, sair na hora ou esperar uma data e hora. Este está marcado para 25 de outubro, o Dia do Dentista.
- 03 / 03
Uma só biblioteca de mídia
Toda imagem e todo arquivo passam por uma só biblioteca, com busca, filtros por tipo e upload por arrastar e soltar.
Documentos
Formulários, manuais e relatórios com status, tamanho do arquivo e uma chave para mostrar cada um no site.
04
Doze anos de arquivo, migrados
484notícias
De 15 de outubro de 2013 a 23 de dezembro de 2025, por categoria.
- Institucional184
- Comunicados104
- Saúde Bucal90
- Eventos89
- Fiscalização17
469arquivos migrados
84,3 MB tirados do servidor antigo, agrupados pelo que acompanham.
- Imagens de notícias382
- Logos de parceiros28
- Legislação21
- Arquivos de páginas19
- Documentos11
- Fotos de pessoas8
Contagens dos filtros de notícias e do sitemap do site no ar, e do manifesto de arquivos do importador. As 23 normas estão nas telas de legislação abaixo.
Uma matéria migrada no editor
Capa, resumo, texto e prévia de busca, tudo trazido para o mesmo editor de um post novo. Role dentro da moldura para ler tudo.
05
Uma marca serena, legível para todos
Princípios primeiro
A página do design system no ar abre com os princípios que toda tela segue.
- Um tema de alto contraste, controles de tamanho de texto e o widget oficial de Libras, numa barra em todas as páginas.
- Um link para pular ao conteúdo, um título principal por página, foco visível e alvos de 44 pixels.
- Uma animação de entrada na home; todo o resto só se mexe quando alguém age.
Impacto e aprendizados
- Um site público, um admin e um design system, no ar em cro-to.vercel.app, com o sistema em /croto-design. O domínio do próprio conselho ainda roda o site anterior.
- Doze anos de arquivo do conselho levados para um CMS feito para a sua equipe: 484 notícias, 23 normas e 469 arquivos.
- Cada reclamação e pedido de informação ganha um protocolo para o cidadão e um prazo legal visível para a equipe.
- Um só design system para o site público e o admin: 99 tokens em três temas, com as lacunas conhecidas listadas na página.
O que aprendi
Escrever os princípios, e junto com eles as lacunas conhecidas, facilitou levar cada melhoria para todas as páginas.
