ATA 846 Que tu IA te dibuje los diagramas

Hoy te cuento cómo he dejado de dibujar diagramas a mano. Porque el problema no es dibujar: el problema es que el diagrama envejece. Lo haces un martes con sus cajas de colores y sus flechas bien alineadas, tocas una línea de código el miércoles y el dibujo sigue contando la historia de antes. Una caja que ya no existe, un servicio que se partió en dos y una flecha que apunta a un sitio por el que ya no pasa nadie. Es un mentiroso de museo, impecable y falso.

En el episodio 845 te hablé de cómo le di manos a mi asistente con 33 herramientas. Hoy le doy una más, pero distinta: un MCP de Excalidraw conectado a OpenCode. No para que genere una imagen bonita, sino para que controle un lienzo vivo, elemento a elemento. El agente dibuja, mira lo que ha dibujado y se corrige: alinea cajas solapadas, mueve etiquetas cortadas y repite hasta que está bien. Es un bucle cerrado en el que el que dibuja es el mismo que revisa.

Mermaid ya prometió los diagramas como texto y lo cumplió: son reproducibles, diffeables y versionables. Pero tiene una grieta: no hay lienzo. El layout lo decide el motor y para mover una caja dos píxeles te toca editar sintaxis o pelearte con CSS. Excalidraw es lo contrario: arrastras, colocas y ajustas. Y ahora el que arrastra es el modelo de lenguaje, gracias al MCP.

Hay dos MCP de Excalidraw: el oficial, con dos herramientas, y un toolkit con 26, lienzo con sincronización y exportación a PNG y SVG. Yo uso el toolkit. Lo instalo como skill en OpenCode con un npx, sin cuentas, sin API keys y sin clonar repos, y todo vive en mi equipo. En el episodio lo ves en directo: un cuadrado, un relleno, un triángulo, la evolución del hombre con sus ramas extintas y un diagrama funcional de oxidav, mi calendario CalDAV.

Y lo importante: el fichero .excalidraw se commitea junto al código, así que cualquier cambio se refleja en el diagrama y se ve en el diff. El PNG se regenera en CI sin navegador y sin phantom diffs. También te cuento los límites sin dramatizar y te doy el criterio para elegir entre Mermaid y Excalidraw MCP.

Capítulos0:00 - Intro: de la imagen muerta al diagrama editable2:33 - El diagrama que miente cuando el código evoluciona4:24 - Anuncios parroquiales: cambios en los repos4:51 - El diagrama no vive con tu código (y Mermaid tampoco lo arregla)6:22 - La propuesta: Excalidraw y un MCP con lienzo vivo9:12 - El bucle cerrado: dibuja, mira y corrige10:29 - Dos MCP y el toolkit de 26 herramientas10:58 - Instalarlo en OpenCode: un skill sin cuentas ni API keys11:52 - Demos: un cuadrado, la evolución del hombre y oxidav16:31 - Git y versionado: el diagrama como un fichero más20:43 - Límites y veredicto frente a Mermaid20:43 - Límites y veredicto frente a Mermaid22:06 - Cierre: dibuja una vez y actualízalo siempre

Más información y enlaces en las notas del episodio

• 🌐 Aquí lo puedes encontrar todo 👉 https://atareao.es
• ✈️ Telegram 👉 https://t.me/atareao_con_linux
• 🦣 Mastodon 👉 https://mastodon.social/@atareao
• 🐦 Twitter 👉 https://twitter.com/atareao
• 🐙 GitHub 👉 https://github.com/atareao