Inteligencia artificial. Curiosidad humana.13.09.2026 / EDICIÓN EN ESPAÑOL
← Volver al radar
GitHubCómo funciona y para qué sirve

Diagram Design: diagramas editables en HTML y SVG con IA

Ayuda a representar ideas con gráficos que puedes retocar. El primer paso es decidir si necesitas explicar una secuencia, una responsabilidad o una comparación.

Círculos, rectángulos y rombos unidos sobre una hoja de dibujo: relaciones de un diagrama editable.
Ilustración conceptual de Texploto generada con IA. Representa la idea del artículo; no es una captura del producto.

La idea clave

Ayuda a representar ideas con gráficos que puedes retocar. El primer paso es decidir si necesitas explicar una secuencia, una responsabilidad o una comparación.

Hay explicaciones que mejoran en cuanto se convierten en un dibujo. El problema aparece cuando el gráfico añade adornos y deja intacta la confusión. Diagram Design ofrece a los agentes una base de diseño para convertir relaciones, procesos y comparaciones en piezas visuales editables.

Qué produce

La documentación consultada recoge 39 tipos de diagramas y variantes claras, oscuras y editoriales. La salida utiliza HTML y SVG; las variantes estáticas pueden abrirse en el navegador sin un proceso de compilación. El movimiento es opcional. El repositorio se distribuye con licencia MIT.

Los tipos incluyen flujos, cronologías, jerarquías y relaciones entre componentes. La skill puede guiar a un agente compatible para adaptar el resultado a un estilo visual y a un nivel de detalle determinado.

Cómo elegir el dibujo adecuado

Antes de pedir un gráfico, decide qué pregunta debe contestar. «¿Quién aprueba una devolución?» necesita mostrar responsabilidades y decisiones. «¿Cuándo ocurrió cada cambio?» necesita una cronología. «¿Qué parte ocupa cada categoría?» requiere datos comparables. Cambiar la forma del dibujo sin resolver esa pregunta solo cambia la decoración.

Un ejemplo nuestro de encargo sería: «Explica el recorrido de una devolución en cuatro pasos; diferencia cliente y tienda; marca el momento en que se decide el reembolso. Debe leerse en un móvil». Ese límite obliga a seleccionar la información relevante.

Del encargo vago a una pregunta visual

Ejemplo editorial

Encargo impreciso: «Haz un diagrama bonito de las devoluciones».

Encargo revisable: «Muestra quién recibe la solicitud, quién comprueba el pedido y quién autoriza el reembolso. Separa cliente y tienda. Incluye qué ocurre cuando falta el justificante».

La segunda versión permite comprobar el resultado: deben aparecer las responsabilidades, la decisión y la excepción. Un diagrama puede omitir muchos detalles y seguir siendo útil si responde a esa pregunta. Abre también el archivo a tamaño de móvil: si necesitas ampliar cada etiqueta, reduce contenido antes de reducir la letra.

Qué revisar antes de compartirlo

Elige un ejemplo oficial que se aproxime al caso y sigue las instrucciones de instalación para tu agente. Pide primero una versión estática. Después comprueba el tamaño de las etiquetas, el contraste, el orden de lectura y el significado de cada conexión.

En un gráfico de datos, revisa además escalas, unidades y procedencia de los valores. Una herramienta puede producir una composición convincente con cifras incorrectas si el encargo las contiene. La revisión visual y la revisión factual son trabajos diferentes.

En qué se diferencia de Archify

Nuestra lectura editorial es que Diagram Design invita a empezar por la comunicación visual de una idea, mientras que Archify pone especial énfasis en representar sistemas mediante una estructura validable. Hay solapamiento; el criterio útil es qué necesitas revisar después.

Para una explicación destinada a un artículo o una presentación, la posibilidad de retocar el archivo sin regenerar una imagen entera resulta atractiva. Conserva también una explicación textual: el diagrama debería facilitar la lectura a quienes puedan verlo, sin dejar fuera a quienes necesiten otra forma de acceder al contenido.

Guía basada en la documentación consultada el 13 de septiembre de 2026; no hemos realizado una prueba funcional del proyecto. Consulta también los diez proyectos de esta edición semanal.