Gabriel Neuman
Gabriel Neuman
Productividad & Diseño

Excalidraw 2026: Diagramas, Flujos y Presentaciones con Estilo a Mano Alzada.

Guía completa de Excalidraw en español: cómo crear diagramas con IA (Claude Code), usarlo para presentaciones, mapear procesos antes de agentizarlos e integrarlo con Obsidian. Casos reales 2026.

Excalidraw es mi pizarra virtual de cabecera. Lo uso a diario para tres cosas concretas: mapear procesos antes de agentizarlos, armar slides hand-drawn para cerrar ventas y dibujar arquitecturas mientras hablo con Claude Code. No es la herramienta más sofisticada — es la más rápida. Y en consultoría, rápido gana.

¿Qué es Excalidraw?

Excalidraw es una pizarra virtual open-source con estética de dibujo a mano alzada. Funciona 100% en el navegador (también existe como app de escritorio, extensión de VS Code y plugin de Obsidian) y te permite crear diagramas que se ven humanos — no como los slides corporativos de siempre.

Lo que la hace distinta:

  • Cero fricción de entrada. Abres excalidraw.com, dibujas, exportas. No hay cuenta, no hay tutorial, no hay suscripción.
  • Estética hand-drawn que conecta. Los clientes no técnicos no se intimidan con un diagrama de Excalidraw como sí lo hacen con un Visio o un Lucidchart.
  • Archivos .excalidraw portables. El archivo es tuyo, en JSON. Lo abres en cualquier instancia, lo versionas en git, lo editas con IA.
  • Open-source de verdad. Licencia MIT, código en GitHub, comunidad activa.

¿Por qué lo uso todos los días?

Tres razones, en este orden:

  1. Velocidad. En 90 segundos tengo un diagrama listo para mandar a un cliente. En Figma me tomaría 15 minutos solo configurar el frame.
  2. La estética baja la guardia. Cuando muestro arquitectura de un sistema a un fundador no-técnico, un Excalidraw lo hace sentir parte de la conversación. Un diagrama corporativo lo hace sentir auditado.
  3. Es agente-friendly. Le puedo pedir a Claude Code que me genere un .excalidraw describiendo el sistema en texto. Para eso tldraw también sirve, pero el formato de Excalidraw es más estable y más documentado.

Excalidraw + Claude Code: diagramas generados por IA

Esta es la combinación que cambió mi flujo de documentación. En lugar de dibujar a mano un diagrama de 20 nodos, le describo el sistema a Claude Code y le pido que me genere el .excalidraw listo para abrir.

Cómo funciona:

  1. Le explicas a Claude en texto plano qué sistema quieres dibujar. Ejemplo: "Diagrama de flujo: usuario hace commit en GitHub → webhook dispara n8n → n8n crea issue en Linear → agente procesa el issue → publica en redes."
  2. Le pides que genere un archivo flujo.excalidraw con los nodos, las flechas y los labels.
  3. Abres el archivo en excalidraw.com (File → Open) y ajustas posiciones a mano si hace falta. El 80% del trabajo ya está hecho.

Lo que esto desbloquea:

  • Diagramas de arquitectura para propuestas en minutos en lugar de horas.
  • Documentación visual de skills y workflows que se actualiza con un prompt.
  • Mapas mentales de clusters SEO o funnels generados desde un brief.

Funciona también con la opción nativa "Text to Diagram" de Excalidraw+ (de pago), pero con Claude Code tienes más control sobre estilo, jerarquía y contenido. Y no pagas extra si ya usas Claude.

Excalidraw para presentaciones que cierran ventas

Las presentaciones corporativas son ruido. PowerPoint con bullets, plantillas de Canva con imágenes stock, Keynote con animaciones que distraen. Cuando lo que necesitas es que el cliente entienda y firme, un slide hand-drawn de Excalidraw funciona mejor porque parece pensado para él, no producido en masa.

Mi flujo para slides de ventas:

  1. Abro Excalidraw, fondo blanco.
  2. Un slide = un diagrama que explica una idea. Sin bullets. Sin viñetas.
  3. Exporto a PNG con padding generoso.
  4. Lo monto en un sistema de slides o lo pego directo en un PDF de propuesta.

