CRO-TO
Institucional, no burocrático: sitio, CMS y design system para un consejo de odontología
- Organización
- CRO-TO
- Rol
- Product designer y desarrollador
- Período
- Octubre de 2026
- Versión en línea
- cro-to.vercel.app
- Design system
- Sitio web
- CMS de administración
- Migración
- Accesibilidad
Resultados
El proyecto
El Conselho Regional de Odontologia do Tocantins registra y fiscaliza a los dentistas del estado de Tocantins, Brasil. Diseñé y construí para el consejo un nuevo sitio público, un CMS de administración a medida y un design system documentado, y trasladé a ellos su archivo de doce años. Diseño, front end, back end y migración, por una persona dirigiendo agentes de IA.
Sitio público
21 páginas para dentistas y ciudadanos: servicios, noticias, legislación, transparencia y defensoría.
CMS de administración
26 páginas para el equipo del consejo: noticias, documentos, personas, sedes y la bandeja de solicitudes.
Ver el panelSolo con acceso del equipo
Design system
99 tokens en tres temas, 20 estilos tipográficos y 15 componentes en vivo, en una sola página.
El problema
El sitio del consejo atiende a tres grupos a la vez: dentistas que necesitan un certificado o la cuota anual, ciudadanos que quieren consultar a un dentista o presentar una queja, y el equipo que mantiene todo al día. El sitio anterior les daba a todos el mismo muro de bloques y menús.
- 01Dentistas y ciudadanos comparten un muro de bloques idénticos, y cada uno tiene que pasar por los servicios del otro para encontrar los suyos.Ver cómo lo resolví
- 02Las quejas y las solicitudes de información tienen plazos legales, 30 días y 20 más 10, y tanto el ciudadano como el equipo necesitan saber en qué estado está cada una.Ver cómo lo resolví
- 03El equipo necesita publicar noticias, legislación y documentos, y responder esas solicitudes, sin llamar a un desarrollador.Ver cómo lo resolví
- 04Doce años de noticias, normas y archivos viven en el sitio anterior, y nada de eso puede perderse en la mudanza.Ver cómo lo resolví
- 05Y sobre el propio sitio: un organismo público tiene que inspirar confianza y funcionar para todos, incluidas las personas que necesitan alto contraste, texto más grande o lengua de señas.Ver cómo lo resolví
Cómo lo resolví
Una respuesta para cada problema. Las páginas públicas son del sitio en línea; las pantallas del panel vienen de una copia local con el archivo público migrado y usuarios y solicitudes inventados.
01
Cada público encuentra sus servicios
Certificados, la cuota anual y servicios en línea. Cada tarjeta que sale del sitio nombra el sistema que abre, Implanta o CFO.
La página de inicio en un teléfono
La barra de accesibilidad, el aviso y la búsqueda van primero, luego la tarjeta de consulta. Su registro es ficticio, y la tarjeta lo dice.
Desplázate dentro del teléfono para ver la página completa.
02
Cada solicitud recibe un número de protocolo y un plazo
Día 33: Plazo vencido: rojo, y primero en la fila del panel.
Una explicación reconstruida con los propios chips de la bandeja y su solicitud ficticia. Las pantallas reales vienen a continuación.
Las mismas solicitudes en las pantallas reales
- cro-to.vercel.app/ouvidoria
Una pregunta a la vez
El formulario público empieza por el tipo de solicitud, en cuatro pasos, y promete una respuesta en un máximo de 30 días. Al lado está la consulta de protocolo.
- cro-to.vercel.app/admin/ouvidoria
Todas las solicitudes, por plazo
La bandeja del equipo muestra cada protocolo con su estado y un chip de plazo: vencido en rojo, cinco días o menos en ámbar, el resto neutral.
- cro-to.vercel.app/admin/ouvidoria
El plazo siempre a la vista
Una solicitud se abre con el solicitante, la respuesta oficial, una cronología y la fecha límite, que solo se ajusta con una prórroga justificada.
- cro-to.vercel.app/admin/esic
Solicitudes de información, con su propio reloj
Las solicitudes del e-SIC siguen la ley de acceso a la información, 20 días prorrogables por 10, con los mismos chips.
- 01 / 04
Una pregunta a la vez
El formulario público empieza por el tipo de solicitud, en cuatro pasos, y promete una respuesta en un máximo de 30 días. Al lado está la consulta de protocolo.
- 02 / 04
Todas las solicitudes, por plazo
La bandeja del equipo muestra cada protocolo con su estado y un chip de plazo: vencido en rojo, cinco días o menos en ámbar, el resto neutral.
- 03 / 04
El plazo siempre a la vista
Una solicitud se abre con el solicitante, la respuesta oficial, una cronología y la fecha límite, que solo se ajusta con una prórroga justificada.
- 04 / 04
Solicitudes de información, con su propio reloj
Las solicitudes del e-SIC siguen la ley de acceso a la información, 20 días prorrogables por 10, con los mismos chips.
03
El equipo publica por su cuenta
Panel, claro. Abre en los plazos, los más cercanos primero, con accesos rápidos para noticias, documentos y avisos de la página de inicio.
- cro-to.vercel.app/admin/noticias
Escribir
Título, un resumen con contador de caracteres, la URL y una portada de la biblioteca de medios, con estado, fecha y categoría al lado.
- cro-to.vercel.app/admin/noticias
Programar
Una publicación puede quedar como borrador, salir ahora o esperar una fecha y hora. Esta está programada para el 25 de octubre, el día del dentista en Brasil.
- cro-to.vercel.app/admin/midia
Una sola biblioteca de medios
Cada imagen y archivo pasa por una sola biblioteca, con búsqueda, filtros por tipo y carga con arrastrar y soltar.
- 01 / 03
Escribir
Título, un resumen con contador de caracteres, la URL y una portada de la biblioteca de medios, con estado, fecha y categoría al lado.
- 02 / 03
Programar
Una publicación puede quedar como borrador, salir ahora o esperar una fecha y hora. Esta está programada para el 25 de octubre, el día del dentista en Brasil.
- 03 / 03
Una sola biblioteca de medios
Cada imagen y archivo pasa por una sola biblioteca, con búsqueda, filtros por tipo y carga con arrastrar y soltar.
Documentos
Formularios, manuales e informes con estado, tamaño de archivo y un interruptor para mostrar cada uno en el sitio.
04
Doce años de archivo, migrados
484noticias
Del 15 de octubre de 2013 al 23 de diciembre de 2025, por categoría.
- Institucional184
- Comunicados104
- Saúde Bucal90
- Eventos89
- Fiscalização17
469archivos migrados
84,3 MB sacados del servidor anterior, agrupados según a qué pertenecen.
- Imágenes de noticias382
- Logos de socios28
- Legislación21
- Archivos de páginas19
- Documentos11
- Fotos de personas8
Conteos de los filtros de noticias y el sitemap del sitio en línea, y del manifiesto de archivos del importador. Las 23 normas están en las pantallas de legislación más abajo.
Un artículo migrado en el editor
Portada, resumen, texto y vista previa de búsqueda, todo trasladado al mismo editor que una publicación nueva. Desplázate dentro del marco para leerlo todo.
05
Una marca serena, legible para todos
Principios primero
La página del design system en línea abre con los principios que sigue cada pantalla.
- Un tema de alto contraste, controles de tamaño de texto y el widget oficial de Libras, la lengua de señas brasileña, en una barra en cada página.
- Un enlace para saltar al contenido, un encabezado principal por página, foco visible y áreas táctiles de 44 píxeles.
- Una animación de entrada en la página de inicio; todo lo demás se mueve solo cuando alguien actúa.
Impacto y aprendizajes
- Un sitio público, un panel de administración y un design system, en línea en cro-to.vercel.app, con el sistema en /croto-design. El dominio propio del consejo todavía muestra el sitio anterior.
- Doce años de archivo del consejo trasladados a un CMS hecho para su equipo: 484 noticias, 23 normas y 469 archivos.
- Cada queja y solicitud de información recibe un número de protocolo para el ciudadano y un plazo legal visible para el equipo.
- Un solo design system para el sitio público y el panel: 99 tokens en tres temas, con sus carencias conocidas listadas en la página.
Lo que aprendí
Escribir los principios, y con ellos las carencias conocidas, hizo fácil llevar cada mejora a todas las páginas.