Para presentaciones recurrentes, uso plantillas con la paleta de GNB Labs (negro #000, naranja #ff6b35, blanco). Las guardo en una carpeta de templates .excalidraw y las clono para cada cliente.

Excalidraw para mapear procesos antes de agentizarlos

Antes de convertir un proceso en un skill de Claude Code (/agentiza), lo mapeo en Excalidraw. La razón es práctica: cuando dibujo el flujo veo los huecos. Los pasos que faltan, las decisiones implícitas, los inputs que asumía que existían pero nadie te dio.

Plantilla mental que uso:

  • Trigger (qué empieza el proceso): nodo redondeado a la izquierda.
  • Pasos (qué pasa en orden): rectángulos en línea.
  • Decisiones (puntos donde el flujo se bifurca): rombos.
  • Outputs (qué entrega el proceso): rectángulos al final.
  • Owners (quién hace cada paso): etiqueta de color encima del nodo.

Cuando termino el diagrama, ese mismo archivo se vuelve el input del skill: lo subo al prompt y le pido a Claude que lo convierta en pasos del SOP. El skill nace ya con la lógica visual validada.

Este patrón lo aplico con cada cliente al armar soluciones de IA para PyMEs — es la diferencia entre un agente que funciona en producción y uno que se atora en el primer caso edge.

Excalidraw + Obsidian: notas visuales en tu segundo cerebro

Si usas Obsidian como segundo cerebro, el plugin Excalidraw para Obsidian (de Zsolt Viczián) es prácticamente obligatorio. Te da:

  • Notas visuales embebidas dentro de tus archivos markdown.
  • Linking bidireccional entre nodos del diagrama y notas en tu vault.
  • Templates personalizados por carpeta.
  • Exportación automática a PNG/SVG cuando guardas.

Cómo lo uso: cada cluster temático grande de mi segundo cerebro tiene un .excalidraw index que mapea las notas entre sí. Cuando agrego una nota nueva, voy al index y la conecto visualmente. En 6 meses esto se vuelve mucho más útil que cualquier tag system.

Cómo usar Excalidraw en 3 pasos (para empezar hoy)

  1. Entra a excalidraw.com — no necesitas cuenta.
  2. Dibuja: usa las figuras de la barra superior (rectángulos, flechas, texto, libre). Arrastra para conectar, doble click para escribir, Cmd/Ctrl + D para duplicar.
  3. Exporta: PNG, SVG o .excalidraw (File → Save / Export). Para compartir editable, usa "Live collaboration" — link en tiempo real sin cuenta.

Atajos que ahorran horas:

  • R rectángulo, O óvalo, A flecha, L línea, T texto.
  • Cmd/Ctrl + Shift + E exportar imagen.
  • Q lock del elemento. H mostrar/ocultar pizarra.
  • Shift + arrastrar mantiene proporción / ángulo recto.

Precios

Gratis para siempre en su versión open-source. El plan Excalidraw+ ($6–7 USD/mes) añade:

  • Workspaces y carpetas en la nube.
  • Historial de versiones automático.
  • Colaboración avanzada con permisos.
  • "Text to Diagram" con IA propietaria.

Para uso personal o de una sola persona, la versión gratis sobra. Si tienes equipo y necesitas sincronización seria, el plan de pago vale la pena.

Excalidraw vs alternativas (tabla)

Herramienta Gratis Hand-drawn IA generativa Mejor para
Excalidraw Sí (full) Sí (default) Vía Claude Code o Excalidraw+ Diagramas técnicos, slides, procesos
tldraw Sí (nativa, fuerte) Wireframes con IA, prototipos
Whimsical Limitado No No Wireframes pulidos, mind maps
Miro Limitado No Workshops grandes, retro de equipo
FigJam Limitado No Equipos que ya viven en Figma
Lucidchart Limitado No Diagramas formales de proceso/BD

Mi recomendación práctica: si vas a hacer un diagrama, usa Excalidraw. Si vas a hacer un workshop colaborativo con 15 personas, usa Miro o FigJam. Si vas a hacer wireframes serios, usa Figma o Whimsical.

Casos de uso reales (de mi semana típica)

  • Documentación de arquitectura: diagramas de sistemas, integraciones, flujo de datos para propuestas.
  • Flujos de automatización: mapeo visual de procesos en n8n o Make antes de construirlos.
  • Estrategia de contenido: mapas mentales de clusters SEO, funnels de marketing, planes editoriales.
  • Wireframes rápidos: sketch de pantallas antes de abrir Figma para validar idea con cliente.
  • Talleres y clases: la estética hand-drawn hace que la gente preste más atención y tome notas.
  • SOPs visuales: diagramas que acompañan procedimientos escritos para nuevos colaboradores.

Preguntas frecuentes

¿Excalidraw es gratis?
Sí, la versión open-source es gratis para siempre, sin marca de agua, sin login. Existe Excalidraw+ ($6–7 USD/mes) con funciones extra de equipo y nube.

¿Necesito crear cuenta en Excalidraw?
No. Entras a excalidraw.com y empiezas a dibujar. Solo necesitas cuenta si quieres Excalidraw+ o sincronización en la nube.

¿Cómo genero diagramas con IA en Excalidraw?
Dos caminos. Uno: usar el "Text to Diagram" nativo de Excalidraw+ (de pago). Dos: pedirle a Claude Code que genere un archivo .excalidraw describiendo el sistema en texto, y abrirlo en excalidraw.com. La segunda opción te da más control y no cuesta extra si ya usas Claude.

¿Excalidraw o tldraw, cuál es mejor en 2026?
Para diagramas técnicos y procesos: Excalidraw, por formato más estable y comunidad más grande. Para wireframes generados por IA: tldraw, por su integración nativa "Make Real". Yo uso Excalidraw por defecto y tldraw cuando necesito prototipar una UI rápido.

¿Puedo usar Excalidraw con Obsidian?
Sí, con el plugin oficial de Zsolt Viczián. Te permite crear diagramas embebidos en tus notas markdown con linking bidireccional. Para mí es prácticamente obligatorio si usas Obsidian seriamente.

¿Excalidraw sirve para presentaciones?
Sí, y particularmente bien si tu audiencia se cansa de slides corporativos. Exportas cada diagrama como PNG y los montas en un sistema de slides, un PDF o directo en una pantalla. Para presentaciones de venta funcionan mejor que un Canva o un PowerPoint.

¿Puedo colaborar en tiempo real con Excalidraw gratis?
Sí. La función "Live collaboration" del plan gratis genera un link que cualquiera puede abrir y editar contigo en tiempo real. Sin cuenta, sin instalación. Para colaboración permanente con permisos, necesitas Excalidraw+.

¿Excalidraw funciona offline?
Sí. La app web guarda en localStorage del navegador. Además existe app de escritorio (Mac/Windows/Linux) que funciona 100% offline y la extensión oficial para VS Code.

¿Cómo exporto un Excalidraw a PNG con buena resolución?
Cmd/Ctrl + Shift + E abre el exportador. Selecciona PNG, sube el factor a 2x o 3x para alta resolución, activa "padding" para dejar aire alrededor del diagrama. Si lo quieres con fondo transparente, desactiva "background".

Siguiente paso

Si quieres usar Excalidraw para mapear los procesos de tu negocio antes de automatizarlos, el camino más rápido es agendar una sesión de IA para PyMEs — ahí caminamos el flujo completo: dibujar el proceso, validarlo con tu equipo y agentizarlo con Claude Code.

Para el 90% de los casos de diagramación, Excalidraw sigue siendo mi primera opción. Velocidad, simplicidad y archivos portables. Lo demás es ruido.

Gabriel Neuman

Gabriel Neuman

Consultor en Automatización e IA con más de 15 años de experiencia. Ayudo a dueños de negocios a recuperar su tiempo mediante sistemas que trabajan solos. Fundador de GNB Labs y apasionado por el NoCode.

¿Listo para automatizar tu negocio?

Ayudo a empresas a escalar mediante automatización inteligente y estrategias de IA. Sin fricción, sin complicaciones, resultados en semanas.